@proveanything/smartlinks-utils-ui 0.12.18 → 0.12.20

package/dist/{chunk-2IQEDRSZ.js → chunk-ZTUZPAHD.js}

@@ -506,22 +506,33 @@ var UploadZone = ({
     e.stopPropagation();
     setDragOver(false);
   }, []);
+  const presentForRename = useCallback((file) => {
+    const previewUrl = file.type.startsWith("image/") ? URL.createObjectURL(file) : "";
+    const defaultName = file.name.replace(/\.[^.]+$/, "") || "file";
+    setPastedFile({ file, previewUrl, name: defaultName });
+    setFileName(defaultName);
+    setEditingName(false);
+  }, []);
   const handleDrop = useCallback((e) => {
     e.preventDefault();
     e.stopPropagation();
     setDragOver(false);
     const files = Array.from(e.dataTransfer.files);
-    if (files.length > 0) {
+    if (files.length === 1 && !multiple) {
+      presentForRename(files[0]);
+    } else if (files.length > 0) {
       onFiles(multiple ? files : [files[0]]);
     }
-  }, [onFiles, multiple]);
+  }, [onFiles, multiple, presentForRename]);
   const handleInputChange = useCallback((e) => {
     const files = Array.from(e.target.files || []);
-    if (files.length > 0) {
+    if (files.length === 1 && !multiple) {
+      presentForRename(files[0]);
+    } else if (files.length > 0) {
       onFiles(multiple ? files : [files[0]]);
     }
     e.target.value = "";
-  }, [onFiles, multiple]);
+  }, [onFiles, multiple, presentForRename]);
   if (pastedFile) {
     return /* @__PURE__ */ jsx("div", { className: cn(
       "border-2 border-solid border-primary rounded-lg p-4 transition-colors",
@@ -672,6 +683,7 @@ var UrlImport = ({
   className
 }) => {
   const [url, setUrl] = useState("");
+  const [name, setName] = useState("");
   const [error, setError] = useState("");
   const handleSubmit = useCallback(async (e) => {
     e?.preventDefault();
@@ -684,58 +696,74 @@ var UrlImport = ({
       return;
     }
     setError("");
-    const result = await onImport(url.trim());
-    if (result) setUrl("");
-  }, [url, onImport]);
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex gap-2", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
-      /* @__PURE__ */ jsx(Link, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" }),
-      /* @__PURE__ */ jsx(
-        "input",
+    const result = await onImport(url.trim(), name.trim() || void 0);
+    if (result) {
+      setUrl("");
+      setName("");
+    }
+  }, [url, name, onImport]);
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
+        /* @__PURE__ */ jsx(Link, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "text",
+            value: url,
+            onChange: (e) => {
+              setUrl(e.target.value);
+              setError("");
+            },
+            onKeyDown: (e) => {
+              if (e.key === "Enter") {
+                e.preventDefault();
+                e.stopPropagation();
+                handleSubmit();
+              }
+            },
+            placeholder: "https://example.com/image.png",
+            disabled: importing,
+            className: cn(
+              "w-full pl-8 pr-3 py-2 text-sm rounded-md border bg-transparent",
+              "placeholder:text-muted-foreground",
+              "focus:outline-none focus:ring-2 focus:ring-ring",
+              error ? "border-destructive" : "border-border"
+            )
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(
+        "button",
         {
-          type: "text",
-          value: url,
-          onChange: (e) => {
-            setUrl(e.target.value);
-            setError("");
-          },
-          onKeyDown: (e) => {
-            if (e.key === "Enter") {
-              e.preventDefault();
-              e.stopPropagation();
-              handleSubmit();
-            }
-          },
-          placeholder: "https://example.com/image.png",
-          disabled: importing,
+          type: "button",
+          onClick: handleSubmit,
+          disabled: !url.trim() || importing,
           className: cn(
-            "w-full pl-8 pr-3 py-2 text-sm rounded-md border bg-transparent",
-            "placeholder:text-muted-foreground",
-            "focus:outline-none focus:ring-2 focus:ring-ring",
-            error ? "border-destructive" : "border-border"
-          )
+            "px-3 py-2 text-sm font-medium rounded-md transition-colors",
+            "bg-primary text-primary-foreground hover:bg-primary/90",
+            "disabled:opacity-50 disabled:cursor-not-allowed",
+            "flex items-center gap-1.5"
+          ),
+          children: [
+            importing ? /* @__PURE__ */ jsx(Loader2, { className: "w-3.5 h-3.5 animate-spin" }) : null,
+            "Import"
+          ]
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs(
-      "button",
+    /* @__PURE__ */ jsx(
+      "input",
       {
-        type: "button",
-        onClick: handleSubmit,
-        disabled: !url.trim() || importing,
-        className: cn(
-          "px-3 py-2 text-sm font-medium rounded-md transition-colors",
-          "bg-primary text-primary-foreground hover:bg-primary/90",
-          "disabled:opacity-50 disabled:cursor-not-allowed",
-          "flex items-center gap-1.5"
-        ),
-        children: [
-          importing ? /* @__PURE__ */ jsx(Loader2, { className: "w-3.5 h-3.5 animate-spin" }) : null,
-          "Import"
-        ]
+        type: "text",
+        value: name,
+        onChange: (e) => setName(e.target.value),
+        placeholder: "Optional name (defaults to filename from URL)",
+        disabled: importing,
+        className: "w-full px-3 py-1.5 text-xs rounded-md border border-border bg-transparent placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
       }
     ),
-    error && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive mt-1 absolute", children: error })
+    error && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive", children: error })
   ] });
 };
 var ASPECT_PRESETS = [
@@ -784,6 +812,7 @@ var AIImageGenerate = ({
   const [error, setError] = useState(null);
   const [previewUrl, setPreviewUrl] = useState(null);
   const [saved, setSaved] = useState(false);
+  const [customName, setCustomName] = useState("");
   const SpeechRecognitionCtor = typeof window !== "undefined" ? window.SpeechRecognition || window.webkitSpeechRecognition : null;
   const voiceSupported = !!SpeechRecognitionCtor;
   const recognitionRef = useRef(null);
@@ -886,16 +915,18 @@ var AIImageGenerate = ({
   }, [prompt, aspect, quality, style, provider, model, collectionId]);
   const handleSave = useCallback(async () => {
     if (!previewUrl) return;
-    const trimmed = prompt.trim().slice(0, 60).replace(/\s+/g, "-") || "ai-image";
-    const result = await onSave(previewUrl, `ai-${trimmed}.png`);
+    const custom = customName.trim();
+    const fileName = custom ? /\.[a-z0-9]{2,5}$/i.test(custom) ? custom : `${custom}.png` : `ai-${prompt.trim().slice(0, 60).replace(/\s+/g, "-") || "ai-image"}.png`;
+    const result = await onSave(previewUrl, fileName);
     if (result) {
       setSaved(true);
       setTimeout(() => {
         setPreviewUrl(null);
         setSaved(false);
+        setCustomName("");
       }, 1500);
     }
-  }, [previewUrl, prompt, onSave]);
+  }, [previewUrl, prompt, customName, onSave]);
   if (!collectionId) {
     return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-3 rounded-md bg-muted text-muted-foreground text-sm", children: [
       /* @__PURE__ */ jsx(AlertCircle, { className: "w-4 h-4 flex-shrink-0" }),
@@ -1080,6 +1111,20 @@ var AIImageGenerate = ({
           className: "max-w-full max-h-80 object-contain"
         }
       ) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsx("label", { className: "text-[11px] font-medium text-foreground", children: "Name (optional)" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "text",
+            value: customName,
+            onChange: (e) => setCustomName(e.target.value),
+            placeholder: "Defaults to a name based on your prompt",
+            disabled: saving || saved,
+            className: "w-full px-2 py-1.5 text-xs rounded-md border border-border bg-transparent placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring"
+          }
+        )
+      ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2", children: [
         /* @__PURE__ */ jsx(
           "button",
@@ -1140,6 +1185,7 @@ var StockPhotoSearch = ({
   const [results, setResults] = useState([]);
   const [savedUrl, setSavedUrl] = useState(null);
   const [pendingUrl, setPendingUrl] = useState(null);
+  const [nameOverrides, setNameOverrides] = useState({});
   const handleSearch = useCallback(async () => {
     if (!query.trim() || !collectionId) return;
     setSearching(true);
@@ -1167,14 +1213,15 @@ var StockPhotoSearch = ({
   const handleSave = useCallback(async (photo) => {
     const fullUrl = getFullUrl(photo);
     setPendingUrl(fullUrl);
-    const namePart = (photo.alt || query.trim() || "stock-photo").slice(0, 60).replace(/\s+/g, "-");
-    const result = await onSave(fullUrl, `stock-${namePart}.jpg`);
+    const override = (nameOverrides[fullUrl] || "").trim();
+    const fileName = override ? /\.[a-z0-9]{2,5}$/i.test(override) ? override : `${override}.jpg` : `stock-${(photo.alt || query.trim() || "stock-photo").slice(0, 60).replace(/\s+/g, "-")}.jpg`;
+    const result = await onSave(fullUrl, fileName);
     setPendingUrl(null);
     if (result) {
       setSavedUrl(fullUrl);
       setTimeout(() => setSavedUrl(null), 1500);
     }
-  }, [onSave, query]);
+  }, [onSave, query, nameOverrides]);
   if (!collectionId) {
     return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-3 rounded-md bg-muted text-muted-foreground text-sm", children: [
       /* @__PURE__ */ jsx(AlertCircle, { className: "w-4 h-4 flex-shrink-0" }),
@@ -1245,52 +1292,65 @@ var StockPhotoSearch = ({
       return /* @__PURE__ */ jsxs(
         "div",
         {
-          className: "group relative aspect-square rounded-md overflow-hidden border border-border bg-muted/30",
+          className: "flex flex-col gap-1",
           children: [
+            /* @__PURE__ */ jsxs("div", { className: "group relative aspect-square rounded-md overflow-hidden border border-border bg-muted/30", children: [
+              /* @__PURE__ */ jsx(
+                "img",
+                {
+                  src: thumb,
+                  alt: photo.alt || "",
+                  loading: "lazy",
+                  className: "w-full h-full object-cover"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handleSave(photo),
+                  disabled: !!pendingUrl || saving,
+                  className: cn(
+                    "absolute inset-0 flex items-center justify-center text-xs font-medium",
+                    "bg-background/80 opacity-0 group-hover:opacity-100 transition-opacity",
+                    "text-foreground gap-1.5",
+                    (isPending || isSaved) && "opacity-100"
+                  ),
+                  children: isPending ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(Loader2, { className: "w-3.5 h-3.5 animate-spin" }),
+                    " Saving\u2026"
+                  ] }) : isSaved ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(Check, { className: "w-3.5 h-3.5" }),
+                    " Saved"
+                  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(Image, { className: "w-3.5 h-3.5" }),
+                    " Save"
+                  ] })
+                }
+              ),
+              photo.photographer && /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 inset-x-0 px-1.5 py-0.5 text-[10px] text-background bg-foreground/60 truncate", children: photo.photographerUrl ? /* @__PURE__ */ jsx(
+                "a",
+                {
+                  href: photo.photographerUrl,
+                  target: "_blank",
+                  rel: "noreferrer noopener",
+                  onClick: (e) => e.stopPropagation(),
+                  className: "hover:underline",
+                  children: photo.photographer
+                }
+              ) : photo.photographer })
+            ] }),
             /* @__PURE__ */ jsx(
-              "img",
-              {
-                src: thumb,
-                alt: photo.alt || "",
-                loading: "lazy",
-                className: "w-full h-full object-cover"
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
+              "input",
               {
-                type: "button",
-                onClick: () => handleSave(photo),
-                disabled: !!pendingUrl || saving,
-                className: cn(
-                  "absolute inset-0 flex items-center justify-center text-xs font-medium",
-                  "bg-background/80 opacity-0 group-hover:opacity-100 transition-opacity",
-                  "text-foreground gap-1.5",
-                  (isPending || isSaved) && "opacity-100"
-                ),
-                children: isPending ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Loader2, { className: "w-3.5 h-3.5 animate-spin" }),
-                  " Saving\u2026"
-                ] }) : isSaved ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Check, { className: "w-3.5 h-3.5" }),
-                  " Saved"
-                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Image, { className: "w-3.5 h-3.5" }),
-                  " Save"
-                ] })
+                type: "text",
+                value: nameOverrides[full] || "",
+                onChange: (e) => setNameOverrides((prev) => ({ ...prev, [full]: e.target.value })),
+                placeholder: "Optional name",
+                disabled: isPending || saving,
+                className: "w-full px-1.5 py-1 text-[11px] rounded-md border border-border bg-transparent placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring"
               }
-            ),
-            photo.photographer && /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 inset-x-0 px-1.5 py-0.5 text-[10px] text-background bg-foreground/60 truncate", children: photo.photographerUrl ? /* @__PURE__ */ jsx(
-              "a",
-              {
-                href: photo.photographerUrl,
-                target: "_blank",
-                rel: "noreferrer noopener",
-                onClick: (e) => e.stopPropagation(),
-                className: "hover:underline",
-                children: photo.photographer
-              }
-            ) : photo.photographer })
+            )
           ]
         },
         `${full}-${i}`
@@ -1298,6 +1358,21 @@ var StockPhotoSearch = ({
     }) })
   ] });
 };
+var GlobalUploadToggle = ({ checked, onChange, appName }) => /* @__PURE__ */ jsxs("label", { className: "flex items-start gap-2 text-xs text-muted-foreground cursor-pointer select-none p-2 rounded-md border border-border bg-muted/30", children: [
+  /* @__PURE__ */ jsx(
+    "input",
+    {
+      type: "checkbox",
+      checked,
+      onChange: (e) => onChange(e.target.checked),
+      className: "mt-0.5 cursor-pointer"
+    }
+  ),
+  /* @__PURE__ */ jsxs("span", { children: [
+    /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "Add to shared collection" }),
+    /* @__PURE__ */ jsx("span", { className: "block", children: checked ? `Asset will be available to every app in this collection.` : `Asset will be tagged to ${appName}. Tick to share with every app in the collection instead.` })
+  ] })
+] });
 var ScopedAssetBrowser = ({ scope, accept, pageSize, viewMode, search, selectedIds, onToggleSelect, onDoubleClickSelect, onDelete, allowDelete, emptyText, listAppId, currentAppId, currentAppName, getAppName }) => {
   const { assets, loading, error, refresh } = useAssets({ scope, accept, pageSize, listAppId });
   const filteredAssets = useMemo(() => {
@@ -1364,6 +1439,7 @@ var AssetPickerContent = ({
   const [appFilter, setAppFilter] = useState(defaultAppFilter);
   const hasAppFilter = !!appId;
   const [otherAppFilter, setOtherAppFilter] = useState("");
+  const [uploadGlobal, setUploadGlobal] = useState(false);
   const collectionIdForRegistry = scope.collectionId;
   const { apps: registryApps, getAppName } = useAppRegistry(collectionIdForRegistry);
   const resolvedAppName = appName || (appId ? getAppName(appId) : void 0);
@@ -1372,7 +1448,7 @@ var AssetPickerContent = ({
     scope,
     accept: acceptProp,
     pageSize,
-    appId,
+    appId: uploadGlobal ? void 0 : appId,
     listAppId
   });
   const [tab, setTab] = useState("browse");
@@ -1442,8 +1518,8 @@ var AssetPickerContent = ({
     }
     setTab("browse");
   }, [upload, multiple, onSelect, toSelection]);
-  const handleUrlImport = useCallback(async (url) => {
-    const result = await uploadFromUrl(url);
+  const handleUrlImport = useCallback(async (url, name) => {
+    const result = await uploadFromUrl(url, name);
     if (result) {
       setTab("browse");
       if (!multiple) {
@@ -1651,39 +1727,79 @@ var AssetPickerContent = ({
       },
       `${activeScope.type}-${activeScope.productId || ""}-${effectiveAccept || "all"}-${listAppId || "no-app-filter"}`
     ),
-    tab === "upload" && /* @__PURE__ */ jsx(
-      UploadZone,
-      {
-        onFiles: handleUploadFiles,
-        accept: acceptProp,
-        multiple,
-        uploading,
-        uploadProgress
-      }
-    ),
-    tab === "url" && /* @__PURE__ */ jsx(
-      UrlImport,
-      {
-        onImport: handleUrlImport,
-        importing: uploading
-      }
-    ),
-    tab === "ai" && aiEnabled && /* @__PURE__ */ jsx(
-      AIImageGenerate,
-      {
-        collectionId,
-        onSave: handleRemoteIngest,
-        saving: uploading
-      }
-    ),
-    tab === "stock" && stockEnabled && /* @__PURE__ */ jsx(
-      StockPhotoSearch,
-      {
-        collectionId,
-        onSave: handleRemoteIngest,
-        saving: uploading
-      }
-    ),
+    tab === "upload" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      hasAppFilter && /* @__PURE__ */ jsx(
+        GlobalUploadToggle,
+        {
+          checked: uploadGlobal,
+          onChange: setUploadGlobal,
+          appName: resolvedAppName || appId
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        UploadZone,
+        {
+          onFiles: handleUploadFiles,
+          accept: acceptProp,
+          multiple,
+          uploading,
+          uploadProgress
+        }
+      )
+    ] }),
+    tab === "url" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      hasAppFilter && /* @__PURE__ */ jsx(
+        GlobalUploadToggle,
+        {
+          checked: uploadGlobal,
+          onChange: setUploadGlobal,
+          appName: resolvedAppName || appId
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        UrlImport,
+        {
+          onImport: handleUrlImport,
+          importing: uploading
+        }
+      )
+    ] }),
+    tab === "ai" && aiEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [
+      hasAppFilter && /* @__PURE__ */ jsx(
+        GlobalUploadToggle,
+        {
+          checked: uploadGlobal,
+          onChange: setUploadGlobal,
+          appName: resolvedAppName || appId
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        AIImageGenerate,
+        {
+          collectionId,
+          onSave: handleRemoteIngest,
+          saving: uploading
+        }
+      )
+    ] }),
+    tab === "stock" && stockEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [
+      hasAppFilter && /* @__PURE__ */ jsx(
+        GlobalUploadToggle,
+        {
+          checked: uploadGlobal,
+          onChange: setUploadGlobal,
+          appName: resolvedAppName || appId
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        StockPhotoSearch,
+        {
+          collectionId,
+          onSave: handleRemoteIngest,
+          saving: uploading
+        }
+      )
+    ] }),
     onConfirm && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between pt-2 border-t border-border", children: [
       /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
         selectedIds.size,
@@ -1776,5 +1892,5 @@ var AssetPicker = (props) => {
 assertStylesLoaded();
 
 export { ASSET_MIME_FILTERS, AssetPicker, useAppRegistry, useAssets };
-//# sourceMappingURL=chunk-2IQEDRSZ.js.map
-//# sourceMappingURL=chunk-2IQEDRSZ.js.map
+//# sourceMappingURL=chunk-ZTUZPAHD.js.map
+//# sourceMappingURL=chunk-ZTUZPAHD.js.map