@flamingo-stack/openframe-frontend-core 0.0.296 → 0.0.297

package/dist/chunk-66AANIOC.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-66AANIOC.cjs","../src/components/embeds/embed-iframe.tsx","../src/components/embeds/pdf-viewer.tsx","../src/components/embeds/google-sheets-viewer.tsx","../src/components/embeds/figma-embed.tsx","../src/components/embeds/og-link-preview.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-66AANIOC.cjs","sourcesContent":[null,"\"use client\"\n\nimport React, { useState, useCallback, useRef, useEffect } from 'react'\n\n/** Loading skeleton for iframe embeds — matches project skeleton pattern */\nfunction EmbedLoadingSkeleton({ height }: { height?: string }) {\n  return (\n    <div\n      className=\"w-full rounded-lg border border-ods-border overflow-hidden bg-ods-skeleton animate-pulse\"\n      style={{ height: height || 'calc(100vh - 250px)' }}\n    >\n      <div className=\"flex flex-col items-center justify-center h-full gap-4\">\n        <div className=\"w-12 h-12 rounded-lg bg-ods-card\" />\n        <div className=\"h-4 w-48 rounded bg-ods-card\" />\n        <div className=\"h-3 w-32 rounded bg-ods-card\" />\n      </div>\n    </div>\n  )\n}\n\nexport interface EmbedIframeProps {\n  /** The URL to embed */\n  src: string\n  /** Accessible title for the iframe */\n  title: string\n  /** Additional class names for the outer container */\n  className?: string\n  /** Container height (CSS value). Defaults to `calc(100vh - 250px)` */\n  height?: string\n  /** iframe `allow` attribute */\n  allow?: string\n  /** iframe `referrerPolicy` attribute */\n  referrerPolicy?: React.IframeHTMLAttributes<HTMLIFrameElement>['referrerPolicy']\n  /** iframe `loading` attribute */\n  loading?: 'eager' | 'lazy'\n  /** iframe `allowFullScreen` attribute */\n  allowFullScreen?: boolean\n}\n\n/**\n * Base iframe wrapper with loading skeleton and proper memory cleanup.\n *\n * Prevents memory leaks by:\n * - Using `key={src}` to force full unmount/remount when src changes\n * - Setting iframe src to about:blank on unmount to release the embedded document\n * - Resetting loaded state when src changes\n */\nexport function EmbedIframe({\n  src,\n  title,\n  className,\n  height,\n  allow,\n  referrerPolicy,\n  loading,\n  allowFullScreen,\n}: EmbedIframeProps) {\n  const [isLoaded, setIsLoaded] = useState(false)\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n  const handleLoad = useCallback(() => setIsLoaded(true), [])\n\n  useEffect(() => {\n    setIsLoaded(false)\n  }, [src])\n\n  useEffect(() => {\n    const iframe = iframeRef.current\n    return () => {\n      if (iframe) {\n        try {\n          iframe.src = 'about:blank'\n        } catch {\n          // Cross-origin iframes may throw — safe to ignore\n        }\n      }\n    }\n  }, [src])\n\n  const resolvedHeight = height || 'calc(100vh - 250px)'\n\n  return (\n    <>\n      {!isLoaded && <EmbedLoadingSkeleton height={resolvedHeight} />}\n      <div\n        className={`w-full rounded-lg border border-ods-border overflow-hidden ${!isLoaded ? 'h-0 overflow-hidden' : ''} ${className || ''}`}\n        style={isLoaded ? { height: resolvedHeight } : undefined}\n      >\n        <iframe\n          key={src}\n          ref={iframeRef}\n          src={src}\n          className=\"w-full h-full border-0\"\n          title={title}\n          onLoad={handleLoad}\n          allow={allow}\n          referrerPolicy={referrerPolicy}\n          loading={loading}\n          allowFullScreen={allow?.includes('fullscreen') ? undefined : allowFullScreen}\n        />\n      </div>\n    </>\n  )\n}\n","\"use client\"\n\nimport React from 'react'\nimport { Button } from '../ui'\nimport { Download, Eye } from 'lucide-react'\nimport { AdobePdfIcon } from '../icons-v2-generated'\nimport { EmbedIframe } from './embed-iframe'\n\nexport interface PdfViewerProps {\n  src: string\n  fileName?: string\n  onPreview?: () => void\n  onDownload?: () => void\n  height?: string\n}\n\nexport function PdfViewer({ src, fileName, onPreview, onDownload, height }: PdfViewerProps) {\n  const displayName = fileName || 'PDF Document'\n\n  if (!src) {\n    return (\n      <div className=\"flex flex-col items-center justify-center py-16 text-center\">\n        <AdobePdfIcon className=\"w-16 h-16 text-ods-text-secondary mb-4\" />\n        <p className=\"text-ods-text-secondary\">PDF file not available</p>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n        <div className=\"flex items-center gap-2 min-w-0\">\n          <AdobePdfIcon className=\"w-5 h-5 shrink-0\" />\n          <h2 className=\"text-xl font-semibold text-ods-text-primary truncate\">{displayName}</h2>\n        </div>\n        <div className=\"flex items-center gap-2 w-full sm:w-auto\">\n          <Button\n            variant=\"outline\"\n            size=\"small-legacy\"\n            href={onPreview ? undefined : src}\n            openInNewTab={!onPreview}\n            onClick={onPreview}\n            leftIcon={<Eye className=\"w-4 h-4\" />}\n            className=\"flex-1 sm:flex-initial\"\n          >\n            Preview\n          </Button>\n          <Button\n            variant=\"outline\"\n            size=\"small-legacy\"\n            href={onDownload ? undefined : src}\n            openInNewTab={!onDownload}\n            onClick={onDownload}\n            leftIcon={<Download className=\"w-4 h-4\" />}\n            className=\"flex-1 sm:flex-initial\"\n          >\n            Download\n          </Button>\n        </div>\n      </div>\n      <EmbedIframe src={src} title={displayName} height={height} />\n    </div>\n  )\n}\n","\"use client\"\n\nimport React from 'react'\nimport { Button } from '../ui'\nimport { ExternalLink } from 'lucide-react'\nimport { GoogleSheetsIcon } from '../icons-v2-generated'\nimport { EmbedIframe } from './embed-iframe'\nimport { toGoogleSheetsEmbedUrl, toGoogleSheetsOriginalUrl } from '../../utils/embed-url-converters'\n\nexport interface GoogleSheetsViewerProps {\n  externalUrl: string\n  fileName?: string\n  height?: string\n}\n\nexport function GoogleSheetsViewer({ externalUrl, fileName, height }: GoogleSheetsViewerProps) {\n  const displayName = fileName || 'Google Sheet'\n\n  if (!externalUrl) {\n    return (\n      <div className=\"flex flex-col items-center justify-center py-16 text-center\">\n        <GoogleSheetsIcon className=\"w-16 h-16 text-ods-text-secondary mb-4\" />\n        <p className=\"text-ods-text-secondary\">Google Sheet URL not configured</p>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n        <div className=\"flex items-center gap-2 min-w-0\">\n          <GoogleSheetsIcon className=\"w-5 h-5 shrink-0\" />\n          <h2 className=\"text-xl font-semibold text-ods-text-primary truncate\">{displayName}</h2>\n        </div>\n        <Button\n          variant=\"outline\"\n          size=\"small-legacy\"\n          href={toGoogleSheetsOriginalUrl(externalUrl)}\n          openInNewTab\n          leftIcon={<GoogleSheetsIcon className=\"w-4 h-4\" />}\n          rightIcon={<ExternalLink className=\"w-4 h-4\" />}\n          className=\"w-full sm:w-auto\"\n        >\n          Open in Google Sheets\n        </Button>\n      </div>\n      <EmbedIframe\n        src={toGoogleSheetsEmbedUrl(externalUrl)}\n        title={displayName}\n        height={height}\n      />\n    </div>\n  )\n}\n","'use client'\n\nimport { useState } from 'react'\nimport { Button, ToggleGroup, ToggleGroupItem } from '../ui'\nimport { FigmaIcon } from '../icons-v2-generated'\nimport { ExternalLink, Play, LayoutGrid } from 'lucide-react'\nimport { toFigmaEmbedUrl, toFigmaOriginalUrl, isFigmaSlidesUrl } from '../../utils/embed-url-converters'\nimport { EmbedIframe } from './embed-iframe'\n\nexport interface FigmaEmbedProps {\n  /** Any Figma URL (design/file/proto/board/slides/deck) or an already-resolved embed URL. */\n  url: string\n  /** Heading shown above the embed. Defaults to \"Figma Design\". */\n  title?: string\n  /**\n   * iframe height (CSS value). The data-room document viewer omits it (full\n   * height, `calc(100vh - 250px)`); inline markdown passes e.g. `\"70vh\"` so the\n   * embed sits naturally inside article content.\n   */\n  height?: string\n  /** iframe loading strategy. Defaults to `\"lazy\"`; the data-room viewer passes `\"eager\"`. */\n  loading?: 'eager' | 'lazy'\n}\n\ntype SlidesView = 'present' | 'browse'\n\n/**\n * Two-state present/browse toggle for Figma Slides. `present` (default) uses\n * Figma's deck viewer (full-bleed slide + `‹ n/N ›` nav bar + keyboard nav);\n * `browse` uses the thumbnail-rail + zoom viewer.\n */\nfunction SlidesViewToggle({\n  view,\n  onChange,\n}: {\n  view: SlidesView\n  onChange: (v: SlidesView) => void\n}) {\n  const options: { key: SlidesView; label: string; Icon: typeof Play }[] = [\n    { key: 'present', label: 'Present', Icon: Play },\n    { key: 'browse', label: 'Browse', Icon: LayoutGrid },\n  ]\n  return (\n    <ToggleGroup\n      type=\"single\"\n      value={view}\n      onValueChange={(v: string) => {\n        if (v && v !== view) onChange(v as SlidesView)\n      }}\n      aria-label=\"Figma slides view mode\"\n      className=\"flex shrink-0 items-center gap-0.5 rounded-lg border border-ods-border bg-ods-card p-0.5\"\n    >\n      {options.map(({ key, label, Icon }) => {\n        const active = view === key\n        return (\n          <ToggleGroupItem\n            key={key}\n            value={key}\n            aria-label={label}\n            className={`flex items-center gap-1.5 rounded-md px-2.5 py-1 text-sm font-medium transition-colors ${\n              active\n                ? 'bg-ods-accent text-ods-text-on-accent'\n                : 'text-ods-text-secondary hover:text-ods-text-primary hover:bg-ods-bg-hover'\n            }`}\n          >\n            <Icon className=\"h-4 w-4 shrink-0\" />\n            {label}\n          </ToggleGroupItem>\n        )\n      })}\n    </ToggleGroup>\n  )\n}\n\n/**\n * Single source of truth for every Figma surface — the data-room document viewer\n * and in-article markdown both render this. A header (icon + title + \"Open in\n * Figma\") over an interactive Figma iframe, built from the canonical\n * `toFigmaEmbedUrl` / `toFigmaOriginalUrl` converters + the shared `<EmbedIframe>`.\n * Only height/loading differ per surface.\n *\n * For Slides decks, a present/browse toggle (default = present) lets viewers flip\n * slides with Figma's native nav bar + keyboard, or switch to the thumbnail-rail\n * browse view.\n */\nexport function FigmaEmbed({ url, title, height, loading = 'lazy' }: FigmaEmbedProps) {\n  const [view, setView] = useState<SlidesView>('present')\n  const isSlides = url ? isFigmaSlidesUrl(url) : false\n  const embedSrc = url ? toFigmaEmbedUrl(url, { slidesView: view }) : null\n  const originalUrl = (() => {\n    if (!url) return null\n    try {\n      const parsed = new URL(toFigmaOriginalUrl(url))\n      const host = parsed.hostname.toLowerCase()\n      const okHost = host === 'figma.com' || host.endsWith('.figma.com')\n      const okProtocol = parsed.protocol === 'https:' || parsed.protocol === 'http:'\n      return okHost && okProtocol ? parsed.toString() : null\n    } catch {\n      return null\n    }\n  })()\n  const heading = title || 'Figma Design'\n\n  return (\n    <div className=\"my-6 space-y-3\">\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n        <div className=\"flex items-center gap-2 min-w-0\">\n          <FigmaIcon className=\"w-5 h-5 shrink-0\" />\n          <span className=\"font-sans text-base font-semibold text-ods-text-primary truncate\">\n            {heading}\n          </span>\n        </div>\n        <div className=\"flex flex-col gap-2 sm:flex-row sm:items-center\">\n          {isSlides && embedSrc && <SlidesViewToggle view={view} onChange={setView} />}\n          {originalUrl && (\n            <Button\n              variant=\"outline\"\n              size=\"small-legacy\"\n              href={originalUrl}\n              openInNewTab\n              leftIcon={<FigmaIcon className=\"w-4 h-4\" />}\n              rightIcon={<ExternalLink className=\"w-4 h-4\" />}\n              className=\"w-full sm:w-auto\"\n            >\n              Open in Figma\n            </Button>\n          )}\n        </div>\n      </div>\n      {embedSrc ? (\n        <EmbedIframe\n          src={embedSrc}\n          title={heading}\n          allow=\"clipboard-write; clipboard-read; fullscreen\"\n          loading={loading}\n          height={height}\n          allowFullScreen\n        />\n      ) : (\n        <div className=\"flex flex-col items-center justify-center py-16 text-center\">\n          <FigmaIcon className=\"w-16 h-16 text-ods-text-secondary mb-4\" />\n          <p className=\"text-ods-text-secondary\">Figma URL not configured</p>\n        </div>\n      )}\n    </div>\n  )\n}\n","\"use client\"\n\nimport React, { useState, useEffect, Component, ReactNode } from 'react'\nimport Image from '../../embed-shims/next-image'\nimport { useImageEdgeColor } from '../../hooks'\n\n/**\n * Open-Graph metadata returned by the consumer's scrape endpoint.\n *\n * The shape MUST match the JSON the OG endpoint serves at `ogEndpointPath`.\n * The hub's `/api/blog/og-scraper` returns exactly these fields — embedders\n * with a different endpoint must return the same shape (or adapt at the\n * route boundary). Keeps the consumer surface trivial: one URL → one card.\n */\nexport interface OGData {\n  title: string\n  description: string\n  image: string\n  originalImage?: string\n  url: string\n  siteName: string\n  type: string\n  favicon: string\n}\n\ninterface ErrorBoundaryProps {\n  children: ReactNode\n  fallback: ReactNode\n}\n\ninterface ErrorBoundaryState {\n  hasError: boolean\n}\n\n/**\n * Tiny error boundary tailored for OG link previews — caught errors quietly\n * fall back to the `fallback` prop (typically a plain hyperlink) so a single\n * broken third-party preview can't crash a whole article view.\n *\n * Named `OGLinkErrorBoundary` (not the generic `ErrorBoundary`) because the\n * lib already exports a separate `ErrorBoundary` from\n * `components/features/error-boundary.tsx`. The top-level `components/index.ts`\n * barrel re-exports both `./embeds` and `./features` via `export *`, so a\n * second `ErrorBoundary` here collides as TS2308.\n */\nexport class OGLinkErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  constructor(props: ErrorBoundaryProps) {\n    super(props)\n    this.state = { hasError: false }\n  }\n\n  static getDerivedStateFromError(): ErrorBoundaryState {\n    return { hasError: true }\n  }\n\n  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {\n    console.warn('Link preview error caught by boundary:', error, errorInfo)\n  }\n\n  render() {\n    if (this.state.hasError) return this.props.fallback\n    return this.props.children\n  }\n}\n\n/**\n * Builds a placeholder image URL when the scrape returns no image. Hub passes\n * its own `buildOgPlaceholderUrl` (which resolves CSS-var ODS colors against\n * the platform's brand palette + hits `/api/og-placeholder`); other embedders\n * can omit the prop to disable the placeholder entirely.\n *\n * Receives the post-scrape `title` and `siteName` so the placeholder can echo\n * the actual card content, not a generic graphic.\n */\nexport type BuildPlaceholderUrl = (\n  title: string,\n  siteName: string,\n) => string | null\n\nexport interface OGLinkPreviewProps {\n  /** The external URL to preview. */\n  url: string\n  /** Origin / base URL the OG endpoint is served from. Empty / undefined\n   *  means same-origin (hub-direct use). Embed contexts pass the hub's\n   *  origin here (e.g. `'https://hub.example.com'`) so the fetch hits\n   *  the hub instead of the embedder origin.\n   *\n   *  Pattern matches lib's `useNatsDialogSubscription({apiBaseUrl})` +\n   *  `buildSuggestionUrl({apiBaseUrl})` so all embed-ready surfaces share\n   *  one configuration knob. */\n  apiBaseUrl?: string\n  /** Path of the OG endpoint on the configured base. Default\n   *  `'/api/blog/og-scraper'` matches the hub's route. Override if the\n   *  embedder serves the same `OGData` shape from a different path. */\n  ogEndpointPath?: string\n  /** Optional placeholder-builder. Omit to disable the placeholder image\n   *  (the card then degrades to a favicon+title chip when no scraped image\n   *  is available). The hub injects its `buildOgPlaceholderUrl` here. */\n  buildPlaceholderUrl?: BuildPlaceholderUrl\n  /** Override the scraped title (used by publication cards that already know\n   *  the title locally — e.g. a CMS-managed press link). */\n  fallbackTitle?: string\n  /** Override the scraped description. */\n  fallbackDescription?: string\n  /** Override the scraped image — useful when the scrape returns no image but\n   *  the embedder has a CMS-stored hero image to fall back to. */\n  fallbackImage?: string\n  /** Publication / source name shown alongside the favicon (e.g. \"TechCrunch\"). */\n  publicationName?: string\n  /** Publication logo URL shown alongside the title (defaults to favicon). */\n  publicationLogo?: string\n  /** Card variant. `compact` = horizontal layout (~120px tall) suited for\n   *  in-doc placements; `default` = larger vertical layout for press / hero\n   *  positions. */\n  variant?: 'default' | 'compact'\n  /** Disable the synthesized placeholder image even when `buildPlaceholderUrl`\n   *  is provided — used by the markdown renderer to keep doc cards lighter. */\n  enablePlaceholder?: boolean\n}\n\nfunction getDomain(urlStr: string): string {\n  try { return new URL(urlStr).hostname.replace('www.', '') }\n  catch { return 'External Link' }\n}\n\nfunction domainToTitle(domain: string): string {\n  return domain.split('.')[0].replace(/-/g, ' ').replace(/\\b\\w/g, c => c.toUpperCase())\n}\n\nconst ExternalLinkIcon = ({ size = 16 }: { size?: number }) => (\n  <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\">\n    <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\" />\n  </svg>\n)\n\nconst Favicon = ({ src, size = 'w-6 h-6' }: { src: string; size?: string }) => (\n  <img src={src} alt=\"\" className={size} onError={(e) => { (e.target as HTMLImageElement).style.display = 'none' }} />\n)\n\n/**\n * Rich Open-Graph link preview card with skeleton, fallback, and image-edge\n * background detection.\n *\n * Flow:\n *  1. Validate URL early (no network for malformed input, localhost, or\n *     RFC1918 ranges — those render as plain `<a>` tags).\n *  2. `GET ogEndpointPath?url=<encoded>` — embedder serves the shape declared\n *     in `OGData`.\n *  3. Resolve image: scraped og:image → `originalImage` fallback → `fallbackImage`\n *     prop → `buildPlaceholderUrl(title, siteName)`. Each step has its own\n *     error toggle so a 404 / CORS-tainted image gracefully degrades.\n *  4. Extract a letterbox background color from the resolved image via\n *     `useImageEdgeColor`. Same-origin proxy is REQUIRED for cross-origin\n *     images so the `<canvas>` extraction doesn't taint.\n *  5. Render compact (h-[120px] horizontal) or default (vertical w/ aspect-video\n *     hero) variant, with image-less degraded variants for each.\n */\nexport const OGLinkPreview: React.FC<OGLinkPreviewProps> = ({\n  url,\n  apiBaseUrl,\n  ogEndpointPath = '/api/blog/og-scraper',\n  buildPlaceholderUrl,\n  fallbackTitle,\n  fallbackDescription,\n  fallbackImage,\n  publicationName,\n  publicationLogo,\n  variant = 'default',\n  enablePlaceholder = true,\n}) => {\n  const [ogData, setOgData] = useState<OGData | null>(null)\n  const [loading, setLoading] = useState(true)\n  const [error, setError] = useState(false)\n  const [imageError, setImageError] = useState(false)\n  const [originalImageError, setOriginalImageError] = useState(false)\n  const [fallbackImageError, setFallbackImageError] = useState(false)\n\n  let isValidUrl = true\n  let isLocalhost = false\n  try {\n    if (url && typeof url === 'string') {\n      const urlObj = new URL(url)\n      if (['localhost', '127.0.0.1', '0.0.0.0'].includes(urlObj.hostname) ||\n          urlObj.hostname.startsWith('192.168.') || urlObj.hostname.startsWith('10.') || urlObj.hostname.startsWith('172.')) {\n        isLocalhost = true\n      }\n    } else {\n      isValidUrl = false\n    }\n  } catch {\n    isValidUrl = false\n  }\n\n  useEffect(() => {\n    if (!isValidUrl || isLocalhost) return\n\n    const fetchOGData = async () => {\n      try {\n        new URL(url)\n        setLoading(true)\n        // Compose `${base}${path}?url=…`. Empty base → relative path\n        // (same-origin); absolute base → cross-origin embed against the hub.\n        // Plain string concat is safer than `new URL(path, base)` because\n        // the latter resolves `path` against the BASE's pathname when\n        // `path` is relative, producing surprising URLs when the embedder\n        // serves the lib from a subpath.\n        const endpoint = `${apiBaseUrl ?? ''}${ogEndpointPath}?url=${encodeURIComponent(url)}`\n        const response = await fetch(endpoint)\n        if (response.ok) {\n          const data = await response.json()\n          if (data?.title && data.title !== 'Link Preview Unavailable') {\n            setOgData(data)\n          } else {\n            setError(true)\n          }\n        } else {\n          setError(true)\n        }\n      } catch {\n        setError(true)\n      } finally {\n        setLoading(false)\n      }\n    }\n\n    fetchOGData()\n  }, [url, isValidUrl, isLocalhost, apiBaseUrl, ogEndpointPath])\n\n  const isCompact = variant === 'compact'\n  const domain = getDomain(url)\n\n  const effectiveData: OGData | null = ogData ?? (error ? {\n    title: fallbackTitle || domainToTitle(domain),\n    description: fallbackDescription || domain,\n    image: '',\n    url,\n    siteName: publicationName || domain,\n    type: 'website',\n    favicon: `https://www.google.com/s2/favicons?domain=${domain}&sz=32`,\n  } : null)\n\n  // Hub-injected placeholder builder — fires only when the post-scrape image\n  // chain is empty AND `enablePlaceholder` is true. `null` when unprovided.\n  const placeholderImageUrl =\n    enablePlaceholder && buildPlaceholderUrl && effectiveData?.title\n      ? buildPlaceholderUrl(effectiveData.title, effectiveData.siteName || domain)\n      : null\n\n  const resolvedImageUrl = (effectiveData?.image && !imageError)\n    ? effectiveData.image\n    : (effectiveData?.originalImage && !originalImageError)\n      ? effectiveData.originalImage\n      : (fallbackImage && !fallbackImageError)\n        ? fallbackImage\n        : placeholderImageUrl\n\n  const hasImage = !!resolvedImageUrl\n  const isFallbackImage = resolvedImageUrl === fallbackImage\n  const isPlaceholder = resolvedImageUrl === placeholderImageUrl && !isFallbackImage\n  const bgColor = useImageEdgeColor(resolvedImageUrl ?? null, 'var(--ods-bg-secondary)')\n\n  const renderSkeleton = () => isCompact ? (\n    <div className=\"my-4\">\n      <div className=\"flex flex-row border border-ods-border rounded-lg overflow-hidden bg-ods-card h-[120px]\">\n        <div className=\"w-[200px] h-full flex-shrink-0 bg-ods-skeleton animate-pulse\" />\n        <div className=\"flex-1 p-3 flex flex-col justify-center\">\n          <div className=\"bg-ods-skeleton rounded animate-pulse h-4 w-3/4 mb-2\" />\n          <div className=\"bg-ods-skeleton rounded animate-pulse h-3 w-full mb-1\" />\n          <div className=\"bg-ods-skeleton rounded animate-pulse h-3 w-2/3 mb-2\" />\n          <div className=\"bg-ods-skeleton rounded animate-pulse h-3 w-1/3\" />\n        </div>\n      </div>\n    </div>\n  ) : (\n    <div className=\"my-6\">\n      <div className=\"block border border-ods-border rounded-lg overflow-hidden bg-ods-card\">\n        <div className=\"aspect-video w-full bg-ods-skeleton overflow-hidden relative animate-pulse\" />\n        <div className=\"p-4\">\n          <div className=\"flex items-start gap-3\">\n            <div className=\"w-6 h-6 bg-ods-skeleton rounded flex-shrink-0 mt-0.5 animate-pulse\" />\n            <div className=\"flex-1 min-w-0\">\n              <div className=\"h-[2.5rem] leading-[1.25rem] mb-2 overflow-hidden\">\n                <div className=\"bg-ods-skeleton rounded animate-pulse\" style={{ height: '1.25rem', marginBottom: '0.25rem' }} />\n                <div className=\"bg-ods-skeleton rounded animate-pulse w-3/4\" style={{ height: '1.25rem' }} />\n              </div>\n              <div className=\"h-[2.5rem] leading-[1.25rem] mb-2 overflow-hidden\">\n                <div className=\"bg-ods-skeleton rounded animate-pulse\" style={{ height: '1.25rem', marginBottom: '0.25rem' }} />\n                <div className=\"bg-ods-skeleton rounded animate-pulse w-5/6\" style={{ height: '1.25rem' }} />\n              </div>\n              <div className=\"flex items-center gap-2\">\n                <div className=\"bg-ods-skeleton rounded animate-pulse\" style={{ height: '0.75rem', width: '6rem' }} />\n                <div className=\"bg-ods-skeleton rounded animate-pulse\" style={{ height: '0.75rem', width: '5rem' }} />\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n\n  if (!url || typeof url !== 'string' || !isValidUrl) return renderSkeleton()\n\n  if (isLocalhost) {\n    return (\n      <div className=\"my-6\">\n        <a href={url} target=\"_blank\" rel=\"noopener noreferrer\"\n          className=\"inline-flex items-center gap-2 text-ods-accent hover:text-ods-accent-hover transition-colors\">\n          <span className=\"underline\">{url}</span>\n          <ExternalLinkIcon size={14} />\n        </a>\n      </div>\n    )\n  }\n\n  if (loading) return renderSkeleton()\n  if (!effectiveData) return renderSkeleton()\n\n  const title = fallbackTitle || effectiveData.title\n  // Empty string when the scrape returned nothing — descriptions render\n  // conditionally below. Avoids the legacy `'No description available'` filler\n  // that signaled \"broken card\" to users.\n  const description = fallbackDescription || effectiveData.description || ''\n  const ogDomain = getDomain(effectiveData.url)\n  const faviconSrc = effectiveData.favicon || `https://www.google.com/s2/favicons?domain=${ogDomain}&sz=32`\n  const logoSrc = publicationLogo || faviconSrc\n\n  const handleImageError = () => {\n    if (effectiveData.image && !imageError) setImageError(true)\n    else if (effectiveData.originalImage && !originalImageError) setOriginalImageError(true)\n    else setFallbackImageError(true)\n  }\n\n  const renderImage = () => {\n    if (!resolvedImageUrl) return null\n    if (isPlaceholder) {\n      return (\n        <img src={resolvedImageUrl} alt={title}\n          className=\"absolute inset-0 w-full h-full object-cover rounded-md\" />\n      )\n    }\n    if (isFallbackImage) {\n      return (\n        <Image src={resolvedImageUrl} alt={title} fill\n          className=\"object-contain rounded-md group-hover:scale-105 transition-transform duration-300\"\n          onError={handleImageError}\n          unoptimized={resolvedImageUrl.includes('/render/image/')} />\n      )\n    }\n    return (\n      <img src={resolvedImageUrl} alt={title}\n        className=\"absolute inset-0 w-full h-full object-contain rounded-md group-hover:scale-105 transition-transform duration-300\"\n        onError={handleImageError} />\n    )\n  }\n\n  if (isCompact) {\n    if (!hasImage) {\n      return (\n        <div className=\"my-4\">\n          <a href={effectiveData.url} target=\"_blank\" rel=\"noopener noreferrer\"\n            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\">\n            <div className=\"w-8 h-8 bg-ods-bg-secondary rounded-lg flex items-center justify-center flex-shrink-0\">\n              <Favicon src={faviconSrc} size=\"w-5 h-5\" />\n            </div>\n            <div className=\"flex-1 min-w-0\">\n              <h3 className=\"font-sans text-sm font-semibold text-ods-text-primary group-hover:text-ods-accent transition-colors truncate\">{title}</h3>\n              {description && (\n                <p className=\"font-sans text-xs text-ods-text-secondary truncate\">{description}</p>\n              )}\n            </div>\n            <ExternalLinkIcon size={14} />\n          </a>\n        </div>\n      )\n    }\n    return (\n      <div className=\"my-4\">\n        <a href={effectiveData.url} target=\"_blank\" rel=\"noopener noreferrer\"\n          className=\"flex flex-row border border-ods-border rounded-lg overflow-hidden bg-ods-card hover:border-ods-accent transition-colors group h-[120px]\">\n          <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 }}>\n            {renderImage()}\n          </div>\n          <div className=\"flex-1 p-3 flex flex-col justify-center min-w-0\">\n            <h3 className=\"font-sans text-sm font-semibold text-ods-text-primary overflow-hidden group-hover:text-ods-accent transition-colors\"\n              style={{ display: '-webkit-box', WebkitLineClamp: 1, WebkitBoxOrient: 'vertical' }}>{title}</h3>\n            {description && (\n              <p className=\"font-sans text-xs text-ods-text-secondary overflow-hidden mt-1\"\n                style={{ display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical' }}>{description}</p>\n            )}\n            <div className=\"text-xs text-ods-text-secondary mt-1 truncate\">{effectiveData.siteName || ogDomain}</div>\n          </div>\n        </a>\n      </div>\n    )\n  }\n\n  if (!hasImage) {\n    return (\n      <div className=\"my-6\">\n        <a href={effectiveData.url} target=\"_blank\" rel=\"noopener noreferrer\"\n          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\">\n          <div className=\"w-10 h-10 bg-ods-bg-secondary rounded-lg flex items-center justify-center flex-shrink-0\">\n            <Favicon src={faviconSrc} />\n          </div>\n          <div className=\"flex-1 min-w-0\">\n            <h3 className=\"font-sans font-semibold text-ods-text-primary text-base group-hover:text-ods-accent transition-colors truncate\">{title}</h3>\n            {description && (\n              <p className=\"font-sans text-sm text-ods-text-secondary truncate\">{description}</p>\n            )}\n          </div>\n          <ExternalLinkIcon />\n        </a>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"my-6\">\n      <a href={effectiveData.url} target=\"_blank\" rel=\"noopener noreferrer\"\n        className=\"block border border-ods-border rounded-lg overflow-hidden bg-ods-card hover:border-ods-accent transition-colors group\">\n        <div className=\"aspect-video w-full overflow-hidden relative flex items-center justify-center rounded-lg transition-colors duration-300\" style={{ backgroundColor: bgColor }}>\n          {renderImage()}\n        </div>\n        <div className=\"p-4\">\n          <div className=\"flex items-start gap-3\">\n            <img src={logoSrc} alt={publicationName || ''} className=\"w-6 h-6 rounded object-contain flex-shrink-0 mt-0.5\"\n              onError={(e) => { (e.target as HTMLImageElement).style.display = 'none' }} />\n            <div className=\"flex-1 min-w-0\">\n              <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\"\n                style={{ display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical' }}>{title}</h3>\n              {description && (\n                <p className=\"font-sans text-sm text-ods-text-secondary overflow-hidden h-[2.5rem] leading-[1.25rem] mb-2\"\n                  style={{ display: '-webkit-box', WebkitLineClamp: 2, WebkitBoxOrient: 'vertical' }}>{description}</p>\n              )}\n              <div className=\"flex items-center gap-2 text-xs text-ods-text-secondary\">\n                <span className=\"font-medium\">{effectiveData.siteName}</span>\n                <span>•</span>\n                <span className=\"truncate\">{ogDomain}</span>\n              </div>\n            </div>\n          </div>\n        </div>\n      </a>\n    </div>\n  )\n}\n"]}

package/dist/chunk-6JINAOI7.cjs

@@ -1,311 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }"use client";
-
-
-
-var _chunkFIG2RKZFcjs = require('./chunk-FIG2RKZF.cjs');
-
-
-var _chunkWZW7C7TFcjs = require('./chunk-WZW7C7TF.cjs');
-
-// src/components/ui/field-wrapper.tsx
-_chunkFIG2RKZFcjs.init_cn.call(void 0, );
-var _react = require('react'); var React = _interopRequireWildcard(_react); var React2 = _interopRequireWildcard(_react); var React3 = _interopRequireWildcard(_react); var React4 = _interopRequireWildcard(_react);
-var _jsxruntime = require('react/jsx-runtime');
-var errorVariantClasses = {
-  error: "text-ods-error",
-  warning: "text-[var(--ods-attention-yellow-warning)]"
-};
-var FieldWrapper = React.forwardRef(
-  ({ label, error, errorVariant = "error", className, children }, ref) => {
-    const hasChrome = label != null || error != null;
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref, className: _chunkFIG2RKZFcjs.cn.call(void 0, hasChrome ? "relative flex w-full flex-col" : "contents", className), children: [
-      label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { className: "text-h4 text-ods-text-primary mb-1", children: label }),
-      children,
-      error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: _chunkFIG2RKZFcjs.cn.call(void 0, "absolute bottom-0 left-0 right-0 translate-y-full text-h6 truncate", errorVariantClasses[errorVariant]), title: error, children: error })
-    ] });
-  }
-);
-FieldWrapper.displayName = "FieldWrapper";
-
-// src/components/ui/input.tsx
-_chunkFIG2RKZFcjs.init_cn.call(void 0, );
-
-var _lucidereact = require('lucide-react');
-
-var invalidBorderClasses = {
-  error: "border-ods-error hover:border-ods-error has-[:focus]:border-ods-error",
-  warning: "!border-[var(--ods-attention-yellow-warning)] hover:!border-[var(--ods-attention-yellow-warning)] has-[:focus]:!border-[var(--ods-attention-yellow-warning)]"
-};
-var Input = React2.forwardRef(
-  ({ className, type, invalid = false, startAdornment, endAdornment, label, error, errorVariant = "error", loading = false, ...props }, ref) => {
-    const isInvalid = invalid || !!error;
-    if (type === "range") {
-      const rangeInput = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "input",
-        {
-          type: "range",
-          className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-            "w-full cursor-pointer appearance-none rounded-full bg-white/30 h-1",
-            // Webkit (Chrome/Safari) thumb
-            "[&::-webkit-slider-thumb]:appearance-none",
-            "[&::-webkit-slider-thumb]:w-3 [&::-webkit-slider-thumb]:h-3",
-            "[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white",
-            "[&::-webkit-slider-thumb]:cursor-pointer [&::-webkit-slider-thumb]:shadow-sm",
-            // Firefox thumb
-            "[&::-moz-range-thumb]:w-3 [&::-moz-range-thumb]:h-3",
-            "[&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:bg-white",
-            "[&::-moz-range-thumb]:border-0 [&::-moz-range-thumb]:cursor-pointer",
-            // Firefox track
-            "[&::-moz-range-track]:bg-transparent",
-            // Disabled
-            "disabled:cursor-not-allowed disabled:opacity-50",
-            className
-          ),
-          ref,
-          ...props
-        }
-      );
-      return label ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FieldWrapper, { label, error, errorVariant, children: rangeInput }) : rangeInput;
-    }
-    const content = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "label",
-      {
-        "data-invalid": isInvalid || void 0,
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          // Layout & spacing
-          "flex w-full items-center gap-2 rounded-[6px] border px-3 h-11 md:h-12 cursor-text",
-          // Focus-within states
-          "has-[:focus-visible]:outline-none",
-          "group",
-          // Animations & touch UX
-          "transition-colors duration-200",
-          // Theme palette
-          "bg-ods-card border-ods-border has-[:focus]:border-ods-accent",
-          // Hover & active (not disabled)
-          !props.disabled && "hover:bg-ods-bg-hover hover:border-ods-border-hover active:bg-ods-bg-active active:border-ods-border-active",
-          // Disabled
-          props.disabled && "!cursor-not-allowed bg-ods-bg",
-          // Invalid
-          isInvalid && invalidBorderClasses[errorVariant],
-          className
-        ),
-        children: [
-          startAdornment && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-h6 flex-shrink-0 text-ods-text-secondary transition-colors duration-200 group-has-[:focus]:text-ods-accent group-data-[invalid]:text-ods-error [&_svg]:size-4 md:[&_svg]:size-6", children: startAdornment }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "input",
-            {
-              type,
-              className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-                // Layout
-                "flex-1 min-w-0 bg-transparent border-none outline-none",
-                // Typography
-                "text-h4",
-                // Colors
-                "text-ods-text-primary placeholder:text-ods-text-secondary",
-                // File input adjustments
-                "file:border-0 file:bg-transparent",
-                // Disabled
-                "disabled:cursor-not-allowed disabled:text-ods-text-disabled disabled:placeholder:text-ods-border",
-                // Touch
-                "touch-manipulation",
-                // Autofill override
-                "[&:-webkit-autofill]:[-webkit-box-shadow:0_0_0_9999px_transparent_inset] [&:-webkit-autofill]:[-webkit-text-fill-color:var(--color-text-primary)] [&:-webkit-autofill]:[caret-color:var(--color-text-primary)] [&:-webkit-autofill]:[transition:background-color_9999s_ease-in-out_0s]"
-              ),
-              ref,
-              ...props
-            }
-          ),
-          loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Loader2, { className: "animate-spin flex-shrink-0 text-ods-text-secondary size-4 md:size-6" }),
-          !loading && endAdornment && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-h6 flex-shrink-0 text-ods-text-secondary transition-colors duration-200 group-has-[:focus]:text-ods-accent group-data-[invalid]:text-ods-error [&_svg]:size-4 md:[&_svg]:size-6", children: endAdornment })
-        ]
-      }
-    );
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FieldWrapper, { label, error, errorVariant, children: content });
-  }
-);
-Input.displayName = "Input";
-
-// src/components/ui/checkbox.tsx
-_chunkFIG2RKZFcjs.init_cn.call(void 0, );
-
-var _reactcheckbox = require('@radix-ui/react-checkbox'); var CheckboxPrimitive = _interopRequireWildcard(_reactcheckbox);
-
-var Checkbox = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  CheckboxPrimitive.Root,
-  {
-    ref,
-    className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-      "peer h-4 w-4 shrink-0 rounded-sm border border-ods-border bg-ods-card focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ods-accent focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-ods-accent data-[state=checked]:border-ods-accent",
-      className
-    ),
-    ...props,
-    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      CheckboxPrimitive.Indicator,
-      {
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, "flex items-center justify-center text-ods-text-on-accent"),
-        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWZW7C7TFcjs.CheckboxCheckmarkIcon, { size: 10 })
-      }
-    )
-  }
-));
-Checkbox.displayName = CheckboxPrimitive.Root.displayName;
-
-// src/components/ui/skeleton.tsx
-_chunkFIG2RKZFcjs.init_cn.call(void 0, );
-
-
-var Skeleton = React4.forwardRef(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      "div",
-      {
-        ref,
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          "animate-pulse rounded-md bg-ods-border",
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-Skeleton.displayName = "Skeleton";
-var SkeletonText = React4.forwardRef(
-  ({ lines = 1, className, ...props }, ref) => {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref, className: _chunkFIG2RKZFcjs.cn.call(void 0, "space-y-2", className), ...props, children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      Skeleton,
-      {
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          "h-4",
-          i === lines - 1 && lines > 1 && "w-3/4"
-          // Last line shorter for multi-line
-        )
-      },
-      i
-    )) });
-  }
-);
-SkeletonText.displayName = "SkeletonText";
-var SkeletonCard = React4.forwardRef(
-  ({ showImage = false, className, ...props }, ref) => {
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "div",
-      {
-        ref,
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          "rounded-lg border border-ods-border overflow-hidden",
-          className
-        ),
-        ...props,
-        children: [
-          showImage && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "h-48 w-full" }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "p-6", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "h-6 w-3/4 mb-4" }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SkeletonText, { lines: 3 })
-          ] })
-        ]
-      }
-    );
-  }
-);
-SkeletonCard.displayName = "SkeletonCard";
-var SkeletonGrid = React4.forwardRef(
-  ({ columns = 3, items = 6, showImages = false, className, ...props }, ref) => {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      "div",
-      {
-        ref,
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          `grid grid-cols-1 gap-6`,
-          columns === 2 && "md:grid-cols-2",
-          columns === 3 && "md:grid-cols-3",
-          columns === 4 && "md:grid-cols-4",
-          className
-        ),
-        ...props,
-        children: Array.from({ length: items }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SkeletonCard, { showImage: showImages }, i))
-      }
-    );
-  }
-);
-SkeletonGrid.displayName = "SkeletonGrid";
-var SkeletonButton = React4.forwardRef(
-  ({ size = "default", className, ...props }, ref) => {
-    const sizeClasses = {
-      sm: "h-8 w-20",
-      default: "h-10 w-32",
-      lg: "h-12 w-40"
-    };
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      Skeleton,
-      {
-        ref,
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          "rounded-lg",
-          sizeClasses[size],
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-SkeletonButton.displayName = "SkeletonButton";
-var SkeletonHeading = React4.forwardRef(
-  ({ level = 1, className, ...props }, ref) => {
-    const heightClasses = {
-      1: "h-12",
-      2: "h-10",
-      3: "h-8",
-      4: "h-7",
-      5: "h-6",
-      6: "h-5"
-    };
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      Skeleton,
-      {
-        ref,
-        className: _chunkFIG2RKZFcjs.cn.call(void 0, 
-          heightClasses[level],
-          "w-3/4",
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-SkeletonHeading.displayName = "SkeletonHeading";
-var SkeletonList = React4.forwardRef(
-  ({ items = 5, className, ...props }, ref) => {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref, className: _chunkFIG2RKZFcjs.cn.call(void 0, "space-y-3", className), ...props, children: Array.from({ length: items }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "h-10 w-10 rounded-full flex-shrink-0" }),
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "h-4 w-1/3 mb-1" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "h-3 w-1/2" })
-      ] })
-    ] }, i)) });
-  }
-);
-SkeletonList.displayName = "SkeletonList";
-var SkeletonNavigation = React4.forwardRef(
-  ({ items = 6, className, ...props }, ref) => {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref, className: _chunkFIG2RKZFcjs.cn.call(void 0, "flex items-center gap-6", className), ...props, children: Array.from({ length: items }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "h-5 w-20" }, i)) });
-  }
-);
-SkeletonNavigation.displayName = "SkeletonNavigation";
-
-
-
-
-
-
-
-
-
-
-
-
-
-exports.FieldWrapper = FieldWrapper; exports.Input = Input; exports.Checkbox = Checkbox; exports.Skeleton = Skeleton; exports.SkeletonText = SkeletonText; exports.SkeletonCard = SkeletonCard; exports.SkeletonGrid = SkeletonGrid; exports.SkeletonButton = SkeletonButton; exports.SkeletonHeading = SkeletonHeading; exports.SkeletonList = SkeletonList; exports.SkeletonNavigation = SkeletonNavigation;
-//# sourceMappingURL=chunk-6JINAOI7.cjs.map

package/dist/chunk-6JINAOI7.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-6JINAOI7.cjs","../src/components/ui/field-wrapper.tsx","../src/components/ui/input.tsx","../src/components/ui/checkbox.tsx","../src/components/ui/skeleton.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-6JINAOI7.cjs","sourcesContent":[null,"\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../utils/cn\"\n\nexport interface FieldWrapperProps {\n  /** Label text displayed above the field */\n  label?: string\n  /** Error message displayed below the field. Space is always reserved to prevent layout shifts. */\n  error?: string\n  /** Color variant for the error message: \"error\" (red) or \"warning\" (yellow) */\n  errorVariant?: \"error\" | \"warning\"\n  /** Additional className for the outer wrapper */\n  className?: string\n  children: React.ReactNode\n}\n\nconst errorVariantClasses = {\n  error: \"text-ods-error\",\n  warning: \"text-[var(--ods-attention-yellow-warning)]\",\n} as const\n\nconst FieldWrapper = React.forwardRef<HTMLDivElement, FieldWrapperProps>(\n  ({ label, error, errorVariant = \"error\", className, children }, ref) => {\n    const hasChrome = label != null || error != null\n\n    return (\n      <div ref={ref} className={cn(hasChrome ? \"relative flex w-full flex-col\" : \"contents\", className)}>\n        {label && (\n          <label className=\"text-h4 text-ods-text-primary mb-1\">\n            {label}\n          </label>\n        )}\n        {children}\n        {error && (\n          <p className={cn(\"absolute bottom-0 left-0 right-0 translate-y-full text-h6 truncate\", errorVariantClasses[errorVariant])} title={error}>\n            {error}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\nFieldWrapper.displayName = \"FieldWrapper\"\n\nexport { FieldWrapper }\n","\"use client\"\n\nimport * as React from \"react\";\n\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { FieldWrapper } from \"./field-wrapper\";\n\nexport interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {\n  /** When true, renders error border & ring */\n  invalid?: boolean;\n  /** Element displayed at the start (left) of the input */\n  startAdornment?: React.ReactNode;\n  /** Element displayed at the end (right) of the input */\n  endAdornment?: React.ReactNode;\n  /** Label text displayed above the input */\n  label?: string;\n  /** Error message displayed below the input */\n  error?: string;\n  /** Color variant for error state: \"error\" (red) or \"warning\" (yellow) */\n  errorVariant?: \"error\" | \"warning\";\n  /** When true, shows a loading spinner as end adornment */\n  loading?: boolean;\n}\n\nconst invalidBorderClasses = {\n  error: \"border-ods-error hover:border-ods-error has-[:focus]:border-ods-error\",\n  warning: \"!border-[var(--ods-attention-yellow-warning)] hover:!border-[var(--ods-attention-yellow-warning)] has-[:focus]:!border-[var(--ods-attention-yellow-warning)]\",\n} as const;\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type, invalid = false, startAdornment, endAdornment, label, error, errorVariant = \"error\", loading = false, ...props }, ref) => {\n    const isInvalid = invalid || !!error\n\n    // Range inputs get a clean slider rendering — no label wrapper, borders, or adornments\n    if (type === 'range') {\n      const rangeInput = (\n        <input\n          type=\"range\"\n          className={cn(\n            \"w-full cursor-pointer appearance-none rounded-full bg-white/30 h-1\",\n            // Webkit (Chrome/Safari) thumb\n            \"[&::-webkit-slider-thumb]:appearance-none\",\n            \"[&::-webkit-slider-thumb]:w-3 [&::-webkit-slider-thumb]:h-3\",\n            \"[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white\",\n            \"[&::-webkit-slider-thumb]:cursor-pointer [&::-webkit-slider-thumb]:shadow-sm\",\n            // Firefox thumb\n            \"[&::-moz-range-thumb]:w-3 [&::-moz-range-thumb]:h-3\",\n            \"[&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:bg-white\",\n            \"[&::-moz-range-thumb]:border-0 [&::-moz-range-thumb]:cursor-pointer\",\n            // Firefox track\n            \"[&::-moz-range-track]:bg-transparent\",\n            // Disabled\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            className\n          )}\n          ref={ref}\n          {...props}\n        />\n      )\n      return label ? (\n        <FieldWrapper label={label} error={error} errorVariant={errorVariant}>\n          {rangeInput}\n        </FieldWrapper>\n      ) : rangeInput\n    }\n\n    const content = (\n      <label\n        data-invalid={isInvalid || undefined}\n        className={cn(\n          // Layout & spacing\n          \"flex w-full items-center gap-2 rounded-[6px] border px-3 h-11 md:h-12 cursor-text\",\n          // Focus-within states\n          \"has-[:focus-visible]:outline-none\",\n          \"group\",\n          // Animations & touch UX\n          \"transition-colors duration-200\",\n          // Theme palette\n          \"bg-ods-card border-ods-border has-[:focus]:border-ods-accent\",\n          // Hover & active (not disabled)\n          !props.disabled && \"hover:bg-ods-bg-hover hover:border-ods-border-hover active:bg-ods-bg-active active:border-ods-border-active\",\n          // Disabled\n          props.disabled && \"!cursor-not-allowed bg-ods-bg\",\n          // Invalid\n          isInvalid && invalidBorderClasses[errorVariant],\n          className\n        )}\n      >\n        {startAdornment && (\n          <span className=\"text-h6 flex-shrink-0 text-ods-text-secondary transition-colors duration-200 group-has-[:focus]:text-ods-accent group-data-[invalid]:text-ods-error [&_svg]:size-4 md:[&_svg]:size-6\">\n            {startAdornment}\n          </span>\n        )}\n        <input\n          type={type}\n          className={cn(\n            // Layout\n            \"flex-1 min-w-0 bg-transparent border-none outline-none\",\n            // Typography\n            \"text-h4\",\n            // Colors\n            \"text-ods-text-primary placeholder:text-ods-text-secondary\",\n            // File input adjustments\n            \"file:border-0 file:bg-transparent\",\n            // Disabled\n            \"disabled:cursor-not-allowed disabled:text-ods-text-disabled disabled:placeholder:text-ods-border\",\n            // Touch\n            \"touch-manipulation\",\n            // Autofill override\n            \"[&:-webkit-autofill]:[-webkit-box-shadow:0_0_0_9999px_transparent_inset] [&:-webkit-autofill]:[-webkit-text-fill-color:var(--color-text-primary)] [&:-webkit-autofill]:[caret-color:var(--color-text-primary)] [&:-webkit-autofill]:[transition:background-color_9999s_ease-in-out_0s]\"\n          )}\n          ref={ref}\n          {...props}\n        />\n        {loading && (\n          <Loader2 className=\"animate-spin flex-shrink-0 text-ods-text-secondary size-4 md:size-6\" />\n        )}\n        {!loading && endAdornment && (\n          <span className=\"text-h6 flex-shrink-0 text-ods-text-secondary transition-colors duration-200 group-has-[:focus]:text-ods-accent group-data-[invalid]:text-ods-error [&_svg]:size-4 md:[&_svg]:size-6\">\n            {endAdornment}\n          </span>\n        )}\n      </label>\n    )\n\n    return (\n      <FieldWrapper label={label} error={error} errorVariant={errorVariant}>\n        {content}\n      </FieldWrapper>\n    )\n  }\n)\nInput.displayName = \"Input\"\n\nexport { Input };\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\"\n\nimport { cn } from \"../../utils/cn\"\nimport { CheckboxCheckmarkIcon } from \"../icons-v2-generated/signs-and-symbols/checkbox-checkmark-icon\"\n\nconst Checkbox = React.forwardRef<\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <CheckboxPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"peer h-4 w-4 shrink-0 rounded-sm border border-ods-border bg-ods-card focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ods-accent focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-ods-accent data-[state=checked]:border-ods-accent\",\n      className\n    )}\n    {...props}\n  >\n    <CheckboxPrimitive.Indicator\n      className={cn(\"flex items-center justify-center text-ods-text-on-accent\")}\n    >\n      <CheckboxCheckmarkIcon size={10} />\n    </CheckboxPrimitive.Indicator>\n  </CheckboxPrimitive.Root>\n))\nCheckbox.displayName = CheckboxPrimitive.Root.displayName\n\nexport { Checkbox }\n","\"use client\"\n\nimport * as React from 'react'\nimport { cn } from \"../../utils/cn\"\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  className?: string\n}\n\nconst Skeleton = React.forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"animate-pulse rounded-md bg-ods-border\",\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nSkeleton.displayName = 'Skeleton'\n\ninterface SkeletonTextProps extends React.HTMLAttributes<HTMLDivElement> {\n  lines?: number\n  className?: string\n}\n\nconst SkeletonText = React.forwardRef<HTMLDivElement, SkeletonTextProps>(\n  ({ lines = 1, className, ...props }, ref) => {\n    return (\n      <div ref={ref} className={cn(\"space-y-2\", className)} {...props}>\n        {Array.from({ length: lines }).map((_, i) => (\n          <Skeleton \n            key={i} \n            className={cn(\n              \"h-4\",\n              i === lines - 1 && lines > 1 && \"w-3/4\" // Last line shorter for multi-line\n            )} \n          />\n        ))}\n      </div>\n    )\n  }\n)\nSkeletonText.displayName = 'SkeletonText'\n\ninterface SkeletonCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  showImage?: boolean\n  className?: string\n}\n\nconst SkeletonCard = React.forwardRef<HTMLDivElement, SkeletonCardProps>(\n  ({ showImage = false, className, ...props }, ref) => {\n    return (\n      <div \n        ref={ref}\n        className={cn(\n          \"rounded-lg border border-ods-border overflow-hidden\",\n          className\n        )}\n        {...props}\n      >\n        {showImage && (\n          <Skeleton className=\"h-48 w-full\" />\n        )}\n        <div className=\"p-6\">\n          <Skeleton className=\"h-6 w-3/4 mb-4\" />\n          <SkeletonText lines={3} />\n        </div>\n      </div>\n    )\n  }\n)\nSkeletonCard.displayName = 'SkeletonCard'\n\ninterface SkeletonGridProps extends React.HTMLAttributes<HTMLDivElement> {\n  columns?: number\n  items?: number\n  showImages?: boolean\n  className?: string\n}\n\nconst SkeletonGrid = React.forwardRef<HTMLDivElement, SkeletonGridProps>(\n  ({ columns = 3, items = 6, showImages = false, className, ...props }, ref) => {\n    return (\n      <div \n        ref={ref}\n        className={cn(\n          `grid grid-cols-1 gap-6`,\n          columns === 2 && \"md:grid-cols-2\",\n          columns === 3 && \"md:grid-cols-3\",\n          columns === 4 && \"md:grid-cols-4\",\n          className\n        )}\n        {...props}\n      >\n        {Array.from({ length: items }).map((_, i) => (\n          <SkeletonCard key={i} showImage={showImages} />\n        ))}\n      </div>\n    )\n  }\n)\nSkeletonGrid.displayName = 'SkeletonGrid'\n\ninterface SkeletonButtonProps extends React.HTMLAttributes<HTMLDivElement> {\n  size?: 'sm' | 'default' | 'lg'\n  className?: string\n}\n\nconst SkeletonButton = React.forwardRef<HTMLDivElement, SkeletonButtonProps>(\n  ({ size = 'default', className, ...props }, ref) => {\n    const sizeClasses = {\n      sm: 'h-8 w-20',\n      default: 'h-10 w-32',\n      lg: 'h-12 w-40'\n    }\n    \n    return (\n      <Skeleton \n        ref={ref}\n        className={cn(\n          \"rounded-lg\",\n          sizeClasses[size],\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nSkeletonButton.displayName = 'SkeletonButton'\n\ninterface SkeletonHeadingProps extends React.HTMLAttributes<HTMLDivElement> {\n  level?: 1 | 2 | 3 | 4 | 5 | 6\n  className?: string\n}\n\nconst SkeletonHeading = React.forwardRef<HTMLDivElement, SkeletonHeadingProps>(\n  ({ level = 1, className, ...props }, ref) => {\n    const heightClasses = {\n      1: 'h-12',\n      2: 'h-10',\n      3: 'h-8',\n      4: 'h-7',\n      5: 'h-6',\n      6: 'h-5'\n    }\n    \n    return (\n      <Skeleton \n        ref={ref}\n        className={cn(\n          heightClasses[level],\n          \"w-3/4\",\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nSkeletonHeading.displayName = 'SkeletonHeading'\n\ninterface SkeletonListProps extends React.HTMLAttributes<HTMLDivElement> {\n  items?: number\n  className?: string\n}\n\nconst SkeletonList = React.forwardRef<HTMLDivElement, SkeletonListProps>(\n  ({ items = 5, className, ...props }, ref) => {\n    return (\n      <div ref={ref} className={cn(\"space-y-3\", className)} {...props}>\n        {Array.from({ length: items }).map((_, i) => (\n          <div key={i} className=\"flex items-center gap-3\">\n            <Skeleton className=\"h-10 w-10 rounded-full flex-shrink-0\" />\n            <div className=\"flex-1\">\n              <Skeleton className=\"h-4 w-1/3 mb-1\" />\n              <Skeleton className=\"h-3 w-1/2\" />\n            </div>\n          </div>\n        ))}\n      </div>\n    )\n  }\n)\nSkeletonList.displayName = 'SkeletonList'\n\ninterface SkeletonNavigationProps extends React.HTMLAttributes<HTMLDivElement> {\n  items?: number\n  className?: string\n}\n\nconst SkeletonNavigation = React.forwardRef<HTMLDivElement, SkeletonNavigationProps>(\n  ({ items = 6, className, ...props }, ref) => {\n    return (\n      <div ref={ref} className={cn(\"flex items-center gap-6\", className)} {...props}>\n        {Array.from({ length: items }).map((_, i) => (\n          <Skeleton key={i} className=\"h-5 w-20\" />\n        ))}\n      </div>\n    )\n  }\n)\nSkeletonNavigation.displayName = 'SkeletonNavigation'\n\nexport { \n  Skeleton,\n  SkeletonText,\n  SkeletonCard,\n  SkeletonGrid,\n  SkeletonButton,\n  SkeletonHeading,\n  SkeletonList,\n  SkeletonNavigation\n}"]}