@flamingo-stack/openframe-frontend-core 0.0.569 → 0.0.570

package/dist/{chunk-FE5QR7PT.js → chunk-5NVVVIHJ.js}

@@ -58,7 +58,7 @@ import {
   useResetOnPageHidden,
   useSuppressCloneFocus,
   useToast
-} from "./chunk-TXEI4PES.js";
+} from "./chunk-YFLKONLB.js";
 import {
   init_next_navigation,
   usePathname,
@@ -24835,7 +24835,7 @@ import { ExternalLink as ExternalLink3, Play as Play3, LayoutGrid } from "lucide
 // src/components/embeds/embed-viewer-frame.tsx
 init_cn();
 import { useEffect as useEffect46, useRef as useRef36, useState as useState55 } from "react";
-import { Maximize2, Minimize2 } from "lucide-react";
+import { Loader2 as Loader22, Maximize2, Minimize2 } from "lucide-react";
 
 // src/utils/fullscreen-switch.ts
 var fullscreenElementOf = (doc) => doc.fullscreenElement ?? doc.webkitFullscreenElement ?? null;
@@ -25014,8 +25014,10 @@ function EmbedViewerFrame({
   titleVariant = "h3",
   actions,
   src,
+  isLoading,
   emptyIcon,
   emptyMessage = "Content not available",
+  loadingMessage = "Loading\u2026",
   height,
   allow,
   allowFullScreen,
@@ -25085,6 +25087,21 @@ function EmbedViewerFrame({
             loading,
             sandbox
           }
+        ) : isLoading ? (
+          // SAME box as the empty/iframe state (height + border), so a viewer
+          // resolving its frame doesn't collapse then jump — it reads as
+          // "loading" and settles into the iframe in place.
+          /* @__PURE__ */ jsxs130(
+            "div",
+            {
+              className: "flex flex-col items-center justify-center gap-3 rounded-lg border border-ods-border px-4 py-16 text-center",
+              style: height ? { height } : void 0,
+              children: [
+                /* @__PURE__ */ jsx170(Loader22, { className: "h-8 w-8 animate-spin text-ods-accent" }),
+                /* @__PURE__ */ jsx170("p", { className: "text-ods-text-secondary", children: loadingMessage })
+              ]
+            }
+          )
         ) : (
           // The SAME box the iframe would have filled: same height, same rounded
           // border. A viewer whose content is missing must not collapse the page
@@ -25208,8 +25225,9 @@ var KIND_HEADING = {
   design: "Claude Design"
 };
 function ClaudeEmbed({ url, kind = "artifact", title, height, loading = "lazy" }) {
-  const mirrorSrc = useClaudeMirrorSrc(url);
-  const embedUrl = mirrorSrc ?? toClaudeEmbedUrl(url);
+  const { src: mirrorSrc, status } = useClaudeMirrorSrc(url);
+  const isProbing = status === "probing";
+  const embedUrl = isProbing ? null : mirrorSrc ?? toClaudeEmbedUrl(url);
   return /* @__PURE__ */ jsx172(
     EmbedViewerFrame,
     {
@@ -25217,6 +25235,8 @@ function ClaudeEmbed({ url, kind = "artifact", title, height, loading = "lazy" }
       icon: /* @__PURE__ */ jsx172(ClaudeIcon, { className: "w-5 h-5 shrink-0" }),
       title: title?.trim() || KIND_HEADING[kind],
       titleVariant: "h6",
+      isLoading: isProbing,
+      loadingMessage: "Loading artifact\u2026",
       actions: /* @__PURE__ */ jsx172(
         Button,
         {
@@ -30704,7 +30724,7 @@ function useThemeToggle() {
 
 // src/components/features/array-entry-manager.tsx
 import { useState as useState64, useEffect as useEffect52 } from "react";
-import { Trash2, Plus as Plus2, Save, Loader2 as Loader22 } from "lucide-react";
+import { Trash2, Plus as Plus2, Save, Loader2 as Loader23 } from "lucide-react";
 import { jsx as jsx217, jsxs as jsxs165 } from "react/jsx-runtime";
 function ArrayEntryManager({
   title,
@@ -30788,7 +30808,7 @@ function ArrayEntryManager({
             size: "small-legacy",
             onClick: handleSave,
             disabled: isSaving,
-            leftIcon: isSaving ? /* @__PURE__ */ jsx217(Loader22, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx217(Save, { className: "h-4 w-4" }),
+            leftIcon: isSaving ? /* @__PURE__ */ jsx217(Loader23, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx217(Save, { className: "h-4 w-4" }),
             className: "text-h6 bg-ods-accent text-ods-text-on-accent hover:bg-ods-accent-hover",
             children: isSaving ? "Saving..." : saveButtonText
           }
@@ -33457,7 +33477,7 @@ import {
   Image as ImageIcon2,
   Video as VideoIcon,
   Trash2 as Trash23,
-  Loader2 as Loader23,
+  Loader2 as Loader24,
   GripVertical,
   Plus as Plus4
 } from "lucide-react";
@@ -33544,7 +33564,7 @@ function MediaGalleryManager({
               onClick: () => handleDeleteMedia(index),
               disabled: isDeleting,
               className: "h-8 w-8 p-0 bg-ods-error hover:bg-ods-error-hover border-ods-error",
-              children: isDeleting ? /* @__PURE__ */ jsx246(Loader23, { className: "h-4 w-4 animate-spin text-ods-text-on-dark" }) : /* @__PURE__ */ jsx246(Trash23, { className: "h-4 w-4 text-ods-text-on-dark" })
+              children: isDeleting ? /* @__PURE__ */ jsx246(Loader24, { className: "h-4 w-4 animate-spin text-ods-text-on-dark" }) : /* @__PURE__ */ jsx246(Trash23, { className: "h-4 w-4 text-ods-text-on-dark" })
             }
           ) }),
           /* @__PURE__ */ jsx246("div", { className: "aspect-video relative bg-ods-bg rounded-lg overflow-hidden", children: mediaItem.media_type === "video" || mediaItem.media_type === "demo" ? (
@@ -33575,7 +33595,7 @@ function MediaGalleryManager({
   }, [deletingIndex, handleDragStart, handleDragOver, handleDrop, handleDeleteMedia]);
   const content = /* @__PURE__ */ jsxs187("div", { className: `space-y-6 ${className}`, children: [
     /* @__PURE__ */ jsx246("div", { className: "border-2 border-dashed border-ods-border rounded-lg p-6 text-center hover:border-ods-accent/50 transition-colors", children: /* @__PURE__ */ jsxs187("div", { className: "flex flex-col items-center gap-4", children: [
-      /* @__PURE__ */ jsx246("div", { className: "w-12 h-12 rounded-full bg-ods-card flex items-center justify-center", children: isUploading ? /* @__PURE__ */ jsx246(Loader23, { className: "h-6 w-6 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsx246(Upload, { className: "h-6 w-6 text-ods-accent" }) }),
+      /* @__PURE__ */ jsx246("div", { className: "w-12 h-12 rounded-full bg-ods-card flex items-center justify-center", children: isUploading ? /* @__PURE__ */ jsx246(Loader24, { className: "h-6 w-6 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsx246(Upload, { className: "h-6 w-6 text-ods-accent" }) }),
       /* @__PURE__ */ jsxs187("div", { children: [
         /* @__PURE__ */ jsx246("h3", { className: "text-h3 text-ods-text-primary mb-1", children: isUploading ? "Uploading..." : "Upload Media" }),
         /* @__PURE__ */ jsx246("p", { className: "text-h6 text-ods-text-secondary", children: "Drag and drop or click to select images and videos" }),
@@ -34239,7 +34259,7 @@ function PushButtonSelector({
 
 // src/components/features/release-media-manager.tsx
 import { useState as useState73, useRef as useRef42 } from "react";
-import { Trash2 as Trash24, Plus as Plus5, Image as ImageIcon3, Video as VideoIcon2, Upload as Upload2, Loader2 as Loader24, GripVertical as GripVertical2 } from "lucide-react";
+import { Trash2 as Trash24, Plus as Plus5, Image as ImageIcon3, Video as VideoIcon2, Upload as Upload2, Loader2 as Loader25, GripVertical as GripVertical2 } from "lucide-react";
 import { jsx as jsx253, jsxs as jsxs193 } from "react/jsx-runtime";
 function ReleaseMediaManager({
   media,
@@ -34319,7 +34339,7 @@ function ReleaseMediaManager({
   };
   return /* @__PURE__ */ jsxs193("div", { className: `space-y-4 ${className}`, children: [
     /* @__PURE__ */ jsx253("div", { className: "border-2 border-dashed border-ods-border rounded-lg p-6 text-center hover:border-ods-accent/50 transition-colors", children: /* @__PURE__ */ jsxs193("div", { className: "flex flex-col items-center gap-4", children: [
-      /* @__PURE__ */ jsx253("div", { className: "w-12 h-12 rounded-full bg-ods-card flex items-center justify-center", children: uploadingIndex !== null ? /* @__PURE__ */ jsx253(Loader24, { className: "h-6 w-6 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsx253(Upload2, { className: "h-6 w-6 text-ods-accent" }) }),
+      /* @__PURE__ */ jsx253("div", { className: "w-12 h-12 rounded-full bg-ods-card flex items-center justify-center", children: uploadingIndex !== null ? /* @__PURE__ */ jsx253(Loader25, { className: "h-6 w-6 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsx253(Upload2, { className: "h-6 w-6 text-ods-accent" }) }),
       /* @__PURE__ */ jsxs193("div", { children: [
         /* @__PURE__ */ jsx253("h3", { className: "text-h3 text-ods-text-primary mb-1", children: uploadingIndex !== null ? "Uploading..." : "Upload Media" }),
         /* @__PURE__ */ jsx253("p", { className: "text-h6 text-ods-text-secondary", children: "Drag and drop or click to select images and videos" }),
@@ -34395,7 +34415,7 @@ function ReleaseMediaManager({
               }
             ) }),
             item._uploading && /* @__PURE__ */ jsx253("div", { className: "aspect-video bg-ods-bg flex items-center justify-center", children: /* @__PURE__ */ jsxs193("div", { className: "flex flex-col items-center gap-2", children: [
-              /* @__PURE__ */ jsx253(Loader24, { className: "h-8 w-8 animate-spin text-ods-accent" }),
+              /* @__PURE__ */ jsx253(Loader25, { className: "h-8 w-8 animate-spin text-ods-accent" }),
               /* @__PURE__ */ jsx253("span", { className: "text-h6 text-ods-text-secondary", children: "Uploading..." })
             ] }) }),
             /* @__PURE__ */ jsxs193("div", { className: "p-3 space-y-2", children: [
@@ -34510,7 +34530,7 @@ SelectButton.displayName = "SelectButton";
 
 // src/components/features/seo-editor-preview.tsx
 import { useState as useState74 } from "react";
-import { Globe as Globe3, ExternalLink as ExternalLink8, Upload as Upload3, X as X6, Loader2 as Loader25 } from "lucide-react";
+import { Globe as Globe3, ExternalLink as ExternalLink8, Upload as Upload3, X as X6, Loader2 as Loader26 } from "lucide-react";
 import { Fragment as Fragment47, jsx as jsx255, jsxs as jsxs195 } from "react/jsx-runtime";
 var SEO_MEDIA_BOX_HEIGHT = "h-[280px]";
 function SEOEditorPreview({
@@ -34694,7 +34714,7 @@ function SEOEditorPreview({
             {
               className: cn(SEO_MEDIA_BOX_HEIGHT, "border-2 border-dashed border-ods-border rounded-lg flex flex-col items-center justify-center cursor-pointer hover:border-ods-accent transition-colors bg-ods-bg-hover"),
               onClick: () => onOgImageUpload && fileInputRef?.click(),
-              children: isUploading ? /* @__PURE__ */ jsx255(Loader25, { className: "h-8 w-8 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsxs195(Fragment47, { children: [
+              children: isUploading ? /* @__PURE__ */ jsx255(Loader26, { className: "h-8 w-8 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsxs195(Fragment47, { children: [
                 /* @__PURE__ */ jsx255(Upload3, { className: "h-8 w-8 text-ods-text-secondary mb-2" }),
                 /* @__PURE__ */ jsx255("span", { className: "text-h6 text-ods-text-secondary", children: onOgImageUpload ? "Click to upload OG image" : "No image" })
               ] })
@@ -34997,7 +35017,7 @@ function StatusFilterComponent({
 
 // src/components/features/tags-selector.tsx
 import { useState as useState75 } from "react";
-import { Search as Search2, X as X7, Plus as Plus6, Loader2 as Loader26 } from "lucide-react";
+import { Search as Search2, X as X7, Plus as Plus6, Loader2 as Loader27 } from "lucide-react";
 import { jsx as jsx259, jsxs as jsxs198 } from "react/jsx-runtime";
 function TagsSelector({
   availableTags,
@@ -35138,7 +35158,7 @@ function TagsSelector({
             type: "button",
             onClick: handleCreateTag,
             disabled: isCreating,
-            leftIcon: isCreating ? /* @__PURE__ */ jsx259(Loader26, { className: "w-3 h-3 animate-spin" }) : /* @__PURE__ */ jsx259(Plus6, { className: "w-3 h-3" }),
+            leftIcon: isCreating ? /* @__PURE__ */ jsx259(Loader27, { className: "w-3 h-3 animate-spin" }) : /* @__PURE__ */ jsx259(Plus6, { className: "w-3 h-3" }),
             className: "w-full flex flex-row items-center gap-1.5 px-2 py-1 mb-2 h-auto rounded border-dashed border-ods-accent bg-ods-bg hover:bg-ods-card text-ods-accent !text-h6",
             children: [
               "Create tag: ",
@@ -36368,7 +36388,7 @@ var AIWarningsSection = ({
 
 // src/components/features/ai-enrich/AIEnrichSection.tsx
 init_button2();
-import { CheckCircle as CheckCircle2, AlertCircle, Loader2 as Loader27, X as X9 } from "lucide-react";
+import { CheckCircle as CheckCircle2, AlertCircle, Loader2 as Loader28, X as X9 } from "lucide-react";
 import { jsx as jsx269, jsxs as jsxs206 } from "react/jsx-runtime";
 var AIEnrichSection = ({
   onEnrich,
@@ -36482,7 +36502,7 @@ var AIEnrichSection = ({
               size: "small-legacy",
               onClick: onCancel,
               disabled: isCancelling,
-              leftIcon: isCancelling ? /* @__PURE__ */ jsx269(Loader27, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx269(X9, { className: "h-4 w-4" }),
+              leftIcon: isCancelling ? /* @__PURE__ */ jsx269(Loader28, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx269(X9, { className: "h-4 w-4" }),
               className: "!w-full",
               children: isCancelling ? "Cancelling..." : "Cancel Processing"
             }
@@ -36503,7 +36523,7 @@ var AIEnrichSection = ({
           )) })
         ] }),
         loading && statusMessage && /* @__PURE__ */ jsxs206("div", { className: "flex items-center gap-3 p-3 rounded-lg bg-ods-bg-surface", children: [
-          /* @__PURE__ */ jsx269(Loader27, { className: "h-5 w-5 text-ods-accent animate-spin" }),
+          /* @__PURE__ */ jsx269(Loader28, { className: "h-5 w-5 text-ods-accent animate-spin" }),
           /* @__PURE__ */ jsx269("span", { className: "text-h6 text-ods-text-primary", children: statusMessage })
         ] }),
         hasResults && /* @__PURE__ */ jsxs206("div", { className: "space-y-4", children: [
@@ -48092,7 +48112,7 @@ function TagSearchInput({
 // src/components/ui/markdown-editor.tsx
 import { useRef as useRef71, useCallback as useCallback49, useState as useState110, useEffect as useEffect85 } from "react";
 init_cn();
-import { Loader2 as Loader28, Upload as Upload8 } from "lucide-react";
+import { Loader2 as Loader29, Upload as Upload8 } from "lucide-react";
 import { jsx as jsx369, jsxs as jsxs289 } from "react/jsx-runtime";
 var MDEditor = dynamic(() => import("@uiw/react-md-editor"), { ssr: false });
 var MARKDOWN_EDITOR_STYLE_ID = "ods-markdown-editor-styles";
@@ -48232,7 +48252,7 @@ function MarkdownEditor({
     name: "upload",
     keyCommand: "upload",
     buttonProps: { "aria-label": "Upload file", title: "Upload file" },
-    icon: isUploading ? /* @__PURE__ */ jsx369(Loader28, { className: "w-3 h-3 animate-spin" }) : /* @__PURE__ */ jsx369(Upload8, { className: "w-3 h-3" }),
+    icon: isUploading ? /* @__PURE__ */ jsx369(Loader29, { className: "w-3 h-3 animate-spin" }) : /* @__PURE__ */ jsx369(Upload8, { className: "w-3 h-3" }),
     execute: () => {
       fileInputRef.current?.click();
     }
@@ -48320,7 +48340,7 @@ function MarkdownEditor({
             accept: "image/*,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.zip,.txt"
           }
         ),
-        !MDEditor && /* @__PURE__ */ jsx369("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx369(Loader28, { className: "h-8 w-8 animate-spin" }) }),
+        !MDEditor && /* @__PURE__ */ jsx369("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx369(Loader29, { className: "h-8 w-8 animate-spin" }) }),
         MDEditor && /* @__PURE__ */ jsx369(
           MDEditor,
           {
@@ -48366,7 +48386,7 @@ function MarkdownEditor({
 
 // src/components/ui/file-upload.tsx
 import * as React133 from "react";
-import { Loader2 as Loader29 } from "lucide-react";
+import { Loader2 as Loader210 } from "lucide-react";
 init_cn();
 import { jsx as jsx370, jsxs as jsxs290 } from "react/jsx-runtime";
 function formatFileSize2(bytes) {
@@ -48604,7 +48624,7 @@ function FileUpload({
                   /* @__PURE__ */ jsxs290("div", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: [
                     /* @__PURE__ */ jsx370("span", { className: "text-h6 text-ods-text-secondary", children: formatFileSize2(entry.fileSize) }),
                     entry.status === "uploading" && /* @__PURE__ */ jsxs290("span", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-h6 text-ods-text-secondary", children: [
-                      /* @__PURE__ */ jsx370(Loader29, { className: "size-3 animate-spin" }),
+                      /* @__PURE__ */ jsx370(Loader210, { className: "size-3 animate-spin" }),
                       "Uploading..."
                     ] }),
                     entry.status === "error" && /* @__PURE__ */ jsx370("span", { className: "text-h6 text-ods-error", children: entry.error || "Upload failed" })
@@ -48692,7 +48712,7 @@ function FileUpload({
 
 // src/components/ui/image-uploader.tsx
 import * as React134 from "react";
-import { Loader2 as Loader210 } from "lucide-react";
+import { Loader2 as Loader211 } from "lucide-react";
 init_cn();
 import { Fragment as Fragment74, jsx as jsx371, jsxs as jsxs291 } from "react/jsx-runtime";
 var DEFAULT_MAX_SIZE = 25 * 1024 * 1024;
@@ -48859,8 +48879,8 @@ function ImageUploader({
               }
             )
           ] }),
-          loading && /* @__PURE__ */ jsx371("div", { className: "absolute inset-0 flex items-center justify-center rounded-md bg-ods-overlay", children: /* @__PURE__ */ jsx371(Loader210, { className: "size-8 animate-spin text-ods-text-on-dark" }) })
-        ] }) : loading ? /* @__PURE__ */ jsx371(Loader210, { className: "size-8 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsxs291(Fragment74, { children: [
+          loading && /* @__PURE__ */ jsx371("div", { className: "absolute inset-0 flex items-center justify-center rounded-md bg-ods-overlay", children: /* @__PURE__ */ jsx371(Loader211, { className: "size-8 animate-spin text-ods-text-on-dark" }) })
+        ] }) : loading ? /* @__PURE__ */ jsx371(Loader211, { className: "size-8 animate-spin text-ods-accent" }) : /* @__PURE__ */ jsxs291(Fragment74, { children: [
           /* @__PURE__ */ jsx371("div", { className: "flex shrink-0 items-center justify-center rounded-full border border-ods-border bg-ods-card p-[var(--spacing-system-s)]", children: /* @__PURE__ */ jsx371(ImagePlusIcon, { className: "size-6 text-ods-text-primary" }) }),
           /* @__PURE__ */ jsxs291("div", { className: "flex w-full flex-col items-center text-center", children: [
             /* @__PURE__ */ jsx371("p", { className: "text-h4 text-ods-text-primary", children: label }),
@@ -63970,4 +63990,4 @@ export {
   LogsList,
   assets
 };
-//# sourceMappingURL=chunk-FE5QR7PT.js.map
+//# sourceMappingURL=chunk-5NVVVIHJ.js.map