react-sharesheet 1.9.1 → 1.10.0

package/src/content.ts

@@ -2,3 +2,4 @@ export { ShareSheetContent, ShareMenuContent } from "./ShareSheetContent";
 export type { ShareSheetContentProps, ShareSheetContentClassNames, ShareMenuContentProps, ShareMenuContentClassNames, ShareOption } from "./types";
 export { CSS_VARS_UI, CSS_VAR_UI_DEFAULTS, CSS_VARS, CSS_VAR_DEFAULTS } from "./types";
 export { PLATFORM_COLORS, PLATFORM_CSS_VARS } from "./platforms";
+export { fetchOGData, type OGData, type OGFetcher } from "./og-fetcher";

package/src/drawer.ts

@@ -2,3 +2,4 @@ export { ShareSheetDrawer, ShareMenuDrawer } from "./ShareSheetDrawer";
 export type { ShareSheetDrawerProps, ShareSheetDrawerClassNames, ShareMenuDrawerProps, ShareMenuDrawerClassNames, ShareOption } from "./types";
 export { CSS_VARS_UI, CSS_VAR_UI_DEFAULTS, CSS_VARS, CSS_VAR_DEFAULTS } from "./types";
 export { PLATFORM_COLORS, PLATFORM_CSS_VARS } from "./platforms";
+export { fetchOGData, type OGData, type OGFetcher } from "./og-fetcher";

package/src/headless.ts

@@ -3,7 +3,7 @@
 export { useShareSheet, useShareMenu, useOGData, type UseShareSheetOptions, type UseShareMenuOptions } from "./hooks";
 
 // OG Data fetcher
-export { fetchOGData, clearOGCache, type OGData } from "./og-fetcher";
+export { fetchOGData, clearOGCache, type OGData, type OGFetcher } from "./og-fetcher";
 
 export {
   shareToWhatsApp,

package/src/hooks.ts

@@ -1,8 +1,8 @@
 "use client";
 
-import { useMemo, useState, useCallback, useEffect } from "react";
+import { useMemo, useState, useCallback, useEffect, useRef } from "react";
 import { getSafeUrl, isMobileDevice, getAllPlatformAvailability } from "./utils";
-import { fetchOGData, type OGData } from "./og-fetcher";
+import { fetchOGData, type OGData, type OGFetcher } from "./og-fetcher";
 import {
   shareToWhatsApp,
   shareToTelegram,
@@ -279,9 +279,10 @@ export function useShareSheet({
 
 /**
  * Hook to fetch OG (Open Graph) data from a URL.
- * Automatically fetches and caches OG metadata for link previews.
+ * Fetches with `fetcher`, the Microlink lookup (`fetchOGData`, cached) unless another is given:
+ * calling this hook is the opt-in, since the lookup sends `url` to a third party.
  */
-export function useOGData(url: string | undefined): {
+export function useOGData(url: string | undefined, fetcher: OGFetcher = fetchOGData): {
   ogData: OGData | null;
   loading: boolean;
   error: string | null;
@@ -289,6 +290,12 @@ export function useOGData(url: string | undefined): {
   const [ogData, setOgData] = useState<OGData | null>(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  // Read at fetch time, so an inline fetcher does not refetch on every render
+  // (this effect runs before the one below in the same commit)
+  const fetcherRef = useRef(fetcher);
+  useEffect(() => {
+    fetcherRef.current = fetcher;
+  });
 
   useEffect(() => {
     if (!url) {
@@ -302,7 +309,7 @@ export function useOGData(url: string | undefined): {
     setLoading(true);
     setError(null);
 
-    fetchOGData(url)
+    fetcherRef.current(url)
       .then((data) => {
         if (!cancelled) {
           setOgData(data);

package/src/index.ts

@@ -6,7 +6,7 @@ export { ShareSheetDrawer, ShareMenuDrawer } from "./ShareSheetDrawer";
 export { useShareSheet, useShareMenu, useOGData, type UseShareSheetOptions, type UseShareMenuOptions } from "./hooks";
 
 // OG Data fetcher
-export { fetchOGData, clearOGCache, type OGData } from "./og-fetcher";
+export { fetchOGData, clearOGCache, type OGData, type OGFetcher } from "./og-fetcher";
 
 // Types
 export type {

package/src/og-fetcher.ts

@@ -1,4 +1,6 @@
-// OG Data fetcher using Microlink API (free, no API key required)
+// OG data fetcher using the Microlink API (free, no API key required).
+// The sheet never calls it on its own: a caller opts in with `fetchPreview={fetchOGData}`,
+// because the lookup sends the shared link to a third party.
 
 export interface OGData {
   title?: string;
@@ -8,6 +10,9 @@ export interface OGData {
   siteName?: string;
 }
 
+/** Looks up a link's card. Resolves to null when there is none. */
+export type OGFetcher = (url: string) => Promise<OGData | null>;
+
 export interface OGFetchResult {
   data: OGData | null;
   loading: boolean;

package/src/types.ts

@@ -1,4 +1,5 @@
 import type { ReactNode } from "react";
+import type { OGFetcher } from "./og-fetcher";
 
 /** CSS variable names for UI elements (non-platform specific) */
 export const CSS_VARS_UI = {
@@ -100,7 +101,7 @@ export interface ShareSheetDrawerClassNames extends ShareSheetContentClassNames
 export interface ShareSheetContentProps {
   /** Title displayed at the top of the sheet */
   title?: string;
-  /** URL to share (OG preview will be fetched automatically) */
+  /** URL to share */
   shareUrl: string;
   /** Text to share alongside the URL */
   shareText: string;
@@ -110,6 +111,12 @@ export interface ShareSheetContentProps {
   downloadFilename?: string;
   /** Custom preview image URL (skips OG fetching if provided) */
   previewImage?: string | null;
+  /**
+   * Looks up the link's card when there is no `previewImage`. Unset (the default), no request
+   * leaves the page and the sheet shows a link placeholder. Pass `fetchOGData` for the Microlink
+   * lookup the sheet made by itself before 1.10.0: it sends `shareUrl` to api.microlink.io.
+   */
+  fetchPreview?: OGFetcher;
   /** File to share via native share (data URL or Blob) - takes priority over URL sharing */
   shareFile?: string | Blob | null;
   /** Filename for the shared file */