react-a11y-auto-caption 1.1.5 → 1.1.7

package/README.md

@@ -1,6 +1,6 @@
 # react-a11y-auto-caption
 
-> AI-powered alt text generation component for React and Next.js images.
+> AI-powered alt text generation component for React and Next.js images.  
 > Generate captions during development, save them once, and reuse them in production for fast, accessible images.
 
 [![npm version](https://img.shields.io/npm/v/react-a11y-auto-caption.svg)](https://www.npmjs.com/package/react-a11y-auto-caption)
@@ -8,38 +8,83 @@
 [![Accessibility](https://img.shields.io/badge/Accessibility-100%25-brightgreen.svg)]()
 
 ---
+
 ## Why use react-a11y-auto-caption?
 
 - **Generate once, reuse forever** — create captions during development, save them, and skip AI calls in production.
 - **Built for accessibility** — automatically provide meaningful alt text for screen readers.
 - **Works with React and Next.js** — includes both `<SmartImage>` and `<SmartNextImage>`.
-- **Bring your own backend** — use your own FastAPI, Flask, or Node caption API.
-- **Production-friendly** — caching, duplicate-request protection, and error handling are built in.
+- **Local-first by default** — run the official caption server with `npx`.
+- **Production-friendly** — caching, duplicate-request protection, lazy generation, and error handling are built in.
+
+---
+
+## Installation
+
+```bash
+npm install react-a11y-auto-caption
+```
+
+or:
+
+```bash
+yarn add react-a11y-auto-caption
+```
+
+or:
+
+```bash
+pnpm add react-a11y-auto-caption
+```
 
 ---
 
 ## Quick Start
 
-### React
+### 1. Start the local caption server
+
+```bash
+npx react-a11y-auto-caption-server
+```
+
+Default endpoint:
+
+```txt
+http://127.0.0.1:8000/api/generate-caption
+```
+
+If port `8000` is unavailable, use another port:
+
+```bash
+npx react-a11y-auto-caption-server --port 5000
+```
+
+Then use:
+
+```txt
+http://127.0.0.1:5000/api/generate-caption
+```
+
+### 2. Use `SmartImage`
 
 ```tsx
-import { SmartImage } from 'react-a11y-auto-caption';
+import { SmartImage } from "react-a11y-auto-caption";
 
 export default function Demo() {
   return (
     <SmartImage
-      src="https://example.com/image.jpg"
-      apiEndpoint="http://localhost:8000/api/generate-caption"
+      src="/example.jpg"
+      apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
     />
   );
 }
 ```
 
-### Next.js
+### 3. Use `SmartNextImage`
 
 ```tsx
-import { SmartNextImage } from 'react-a11y-auto-caption/next';
-import sampleImage from '../public/sample.jpg';
+import { SmartNextImage } from "react-a11y-auto-caption/next";
+import sampleImage from "../public/sample.jpg";
 
 export default function Demo() {
   return (
@@ -47,159 +92,261 @@ export default function Demo() {
       src={sampleImage}
       width={500}
       height={300}
-      apiEndpoint="http://localhost:8000/api/generate-caption"
+      apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
     />
   );
 }
 ```
-> **Optional**: set the API endpoint once with a Provider
 
-### Wrap your app with the Provider (Optional but Recommended)
+---
+
+## Provider Setup
 
-Set your backend API endpoint once globally. Otherwise, pass `apiEndpoint` directly as a prop.
+You can set the backend API endpoint once globally instead of passing `apiEndpoint` to every image.
 
 ```tsx
-// App.tsx or layout.tsx
 import { SmartImageProvider } from "react-a11y-auto-caption";
 
 export default function App({ children }) {
   return (
-    <SmartImageProvider value={{ apiEndpoint: "https://your-api.com/api/generate-caption" }}>
+    <SmartImageProvider
+      value={{
+        apiEndpoint: "http://127.0.0.1:8000/api/generate-caption",
+      }}
+    >
       {children}
     </SmartImageProvider>
   );
 }
 ```
 
+Then use `SmartImage` without repeating the endpoint:
+
+```tsx
+<SmartImage src="/example.jpg" />
+```
+
 ---
 
-## Installation
+## Recommended Workflow
 
-```bash
-# npm
-npm install react-a11y-auto-caption
+1. Run the local caption server with `npx react-a11y-auto-caption-server`
+2. Generate captions during development
+3. Save generated captions to your database with `onCaptionGenerated`
+4. Pass the saved `alt` text in production
+5. Skip AI requests entirely for faster production pages
 
-# yarn
-yarn add react-a11y-auto-caption
+Example:
 
-# pnpm
-pnpm add react-a11y-auto-caption
+```tsx
+<SmartImage
+  src="/example.jpg"
+  alt={savedAlt || undefined}
+  apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
+  onCaptionGenerated={(caption) => {
+    saveAltTextToDatabase(caption);
+  }}
+/>
 ```
 
+> If `alt` is provided, AI generation is bypassed. This is intentional so saved captions can be reused in production.
+
 ---
-## Recommended workflow
 
-1. Generate captions during local development with light [python server](https://github.com/kong33/SmartImage)
-2. Save them to your database with `onCaptionGenerated`
-3. Pass the saved `alt` text in production
-4. Skip AI requests entirely for zero extra latency
+## Public Demo Server
+
+You can test the package with the public demo server:
+
+```txt
+https://kong3333-react-a11y-auto-caption-server.hf.space/api/generate-caption
+```
+
+Example:
+
+```tsx
+<SmartImage
+  src="/example.jpg"
+  apiEndpoint="https://kong3333-react-a11y-auto-caption-server.hf.space/api/generate-caption"
+/>
+```
+
+> The public demo server is for testing only. It may be slow, paused, or unavailable depending on free-tier limits.  
+> For production, run your own caption server.
+
+---
+
+## Backend Integration
+
+This package needs a caption API endpoint that accepts an image file and returns a caption.
+
+The official local server is the easiest option:
+
+```bash
+npx react-a11y-auto-caption-server
+```
+
+Default endpoint:
+
+```txt
+http://127.0.0.1:8000/api/generate-caption
+```
+
+Custom port:
+
+```bash
+npx react-a11y-auto-caption-server --port 5000
+```
+
+Custom endpoint:
+
+```txt
+http://127.0.0.1:5000/api/generate-caption
+```
+
+The caption server automatically allows local development origins such as:
+
+```txt
+http://localhost:<any-port>
+http://127.0.0.1:<any-port>
+```
+
+For production or internal company servers, configure `ALLOWED_ORIGINS` on the server side.
+
+Example:
+
+```env
+ALLOWED_ORIGINS=https://your-frontend-domain.com,http://localhost:3000
+```
+
+If your frontend runs locally but the caption server runs on another machine, your frontend endpoint should point to that machine:
+
+```tsx
+<SmartImage
+  src="/example.jpg"
+  apiEndpoint="http://192.168.0.20:8000/api/generate-caption"
+/>
+```
 
 ---
 
 ## API Reference
 
-Both `<SmartImage>` and `<SmartNextImage>` inherit all standard HTML `<img>` (or `next/image`) attributes, plus the following:
+Both `<SmartImage>` and `<SmartNextImage>` inherit standard HTML `<img>` or `next/image` props, plus the following:
 
 | Prop | Type | Default | Description |
 | :--- | :--- | :--- | :--- |
 | `apiEndpoint` | `string` | `undefined` | The URL of your AI backend API. Overrides the `SmartImageProvider` endpoint if provided. |
 | `alt` | `string` | `undefined` | Manual alt text. If provided, AI generation is completely bypassed. |
-| `fallbackAlt` | `string` | `"Image loading or caption unavailable"` | Text used when the AI request fails or times out. |
-| `lazyGenerate` | `boolean` | `true` | Delays AI API calls until the image enters the viewport using `IntersectionObserver`.|
-| `disableAI` | `boolean` | `false` | Disables AI generation and uses a mock caption. Recommended for testing. |
-| `announceLive` | `boolean` | `false` | Enables `aria-live` region to announce generation status to screen readers. |
+| `fallbackAlt` | `string` | `"Image loading or caption unavailable"` | Text used when the AI request fails. |
+| `lazyGenerate` | `boolean` | `true` | Delays AI API calls until the image enters the viewport using `IntersectionObserver`. |
+| `disableAI` | `boolean` | `false` | Disables AI generation and uses a mock caption. Useful for tests. |
+| `announceLive` | `boolean` | `false` | Enables an `aria-live` region to announce generation status to screen readers. |
 | `onCaptionGenerated` | `(caption: string) => void` | `undefined` | Callback fired when a caption is successfully generated. |
-| `onCaptionError` | `(error: Error) => void` | `undefined` | Callback fired when caption generation fails. Use for logging or toast notifications. |
+| `onCaptionError` | `(error: Error) => void` | `undefined` | Callback fired when caption generation fails. Useful for logging or toast notifications. |
 
-> **Note:** `<SmartNextImage>` requires standard Next.js image props such as `width` and `height` (unless using `fill`).
+> `<SmartNextImage>` requires standard Next.js image props such as `width` and `height`, unless using `fill`.
 
 ---
 
 ## Error Handling
 
-You can handle errors in two ways depending on your use case.
-
-**Via callback** — for external handling like logging or toasts:
+Use `onCaptionError` for logging, toast messages, or debugging.
 
 ```tsx
 <SmartImage
-  src={imageUrl}
-  onCaptionError={(err) => toast.error(err.message)}
+  src="/example.jpg"
+  apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
+  onCaptionError={(error) => {
+    console.error("Caption generation failed:", error);
+  }}
 />
 ```
 
-**Via `useAICaptions` hook** — for UI branching:
+You can also use the hook directly:
 
 ```tsx
-const { generatedAlt, isGenerating, error } = useAICaptions({ src });
+const { generatedAlt, isGenerating, error } = useAICaptions({
+  src: "/example.jpg",
+  apiEndpoint: "http://127.0.0.1:8000/api/generate-caption",
+});
 
 if (error) return <p>Failed to generate caption.</p>;
 ```
 
 ---
 
-## Backend Integration
+## Troubleshooting
 
-This package needs a caption API endpoint to generate alt text.
+### API request does not run
 
-We offer a public demo server for testing. Set API endpoint as:
+Check that:
 
-```bash
-https://kong3333-react-a11y-auto-caption-server.hf.space/api/generate-caption
-```
+- `apiEndpoint` points to `/api/generate-caption`
+- the caption server is running
+- the frontend endpoint uses the same port as the server
+- `alt` is not already provided if you expect AI generation
+- `lazyGenerate={false}` is used while debugging viewport-related issues
+- the latest package version is installed
 
-> This public demo server is for testing only and may be slow or unavailable depending on free-tier limits.
-> For production, please run your own caption server.
+Debug example:
 
-The easiest way is to run the official local server:
-
-```bash
-npx react-a11y-auto-caption-server
+```tsx
+<SmartImage
+  src="/example.jpg"
+  apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
+  lazyGenerate={false}
+  onCaptionGenerated={(caption) => console.log("Generated:", caption)}
+  onCaptionError={(error) => console.error("Caption error:", error)}
+/>
 ```
 
-By default, the server runs at:
+### Port 8000 is unavailable
 
-```txt
-http://127.0.0.1:8000/api/generate-caption
+Run the server on another port:
+
+```bash
+npx react-a11y-auto-caption-server --port 8001
 ```
 
-Use it with `SmartImage` or `SmartNextImage`:
+Then update your frontend:
 
 ```tsx
 <SmartImage
   src="/example.jpg"
-  apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
+  apiEndpoint="http://127.0.0.1:8001/api/generate-caption"
 />
 ```
 
-You can also change the port:
-
-```bash
-npx react-a11y-auto-caption-server --port 5000
-```
+### External image URLs
 
-Then update the endpoint:
+If an external image URL fails before reaching the caption server, try a local image first:
 
 ```tsx
 <SmartImage
-  src="/example.jpg"
-  apiEndpoint="http://127.0.0.1:5000/api/generate-caption"
+  src="/sample.jpg"
+  apiEndpoint="http://127.0.0.1:8000/api/generate-caption"
 />
 ```
 
-> First run may take a few minutes because the server creates a Python environment and installs AI dependencies.
+Some external image hosts block browser-side `fetch()` access even if the image displays correctly in an `<img>` tag.
+
+---
+
+## What's New
 
-For production, we recommend running your own caption server and applying CORS restrictions, file size limits, and rate limiting.
+- Fixed lazy generation so captions are triggered correctly after images enter the viewport.
+- Added official `npx react-a11y-auto-caption-server` workflow.
+- Added custom backend server port support.
+- Added public demo server option for quick testing.
 
 ---
 
-## What's New in v1.0.4
+## Related
+
+- [`react-a11y-auto-caption-server`](https://www.npmjs.com/package/react-a11y-auto-caption-server)
+
+---
 
-- **LRU Cache:** Replaced unbounded `Map` cache with an LRU implementation to prevent memory leaks in long-running apps.
-- **`onCaptionError` callback:** New prop to handle caption generation failures externally (e.g. logging, toast notifications).
-- **`error` state:** `useAICaptions` hook now returns an `error` field so you can branch your UI on failure.
-- **Unmount safety:** Caption generation is now safely cancelled when a component unmounts, preventing stale state updates.
-- **Next.js static import support:** `<SmartNextImage>` now correctly resolves both `StaticImageData` and `StaticRequire` import types.
-- **Subpath exports:** Added `react-a11y-auto-caption/next` entry point for cleaner Next.js-specific imports.
+## License
 
-  
+MIT

package/dist/index.js

@@ -101,6 +101,9 @@ var useAICaptions = ({
     const timer = setTimeout(() => setAnnouncemet(""), 5e3);
     return () => clearTimeout(timer);
   }, [announcement]);
+  (0, import_react.useEffect)(() => {
+    setShouldGenerate(!lazyGenerate);
+  }, [src, lazyGenerate]);
   (0, import_react.useEffect)(() => {
     if (!lazyGenerate || !imgRef.current) return;
     const observer = new IntersectionObserver(
@@ -114,7 +117,7 @@ var useAICaptions = ({
     );
     observer.observe(imgRef.current);
     return () => observer.disconnect();
-  }, [lazyGenerate]);
+  }, [lazyGenerate, src]);
   (0, import_react.useEffect)(() => {
     setError(null);
     if (alt) {
@@ -192,7 +195,7 @@ var useAICaptions = ({
     return () => {
       cancelled = true;
     };
-  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);
+  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);
   return { generatedAlt, isGenerating, error, imgRef, announcement };
 };
 

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.tsx","../src/useAICaption.ts"],"sourcesContent":["import React, { ImgHTMLAttributes } from \"react\";\r\nimport { SmartImageContext, useAICaptions } from \"./useAICaption\";\r\n\r\ntype smartImageProviderProps = {\r\n  value: { apiEndpoint?: string; disableAI?: boolean };\r\n  children: React.ReactNode;\r\n};\r\nexport const SmartImageProvider = ({ value, children }: smartImageProviderProps) => {\r\n  return <SmartImageContext.Provider value={value}>{children}</SmartImageContext.Provider>;\r\n};\r\nexport * from './useAICaption';\r\n\r\nexport interface SmartImageProps extends ImgHTMLAttributes<HTMLImageElement> {\r\n  src?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\nconst SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\n\r\nexport const SmartImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n      <img src={src} ref={imgRef} alt={generatedAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n","import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/index.tsx","../src/useAICaption.ts"],"sourcesContent":["import React, { ImgHTMLAttributes } from \"react\";\r\nimport { SmartImageContext, useAICaptions } from \"./useAICaption\";\r\n\r\ntype smartImageProviderProps = {\r\n  value: { apiEndpoint?: string; disableAI?: boolean };\r\n  children: React.ReactNode;\r\n};\r\nexport const SmartImageProvider = ({ value, children }: smartImageProviderProps) => {\r\n  return <SmartImageContext.Provider value={value}>{children}</SmartImageContext.Provider>;\r\n};\r\nexport * from './useAICaption';\r\n\r\nexport interface SmartImageProps extends ImgHTMLAttributes<HTMLImageElement> {\r\n  src?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\nconst SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\n\r\nexport const SmartImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n      <img src={src} ref={imgRef} alt={generatedAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n","import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n\r\n  useEffect(() => {\r\n  setShouldGenerate(!lazyGenerate);\r\n  }, [src, lazyGenerate]);\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate, src])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n"],"mappings":"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","names":[]}

package/dist/index.mjs

@@ -72,6 +72,9 @@ var useAICaptions = ({
     const timer = setTimeout(() => setAnnouncemet(""), 5e3);
     return () => clearTimeout(timer);
   }, [announcement]);
+  useEffect(() => {
+    setShouldGenerate(!lazyGenerate);
+  }, [src, lazyGenerate]);
   useEffect(() => {
     if (!lazyGenerate || !imgRef.current) return;
     const observer = new IntersectionObserver(
@@ -85,7 +88,7 @@ var useAICaptions = ({
     );
     observer.observe(imgRef.current);
     return () => observer.disconnect();
-  }, [lazyGenerate]);
+  }, [lazyGenerate, src]);
   useEffect(() => {
     setError(null);
     if (alt) {
@@ -163,7 +166,7 @@ var useAICaptions = ({
     return () => {
       cancelled = true;
     };
-  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);
+  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);
   return { generatedAlt, isGenerating, error, imgRef, announcement };
 };
 

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/useAICaption.ts","../src/index.tsx"],"sourcesContent":["import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n","import React, { ImgHTMLAttributes } from \"react\";\r\nimport { SmartImageContext, useAICaptions } from \"./useAICaption\";\r\n\r\ntype smartImageProviderProps = {\r\n  value: { apiEndpoint?: string; disableAI?: boolean };\r\n  children: React.ReactNode;\r\n};\r\nexport const SmartImageProvider = ({ value, children }: smartImageProviderProps) => {\r\n  return <SmartImageContext.Provider value={value}>{children}</SmartImageContext.Provider>;\r\n};\r\nexport * from './useAICaption';\r\n\r\nexport interface SmartImageProps extends ImgHTMLAttributes<HTMLImageElement> {\r\n  src?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\nconst SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\n\r\nexport const SmartImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n      <img src={src} ref={imgRef} alt={generatedAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/useAICaption.ts","../src/index.tsx"],"sourcesContent":["import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n\r\n  useEffect(() => {\r\n  setShouldGenerate(!lazyGenerate);\r\n  }, [src, lazyGenerate]);\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate, src])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n","import React, { ImgHTMLAttributes } from \"react\";\r\nimport { SmartImageContext, useAICaptions } from \"./useAICaption\";\r\n\r\ntype smartImageProviderProps = {\r\n  value: { apiEndpoint?: string; disableAI?: boolean };\r\n  children: React.ReactNode;\r\n};\r\nexport const SmartImageProvider = ({ value, children }: smartImageProviderProps) => {\r\n  return <SmartImageContext.Provider value={value}>{children}</SmartImageContext.Provider>;\r\n};\r\nexport * from './useAICaption';\r\n\r\nexport interface SmartImageProps extends ImgHTMLAttributes<HTMLImageElement> {\r\n  src?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\nconst SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\n\r\nexport const SmartImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n      <img src={src} ref={imgRef} alt={generatedAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n"],"mappings":"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","names":[]}

package/dist/next.js

@@ -111,6 +111,9 @@ var useAICaptions = ({
     const timer = setTimeout(() => setAnnouncemet(""), 5e3);
     return () => clearTimeout(timer);
   }, [announcement]);
+  (0, import_react.useEffect)(() => {
+    setShouldGenerate(!lazyGenerate);
+  }, [src, lazyGenerate]);
   (0, import_react.useEffect)(() => {
     if (!lazyGenerate || !imgRef.current) return;
     const observer = new IntersectionObserver(
@@ -124,7 +127,7 @@ var useAICaptions = ({
     );
     observer.observe(imgRef.current);
     return () => observer.disconnect();
-  }, [lazyGenerate]);
+  }, [lazyGenerate, src]);
   (0, import_react.useEffect)(() => {
     setError(null);
     if (alt) {
@@ -202,7 +205,7 @@ var useAICaptions = ({
     return () => {
       cancelled = true;
     };
-  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);
+  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);
   return { generatedAlt, isGenerating, error, imgRef, announcement };
 };
 

package/dist/next.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/next.tsx","../src/useAICaption.ts"],"sourcesContent":["\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Image, { ImageProps } from \"next/image\";\r\n\r\nimport { useAICaptions } from \"./useAICaption\";\r\n\r\nexport interface SmartNextImageProps extends Omit<ImageProps, \"alt\"> {\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\nexport const SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\nexport const SmartNextImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartNextImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n\r\n      <Image src={src} ref={imgRef} alt={generatedAlt || fallbackAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n","import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n"],"mappings":"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","names":["Image"]}
+{"version":3,"sources":["../src/next.tsx","../src/useAICaption.ts"],"sourcesContent":["\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Image, { ImageProps } from \"next/image\";\r\n\r\nimport { useAICaptions } from \"./useAICaption\";\r\n\r\nexport interface SmartNextImageProps extends Omit<ImageProps, \"alt\"> {\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\nexport const SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\nexport const SmartNextImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartNextImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n\r\n      <Image src={src} ref={imgRef} alt={generatedAlt || fallbackAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n","import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n\r\n  useEffect(() => {\r\n  setShouldGenerate(!lazyGenerate);\r\n  }, [src, lazyGenerate]);\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate, src])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n"],"mappings":"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","names":["Image"]}

package/dist/next.mjs

@@ -77,6 +77,9 @@ var useAICaptions = ({
     const timer = setTimeout(() => setAnnouncemet(""), 5e3);
     return () => clearTimeout(timer);
   }, [announcement]);
+  useEffect(() => {
+    setShouldGenerate(!lazyGenerate);
+  }, [src, lazyGenerate]);
   useEffect(() => {
     if (!lazyGenerate || !imgRef.current) return;
     const observer = new IntersectionObserver(
@@ -90,7 +93,7 @@ var useAICaptions = ({
     );
     observer.observe(imgRef.current);
     return () => observer.disconnect();
-  }, [lazyGenerate]);
+  }, [lazyGenerate, src]);
   useEffect(() => {
     setError(null);
     if (alt) {
@@ -168,7 +171,7 @@ var useAICaptions = ({
     return () => {
       cancelled = true;
     };
-  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);
+  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);
   return { generatedAlt, isGenerating, error, imgRef, announcement };
 };
 

package/dist/next.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/next.tsx","../src/useAICaption.ts"],"sourcesContent":["\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Image, { ImageProps } from \"next/image\";\r\n\r\nimport { useAICaptions } from \"./useAICaption\";\r\n\r\nexport interface SmartNextImageProps extends Omit<ImageProps, \"alt\"> {\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\nexport const SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\nexport const SmartNextImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartNextImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n\r\n      <Image src={src} ref={imgRef} alt={generatedAlt || fallbackAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n","import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/next.tsx","../src/useAICaption.ts"],"sourcesContent":["\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Image, { ImageProps } from \"next/image\";\r\n\r\nimport { useAICaptions } from \"./useAICaption\";\r\n\r\nexport interface SmartNextImageProps extends Omit<ImageProps, \"alt\"> {\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\nexport const SR_ONLY_STYLE: React.CSSProperties = {\r\n  position: \"absolute\",\r\n  width: \"1px\",\r\n  height: \"1px\",\r\n  padding: 0,\r\n  margin: \"-1px\",\r\n  overflow: \"hidden\",\r\n  clip: \"rect(0, 0, 0, 0)\",\r\n  whiteSpace: \"nowrap\",\r\n  borderWidth: 0,\r\n};\r\nexport const SmartNextImage = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  onCaptionError,\r\n  disableAI: propsDisableAI,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n  ...props\r\n}: SmartNextImageProps) => {\r\n  const { isGenerating, generatedAlt, announcement, imgRef } = useAICaptions({\r\n    src,\r\n    alt,\r\n    apiEndpoint: propsEndpoint,\r\n    fallbackAlt,\r\n    onCaptionGenerated,\r\n    disableAI: propsDisableAI,\r\n    announceLive,\r\n    lazyGenerate,\r\n  });\r\n  return (\r\n    <>\r\n      {announceLive && (\r\n        <span style={SR_ONLY_STYLE} aria-live=\"polite\" aria-atomic=\"true\">\r\n          {announcement}\r\n        </span>\r\n      )}\r\n\r\n      <Image src={src} ref={imgRef} alt={generatedAlt || fallbackAlt} aria-busy={isGenerating} {...props} />\r\n    </>\r\n  );\r\n};\r\n","import { StaticImport } from \"next/dist/shared/lib/get-img-props\";\r\nimport { StaticImageData } from \"next/image\";\r\nimport { createContext, useContext, useEffect, useRef, useState } from \"react\";\r\n\r\nexport interface UseAICaptionOptions {\r\n  src?: string | StaticImport;\r\n  alt?: string;\r\n  apiEndpoint?: string;\r\n  fallbackAlt?: string;\r\n  onCaptionGenerated?: (caption: string) => void;\r\n  onCaptionError?: (error: Error) => void;\r\n  disableAI?: boolean;\r\n  announceLive?: boolean;\r\n  lazyGenerate?: boolean;\r\n}\r\n\r\ninterface SmartImageContextProps {\r\n  apiEndpoint?: string;\r\n  disableAI?: boolean;\r\n}\r\n\r\nexport const SmartImageContext = createContext<SmartImageContextProps | undefined>(undefined);\r\n\r\nconst MAX_SIZE = 500;\r\n\r\nclass LRUCaptionCache {\r\n  private cache = new Map<string, string>();\r\n\r\n  get(key: string): string | undefined {\r\n    if (!this.cache.has(key)) return undefined;\r\n\r\n    const value = this.cache.get(key)!;\r\n    this.cache.delete(key);\r\n    this.cache.set(key, value);\r\n    return value;\r\n  }\r\n  set(key: string, value: string) {\r\n    if (this.cache.has(key)) {\r\n      this.cache.delete(key);\r\n    }\r\n    if (this.cache.size >= MAX_SIZE) {\r\n      this.cache.delete(this.cache.keys().next().value!);\r\n    }\r\n    this.cache.set(key, value);\r\n  }\r\n  has(key: string) {\r\n    return this.cache.has(key);\r\n  }\r\n  clear() {\r\n    this.cache.clear();\r\n  }\r\n}\r\n\r\nconst captionCache = new LRUCaptionCache();\r\nconst pendingRequestCache = new Map<string, Promise<string>>();\r\n\r\nfunction isStaticImageData(src: string | StaticImport): src is StaticImageData {\r\n  return typeof src === \"object\" && src !== null && \"src\" in src;\r\n}\r\n\r\nfunction resolveImageUrl(src: string | StaticImport): string {\r\n  if (typeof src === \"string\") return src;\r\n  if (isStaticImageData(src)) return src.src;\r\n  return src.default.src;\r\n}\r\n\r\nconst log = process.env.NODE_ENV === \"development\" ? console.log : () => {};\r\n\r\nexport const useAICaptions = ({\r\n  src,\r\n  alt,\r\n  apiEndpoint: propsEndpoint,\r\n  fallbackAlt = \"Image loading or caption unavailable\",\r\n  onCaptionGenerated,\r\n  disableAI: propsDisableAI,\r\n  onCaptionError,\r\n  announceLive = false,\r\n  lazyGenerate = true,\r\n}: UseAICaptionOptions) => {\r\n  const context = useContext(SmartImageContext);\r\n\r\n  const apiEndpoint = propsEndpoint || context?.apiEndpoint;\r\n  const disableAI = propsDisableAI ?? context?.disableAI ?? false;\r\n\r\n  const [generatedAlt, setGeneratedAlt] = useState(\"\");\r\n  const [isGenerating, setIsGenerating] = useState(false);\r\n  const [error, setError] = useState<Error | null>(null);\r\n  const [announcement, setAnnouncemet] = useState(\"\");\r\n  const [shouldGenerate, setShouldGenerate] = useState(!lazyGenerate);\r\n  const onCaptionGeneratedRef = useRef(onCaptionGenerated);\r\n  const onCaptionErrorRef = useRef(onCaptionError);\r\n\r\n  const imgRef = useRef < HTMLImageElement | null>(null);\r\n\r\n  \r\n  useEffect(() => {\r\n    onCaptionGeneratedRef.current = onCaptionGenerated;\r\n    onCaptionErrorRef.current = onCaptionError;\r\n  });\r\n\r\n  useEffect(() => {\r\n    if (!announcement) return;\r\n    const timer = setTimeout(() => setAnnouncemet(\"\"), 5000);\r\n    return () => clearTimeout(timer)\r\n  }, [announcement])\r\n\r\n  useEffect(() => {\r\n  setShouldGenerate(!lazyGenerate);\r\n  }, [src, lazyGenerate]);\r\n  \r\n  useEffect(() => {\r\n    if (!lazyGenerate || !imgRef.current) return;\r\n\r\n    const observer = new IntersectionObserver(\r\n      ([entry]) => {\r\n        if (entry.isIntersecting) {\r\n          setShouldGenerate(true);\r\n          observer.disconnect();\r\n        }\r\n      },\r\n      { rootMargin: \"200px\" }\r\n    );\r\n    observer.observe(imgRef.current);\r\n    return () => observer.disconnect();\r\n  }, [lazyGenerate, src])\r\n\r\n\r\n  useEffect(() => {\r\n    setError(null);\r\n\r\n    if (alt) {\r\n      setGeneratedAlt(alt);\r\n      return;\r\n    }\r\n\r\n    if (!src || !shouldGenerate) return;\r\n\r\n    if (disableAI) {\r\n      setGeneratedAlt(\"[Testing mode: AI caption generation disabled]\");\r\n      return;\r\n    }\r\n\r\n    if (!apiEndpoint) {\r\n      console.warn(\r\n        \"[SmartImage] Missing 'apiEndpoint' prop. Please provide a backend API URL via props or SmartImageProvider to enable AI caption generation.\",\r\n      );\r\n      setGeneratedAlt(fallbackAlt);\r\n      return;\r\n    }\r\n\r\n    const imageUrl = resolveImageUrl(src);\r\n\r\n    if (captionCache.has(imageUrl)) {\r\n      log(\"[SmartImage] Cache hit: Reusing existing caption.\");\r\n      const cachedCaption = captionCache.get(imageUrl)!;\r\n      setGeneratedAlt(cachedCaption);\r\n      if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(cachedCaption);\r\n      return;\r\n    }\r\n\r\n    let cancelled = false;\r\n\r\n    const generateCaption = async () => {\r\n      setIsGenerating(true);\r\n      try {\r\n        if (pendingRequestCache.has(imageUrl)) {\r\n          log(\"[SmartImage] Pending request detected. Waiting for the existing API call to complete.\");\r\n          const caption = await pendingRequestCache.get(imageUrl)!;\r\n          if (cancelled) return;\r\n          setGeneratedAlt(caption);\r\n          if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(caption);\r\n          return;\r\n        }\r\n\r\n        const fetchPromise = (async () => {\r\n          const imageResponse = await fetch(imageUrl);\r\n          const imageBlob = await imageResponse.blob();\r\n          const imageFile = new File([imageBlob], \"image.jpg\", {\r\n            type: imageBlob.type || \"image/jpeg\",\r\n          });\r\n          const formData = new FormData();\r\n          formData.append(\"file\", imageFile);\r\n\r\n          const response = await fetch(apiEndpoint, {\r\n            method: \"POST\",\r\n            body: formData,\r\n          });\r\n\r\n          if (!response.ok) throw new Error(\"AI API request failed\");\r\n          const data = await response.json();\r\n          if (data.caption) return data.caption;\r\n          throw new Error(\"No caption returned from the API.\");\r\n        })();\r\n\r\n        pendingRequestCache.set(imageUrl, fetchPromise);\r\n\r\n        const newCaption = await fetchPromise;\r\n        pendingRequestCache.delete(imageUrl);\r\n        captionCache.set(imageUrl, newCaption);\r\n\r\n        if (cancelled) return;\r\n        setGeneratedAlt(newCaption);\r\n        if (onCaptionGeneratedRef.current) onCaptionGeneratedRef.current(newCaption);\r\n      } catch (err) {\r\n        const normalizedError = err instanceof Error ? err : new Error(\"Unknown error\");\r\n        pendingRequestCache.delete(imageUrl);\r\n        if (cancelled) return;\r\n        setError(normalizedError);\r\n        setGeneratedAlt(fallbackAlt);\r\n        if (onCaptionErrorRef.current) onCaptionErrorRef.current(normalizedError);\r\n      } finally {\r\n        if (!cancelled) setIsGenerating(false);\r\n      }\r\n    };\r\n\r\n    generateCaption();\r\n\r\n    return () => {\r\n      cancelled = true;\r\n    };\r\n  }, [src, alt, apiEndpoint, fallbackAlt, disableAI, shouldGenerate]);\r\n\r\n  return { generatedAlt, isGenerating, error, imgRef, announcement };\r\n};\r\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-a11y-auto-caption",
-  "version": "1.1.5",
+  "version": "1.1.7",
   "description": "Smart React component that automatically generates alt text for images using AI.",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",