@flamingo-stack/openframe-frontend-core 0.0.287 → 0.0.288

package/dist/chunk-DVUFNTI2.cjs

@@ -0,0 +1,619 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
+
+
+
+var _chunkOXC72UIPcjs = require('./chunk-OXC72UIP.cjs');
+
+
+
+
+
+
+var _chunkD6RK5YXXcjs = require('./chunk-D6RK5YXX.cjs');
+
+
+var _chunkKBKZYJRIcjs = require('./chunk-KBKZYJRI.cjs');
+
+
+var _chunkXL4V2PYGcjs = require('./chunk-XL4V2PYG.cjs');
+
+
+var _chunkXXI7BNB6cjs = require('./chunk-XXI7BNB6.cjs');
+
+
+
+
+var _chunkZS2SBWBRcjs = require('./chunk-ZS2SBWBR.cjs');
+
+// src/components/embeds/embed-iframe.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+function EmbedLoadingSkeleton({ height }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "div",
+    {
+      className: "w-full rounded-lg border border-ods-border overflow-hidden bg-ods-skeleton animate-pulse",
+      style: { height: height || "calc(100vh - 250px)" },
+      children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center h-full gap-4", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-12 h-12 rounded-lg bg-ods-card" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-4 w-48 rounded bg-ods-card" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-3 w-32 rounded bg-ods-card" })
+      ] })
+    }
+  );
+}
+function EmbedIframe({
+  src,
+  title,
+  className,
+  height,
+  allow,
+  referrerPolicy,
+  loading,
+  allowFullScreen
+}) {
+  const [isLoaded, setIsLoaded] = _react.useState.call(void 0, false);
+  const iframeRef = _react.useRef.call(void 0, null);
+  const handleLoad = _react.useCallback.call(void 0, () => setIsLoaded(true), []);
+  _react.useEffect.call(void 0, () => {
+    setIsLoaded(false);
+  }, [src]);
+  _react.useEffect.call(void 0, () => {
+    const iframe = iframeRef.current;
+    return () => {
+      if (iframe) {
+        try {
+          iframe.src = "about:blank";
+        } catch (e2) {
+        }
+      }
+    };
+  }, [src]);
+  const resolvedHeight = height || "calc(100vh - 250px)";
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    !isLoaded && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EmbedLoadingSkeleton, { height: resolvedHeight }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      {
+        className: `w-full rounded-lg border border-ods-border overflow-hidden ${!isLoaded ? "h-0 overflow-hidden" : ""} ${className || ""}`,
+        style: isLoaded ? { height: resolvedHeight } : void 0,
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "iframe",
+          {
+            ref: iframeRef,
+            src,
+            className: "w-full h-full border-0",
+            title,
+            onLoad: handleLoad,
+            allow,
+            referrerPolicy,
+            loading,
+            allowFullScreen: _optionalChain([allow, 'optionalAccess', _ => _.includes, 'call', _2 => _2("fullscreen")]) ? void 0 : allowFullScreen
+          },
+          src
+        )
+      }
+    )
+  ] });
+}
+
+// src/components/embeds/pdf-viewer.tsx
+var _lucidereact = require('lucide-react');
+
+function PdfViewer({ src, fileName, onPreview, onDownload, height }) {
+  const displayName = fileName || "PDF Document";
+  if (!src) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.AdobePdfIcon, { className: "w-16 h-16 text-ods-text-secondary mb-4" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-secondary", children: "PDF file not available" })
+    ] });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2 min-w-0", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.AdobePdfIcon, { className: "w-5 h-5 shrink-0" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: "text-xl font-semibold text-ods-text-primary truncate", children: displayName })
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2 w-full sm:w-auto", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkXXI7BNB6cjs.Button,
+          {
+            variant: "outline",
+            size: "small-legacy",
+            href: onPreview ? void 0 : src,
+            openInNewTab: !onPreview,
+            onClick: onPreview,
+            leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Eye, { className: "w-4 h-4" }),
+            className: "flex-1 sm:flex-initial",
+            children: "Preview"
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkXXI7BNB6cjs.Button,
+          {
+            variant: "outline",
+            size: "small-legacy",
+            href: onDownload ? void 0 : src,
+            openInNewTab: !onDownload,
+            onClick: onDownload,
+            leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Download, { className: "w-4 h-4" }),
+            className: "flex-1 sm:flex-initial",
+            children: "Download"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EmbedIframe, { src, title: displayName, height })
+  ] });
+}
+
+// src/components/embeds/google-sheets-viewer.tsx
+
+
+function GoogleSheetsViewer({ externalUrl, fileName, height }) {
+  const displayName = fileName || "Google Sheet";
+  if (!externalUrl) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.GoogleSheetsIcon, { className: "w-16 h-16 text-ods-text-secondary mb-4" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-secondary", children: "Google Sheet URL not configured" })
+    ] });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2 min-w-0", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.GoogleSheetsIcon, { className: "w-5 h-5 shrink-0" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: "text-xl font-semibold text-ods-text-primary truncate", children: displayName })
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkXXI7BNB6cjs.Button,
+        {
+          variant: "outline",
+          size: "small-legacy",
+          href: _chunkD6RK5YXXcjs.toGoogleSheetsOriginalUrl.call(void 0, externalUrl),
+          openInNewTab: true,
+          leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.GoogleSheetsIcon, { className: "w-4 h-4" }),
+          rightIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ExternalLink, { className: "w-4 h-4" }),
+          className: "w-full sm:w-auto",
+          children: "Open in Google Sheets"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      EmbedIframe,
+      {
+        src: _chunkD6RK5YXXcjs.toGoogleSheetsEmbedUrl.call(void 0, externalUrl),
+        title: displayName,
+        height
+      }
+    )
+  ] });
+}
+
+// src/components/embeds/figma-embed.tsx
+
+
+
+function SlidesViewToggle({
+  view,
+  onChange
+}) {
+  const options = [
+    { key: "present", label: "Present", Icon: _lucidereact.Play },
+    { key: "browse", label: "Browse", Icon: _lucidereact.LayoutGrid }
+  ];
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkOXC72UIPcjs.ToggleGroup,
+    {
+      type: "single",
+      value: view,
+      onValueChange: (v) => {
+        if (v && v !== view) onChange(v);
+      },
+      "aria-label": "Figma slides view mode",
+      className: "flex shrink-0 items-center gap-0.5 rounded-lg border border-ods-border bg-ods-card p-0.5",
+      children: options.map(({ key, label, Icon }) => {
+        const active = view === key;
+        return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          _chunkOXC72UIPcjs.ToggleGroupItem,
+          {
+            value: key,
+            "aria-label": label,
+            className: `flex items-center gap-1.5 rounded-md px-2.5 py-1 text-sm font-medium transition-colors ${active ? "bg-ods-accent text-ods-text-on-accent" : "text-ods-text-secondary hover:text-ods-text-primary hover:bg-ods-bg-hover"}`,
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: "h-4 w-4 shrink-0" }),
+              label
+            ]
+          },
+          key
+        );
+      })
+    }
+  );
+}
+function FigmaEmbed({ url, title, height, loading = "lazy" }) {
+  const [view, setView] = _react.useState.call(void 0, "present");
+  const isSlides = url ? _chunkD6RK5YXXcjs.isFigmaSlidesUrl.call(void 0, url) : false;
+  const embedSrc = url ? _chunkD6RK5YXXcjs.toFigmaEmbedUrl.call(void 0, url, { slidesView: view }) : null;
+  const originalUrl = (() => {
+    if (!url) return null;
+    try {
+      const parsed = new URL(_chunkD6RK5YXXcjs.toFigmaOriginalUrl.call(void 0, url));
+      const host = parsed.hostname.toLowerCase();
+      const okHost = host === "figma.com" || host.endsWith(".figma.com");
+      const okProtocol = parsed.protocol === "https:" || parsed.protocol === "http:";
+      return okHost && okProtocol ? parsed.toString() : null;
+    } catch (e3) {
+      return null;
+    }
+  })();
+  const heading = title || "Figma Design";
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "my-6 space-y-3", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2 min-w-0", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.FigmaIcon, { className: "w-5 h-5 shrink-0" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-sans text-base font-semibold text-ods-text-primary truncate", children: heading })
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center", children: [
+        isSlides && embedSrc && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SlidesViewToggle, { view, onChange: setView }),
+        originalUrl && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkXXI7BNB6cjs.Button,
+          {
+            variant: "outline",
+            size: "small-legacy",
+            href: originalUrl,
+            openInNewTab: true,
+            leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.FigmaIcon, { className: "w-4 h-4" }),
+            rightIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ExternalLink, { className: "w-4 h-4" }),
+            className: "w-full sm:w-auto",
+            children: "Open in Figma"
+          }
+        )
+      ] })
+    ] }),
+    embedSrc ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      EmbedIframe,
+      {
+        src: embedSrc,
+        title: heading,
+        allow: "clipboard-write; clipboard-read; fullscreen",
+        loading,
+        height,
+        allowFullScreen: true
+      }
+    ) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZS2SBWBRcjs.FigmaIcon, { className: "w-16 h-16 text-ods-text-secondary mb-4" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-secondary", children: "Figma URL not configured" })
+    ] })
+  ] });
+}
+
+// src/components/embeds/og-link-preview.tsx
+
+
+var OGLinkErrorBoundary = class extends _react.Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+  static getDerivedStateFromError() {
+    return { hasError: true };
+  }
+  componentDidCatch(error, errorInfo) {
+    console.warn("Link preview error caught by boundary:", error, errorInfo);
+  }
+  render() {
+    if (this.state.hasError) return this.props.fallback;
+    return this.props.children;
+  }
+};
+function getDomain(urlStr) {
+  try {
+    return new URL(urlStr).hostname.replace("www.", "");
+  } catch (e4) {
+    return "External Link";
+  }
+}
+function domainToTitle(domain) {
+  return domain.split(".")[0].replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
+}
+var ExternalLinkIcon = ({ size = 16 }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { width: size, height: size, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", className: "text-ods-text-secondary group-hover:text-ods-accent transition-colors flex-shrink-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" }) });
+var Favicon = ({ src, size = "w-6 h-6" }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "img", { src, alt: "", className: size, onError: (e) => {
+  e.target.style.display = "none";
+} });
+var OGLinkPreview = ({
+  url,
+  apiBaseUrl,
+  ogEndpointPath = "/api/blog/og-scraper",
+  buildPlaceholderUrl,
+  fallbackTitle,
+  fallbackDescription,
+  fallbackImage,
+  publicationName,
+  publicationLogo,
+  variant = "default",
+  enablePlaceholder = true
+}) => {
+  const [ogData, setOgData] = _react.useState.call(void 0, null);
+  const [loading, setLoading] = _react.useState.call(void 0, true);
+  const [error, setError] = _react.useState.call(void 0, false);
+  const [imageError, setImageError] = _react.useState.call(void 0, false);
+  const [originalImageError, setOriginalImageError] = _react.useState.call(void 0, false);
+  const [fallbackImageError, setFallbackImageError] = _react.useState.call(void 0, false);
+  let isValidUrl = true;
+  let isLocalhost = false;
+  try {
+    if (url && typeof url === "string") {
+      const urlObj = new URL(url);
+      if (["localhost", "127.0.0.1", "0.0.0.0"].includes(urlObj.hostname) || urlObj.hostname.startsWith("192.168.") || urlObj.hostname.startsWith("10.") || urlObj.hostname.startsWith("172.")) {
+        isLocalhost = true;
+      }
+    } else {
+      isValidUrl = false;
+    }
+  } catch (e5) {
+    isValidUrl = false;
+  }
+  _react.useEffect.call(void 0, () => {
+    if (!isValidUrl || isLocalhost) return;
+    const fetchOGData = async () => {
+      try {
+        new URL(url);
+        setLoading(true);
+        const endpoint = `${_nullishCoalesce(apiBaseUrl, () => ( ""))}${ogEndpointPath}?url=${encodeURIComponent(url)}`;
+        const response = await fetch(endpoint);
+        if (response.ok) {
+          const data = await response.json();
+          if (_optionalChain([data, 'optionalAccess', _3 => _3.title]) && data.title !== "Link Preview Unavailable") {
+            setOgData(data);
+          } else {
+            setError(true);
+          }
+        } else {
+          setError(true);
+        }
+      } catch (e6) {
+        setError(true);
+      } finally {
+        setLoading(false);
+      }
+    };
+    fetchOGData();
+  }, [url, isValidUrl, isLocalhost, apiBaseUrl, ogEndpointPath]);
+  const isCompact = variant === "compact";
+  const domain = getDomain(url);
+  const effectiveData = _nullishCoalesce(ogData, () => ( (error ? {
+    title: fallbackTitle || domainToTitle(domain),
+    description: fallbackDescription || domain,
+    image: "",
+    url,
+    siteName: publicationName || domain,
+    type: "website",
+    favicon: `https://www.google.com/s2/favicons?domain=${domain}&sz=32`
+  } : null)));
+  const placeholderImageUrl = enablePlaceholder && buildPlaceholderUrl && _optionalChain([effectiveData, 'optionalAccess', _4 => _4.title]) ? buildPlaceholderUrl(effectiveData.title, effectiveData.siteName || domain) : null;
+  const resolvedImageUrl = _optionalChain([effectiveData, 'optionalAccess', _5 => _5.image]) && !imageError ? effectiveData.image : _optionalChain([effectiveData, 'optionalAccess', _6 => _6.originalImage]) && !originalImageError ? effectiveData.originalImage : fallbackImage && !fallbackImageError ? fallbackImage : placeholderImageUrl;
+  const hasImage = !!resolvedImageUrl;
+  const isFallbackImage = resolvedImageUrl === fallbackImage;
+  const isPlaceholder = resolvedImageUrl === placeholderImageUrl && !isFallbackImage;
+  const bgColor = _chunkKBKZYJRIcjs.useImageEdgeColor.call(void 0, _nullishCoalesce(resolvedImageUrl, () => ( null)), "var(--ods-bg-secondary)");
+  const renderSkeleton = () => isCompact ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-row border border-ods-border rounded-lg overflow-hidden bg-ods-card h-[120px]", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-[200px] h-full flex-shrink-0 bg-ods-skeleton animate-pulse" }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 p-3 flex flex-col justify-center", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse h-4 w-3/4 mb-2" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse h-3 w-full mb-1" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse h-3 w-2/3 mb-2" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse h-3 w-1/3" })
+    ] })
+  ] }) }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-6", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "block border border-ods-border rounded-lg overflow-hidden bg-ods-card", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-video w-full bg-ods-skeleton overflow-hidden relative animate-pulse" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "p-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-6 h-6 bg-ods-skeleton rounded flex-shrink-0 mt-0.5 animate-pulse" }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "h-[2.5rem] leading-[1.25rem] mb-2 overflow-hidden", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse", style: { height: "1.25rem", marginBottom: "0.25rem" } }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse w-3/4", style: { height: "1.25rem" } })
+        ] }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "h-[2.5rem] leading-[1.25rem] mb-2 overflow-hidden", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse", style: { height: "1.25rem", marginBottom: "0.25rem" } }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse w-5/6", style: { height: "1.25rem" } })
+        ] }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse", style: { height: "0.75rem", width: "6rem" } }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-skeleton rounded animate-pulse", style: { height: "0.75rem", width: "5rem" } })
+        ] })
+      ] })
+    ] }) })
+  ] }) });
+  if (!url || typeof url !== "string" || !isValidUrl) return renderSkeleton();
+  if (isLocalhost) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-6", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "a",
+      {
+        href: url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "inline-flex items-center gap-2 text-ods-accent hover:text-ods-accent-hover transition-colors",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "underline", children: url }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExternalLinkIcon, { size: 14 })
+        ]
+      }
+    ) });
+  }
+  if (loading) return renderSkeleton();
+  if (!effectiveData) return renderSkeleton();
+  const title = fallbackTitle || effectiveData.title;
+  const description = fallbackDescription || effectiveData.description || "";
+  const ogDomain = getDomain(effectiveData.url);
+  const faviconSrc = effectiveData.favicon || `https://www.google.com/s2/favicons?domain=${ogDomain}&sz=32`;
+  const logoSrc = publicationLogo || faviconSrc;
+  const handleImageError = () => {
+    if (effectiveData.image && !imageError) setImageError(true);
+    else if (effectiveData.originalImage && !originalImageError) setOriginalImageError(true);
+    else setFallbackImageError(true);
+  };
+  const renderImage = () => {
+    if (!resolvedImageUrl) return null;
+    if (isPlaceholder) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "img",
+        {
+          src: resolvedImageUrl,
+          alt: title,
+          className: "absolute inset-0 w-full h-full object-cover rounded-md"
+        }
+      );
+    }
+    if (isFallbackImage) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkXL4V2PYGcjs.next_image_default,
+        {
+          src: resolvedImageUrl,
+          alt: title,
+          fill: true,
+          className: "object-contain rounded-md group-hover:scale-105 transition-transform duration-300",
+          onError: handleImageError,
+          unoptimized: resolvedImageUrl.includes("/render/image/")
+        }
+      );
+    }
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "img",
+      {
+        src: resolvedImageUrl,
+        alt: title,
+        className: "absolute inset-0 w-full h-full object-contain rounded-md group-hover:scale-105 transition-transform duration-300",
+        onError: handleImageError
+      }
+    );
+  };
+  if (isCompact) {
+    if (!hasImage) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        "a",
+        {
+          href: effectiveData.url,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "flex flex-row items-center gap-3 border border-ods-border rounded-lg overflow-hidden bg-ods-card hover:border-ods-accent transition-all duration-200 group px-4 py-3",
+          children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 bg-ods-bg-secondary rounded-lg flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Favicon, { src: faviconSrc, size: "w-5 h-5" }) }),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "font-sans text-sm font-semibold text-ods-text-primary group-hover:text-ods-accent transition-colors truncate", children: title }),
+              description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "font-sans text-xs text-ods-text-secondary truncate", children: description })
+            ] }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExternalLinkIcon, { size: 14 })
+          ]
+        }
+      ) });
+    }
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "a",
+      {
+        href: effectiveData.url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "flex flex-row border border-ods-border rounded-lg overflow-hidden bg-ods-card hover:border-ods-accent transition-colors group h-[120px]",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-[200px] h-full flex-shrink-0 overflow-hidden relative flex items-center justify-center rounded-lg transition-colors duration-300", style: { backgroundColor: bgColor }, children: renderImage() }),
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 p-3 flex flex-col justify-center min-w-0", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "h3",
+              {
+                className: "font-sans text-sm font-semibold text-ods-text-primary overflow-hidden group-hover:text-ods-accent transition-colors",
+                style: { display: "-webkit-box", WebkitLineClamp: 1, WebkitBoxOrient: "vertical" },
+                children: title
+              }
+            ),
+            description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "p",
+              {
+                className: "font-sans text-xs text-ods-text-secondary overflow-hidden mt-1",
+                style: { display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical" },
+                children: description
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "text-xs text-ods-text-secondary mt-1 truncate", children: effectiveData.siteName || ogDomain })
+          ] })
+        ]
+      }
+    ) });
+  }
+  if (!hasImage) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-6", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "a",
+      {
+        href: effectiveData.url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "flex items-center gap-3 border border-ods-border rounded-lg overflow-hidden bg-ods-card hover:border-ods-accent transition-all duration-200 group px-4 py-3",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-10 h-10 bg-ods-bg-secondary rounded-lg flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Favicon, { src: faviconSrc }) }),
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "font-sans font-semibold text-ods-text-primary text-base group-hover:text-ods-accent transition-colors truncate", children: title }),
+            description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "font-sans text-sm text-ods-text-secondary truncate", children: description })
+          ] }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExternalLinkIcon, {})
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "my-6", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "a",
+    {
+      href: effectiveData.url,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "block border border-ods-border rounded-lg overflow-hidden bg-ods-card hover:border-ods-accent transition-colors group",
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-video w-full overflow-hidden relative flex items-center justify-center rounded-lg transition-colors duration-300", style: { backgroundColor: bgColor }, children: renderImage() }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "p-4", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "img",
+            {
+              src: logoSrc,
+              alt: publicationName || "",
+              className: "w-6 h-6 rounded object-contain flex-shrink-0 mt-0.5",
+              onError: (e) => {
+                e.target.style.display = "none";
+              }
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "h3",
+              {
+                className: "font-sans font-semibold text-ods-text-primary text-base overflow-hidden group-hover:text-ods-accent transition-colors h-[2.5rem] leading-[1.25rem] mb-2",
+                style: { display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical" },
+                children: title
+              }
+            ),
+            description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "p",
+              {
+                className: "font-sans text-sm text-ods-text-secondary overflow-hidden h-[2.5rem] leading-[1.25rem] mb-2",
+                style: { display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical" },
+                children: description
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2 text-xs text-ods-text-secondary", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium", children: effectiveData.siteName }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: "\u2022" }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate", children: ogDomain })
+            ] })
+          ] })
+        ] }) })
+      ]
+    }
+  ) });
+};
+
+
+
+
+
+
+
+
+exports.EmbedIframe = EmbedIframe; exports.PdfViewer = PdfViewer; exports.GoogleSheetsViewer = GoogleSheetsViewer; exports.FigmaEmbed = FigmaEmbed; exports.OGLinkErrorBoundary = OGLinkErrorBoundary; exports.OGLinkPreview = OGLinkPreview;
+//# sourceMappingURL=chunk-DVUFNTI2.cjs.map