@btst/stack 2.8.1 → 2.9.0

package/dist/packages/stack/src/plugins/media/client/components/media-picker/index.mjs

@@ -0,0 +1,305 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { Popover, PopoverTrigger, PopoverContent } from '../../../../../../../ui/src/components/popover.mjs';
+import { Button } from '../../../../../../../ui/src/components/button.mjs';
+import { Tabs, TabsList, TabsTrigger, TabsContent } from '../../../../../../../ui/src/components/tabs.mjs';
+import { X, Image, Upload, Link } from 'lucide-react';
+import { FolderTree } from './folder-tree.mjs';
+import { BrowseTab } from './browse-tab.mjs';
+import { UploadTab } from './upload-tab.mjs';
+import { UrlTab } from './url-tab.mjs';
+import { usePluginOverrides } from '@btst/stack/context';
+
+function MediaPicker({
+  trigger,
+  onSelect,
+  multiple = false,
+  accept
+}) {
+  const [open, setOpen] = useState(false);
+  const [selectedFolder, setSelectedFolder] = useState(null);
+  const [selectedAssets, setSelectedAssets] = useState([]);
+  const [activeTab, setActiveTab] = useState(
+    "browse"
+  );
+  const handleClose = () => {
+    setOpen(false);
+    setSelectedAssets([]);
+  };
+  const handleConfirm = () => {
+    if (selectedAssets.length === 0) return;
+    const toSelect = [...selectedAssets];
+    handleClose();
+    setTimeout(() => onSelect(toSelect), 0);
+  };
+  const handleToggleAsset = (asset) => {
+    if (multiple) {
+      setSelectedAssets(
+        (prev) => prev.some((a) => a.id === asset.id) ? prev.filter((a) => a.id !== asset.id) : [...prev, asset]
+      );
+    } else {
+      setSelectedAssets([asset]);
+    }
+  };
+  const handleUploaded = (asset) => {
+    if (multiple) {
+      setSelectedAssets((prev) => [...prev, asset]);
+    } else {
+      setSelectedAssets([asset]);
+      setActiveTab("browse");
+    }
+  };
+  const handleUrlRegistered = (asset) => {
+    const toSelect = asset;
+    handleClose();
+    setTimeout(() => onSelect([toSelect]), 0);
+  };
+  return /* @__PURE__ */ jsxs(
+    Popover,
+    {
+      open,
+      onOpenChange: (v) => {
+        if (!v) handleClose();
+        else setOpen(true);
+      },
+      children: [
+        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: trigger }),
+        /* @__PURE__ */ jsx(
+          PopoverContent,
+          {
+            className: "w-[calc(100vw-1rem)] max-w-[calc(100vw-1rem)] overflow-hidden p-0 sm:w-[820px]",
+            align: "start",
+            sideOffset: 8,
+            collisionPadding: 8,
+            style: {
+              maxWidth: "min(820px, calc(100vw - 1rem))",
+              height: "min(640px, calc(100dvh - 2rem))"
+            },
+            children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden rounded-md", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Media Library" }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: handleClose,
+                    className: "rounded p-0.5 hover:bg-muted",
+                    children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col md:flex-row", children: [
+                /* @__PURE__ */ jsx("div", { className: "max-h-40 w-full shrink-0 overflow-hidden border-b bg-muted/20 md:max-h-none md:w-44 md:border-b-0 md:border-r", children: /* @__PURE__ */ jsx(
+                  FolderTree,
+                  {
+                    selectedId: selectedFolder,
+                    onSelect: setSelectedFolder
+                  }
+                ) }),
+                /* @__PURE__ */ jsx("div", { className: "flex min-w-0 flex-1 flex-col p-3 overflow-y-hidden", children: /* @__PURE__ */ jsxs(
+                  Tabs,
+                  {
+                    value: activeTab,
+                    onValueChange: (v) => setActiveTab(v),
+                    className: "flex flex-1 flex-col min-h-0",
+                    children: [
+                      /* @__PURE__ */ jsxs(TabsList, { className: "grid h-auto w-full shrink-0 grid-cols-3 md:flex md:w-fit", children: [
+                        /* @__PURE__ */ jsxs(
+                          TabsTrigger,
+                          {
+                            value: "browse",
+                            className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                            children: [
+                              /* @__PURE__ */ jsx(Image, { className: "mr-1 size-3" }),
+                              "Browse"
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs(
+                          TabsTrigger,
+                          {
+                            value: "upload",
+                            className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                            children: [
+                              /* @__PURE__ */ jsx(Upload, { className: "mr-1 size-3" }),
+                              "Upload"
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs(
+                          TabsTrigger,
+                          {
+                            value: "url",
+                            className: "h-8 px-2 text-xs md:h-6 md:px-3",
+                            children: [
+                              /* @__PURE__ */ jsx(Link, { className: "mr-1 size-3" }),
+                              "URL"
+                            ]
+                          }
+                        )
+                      ] }),
+                      /* @__PURE__ */ jsxs("div", { className: "mt-2 min-h-0 flex-1", children: [
+                        /* @__PURE__ */ jsx(
+                          TabsContent,
+                          {
+                            value: "browse",
+                            className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
+                            children: /* @__PURE__ */ jsx(
+                              BrowseTab,
+                              {
+                                folderId: selectedFolder,
+                                selected: selectedAssets,
+                                accept,
+                                onToggle: handleToggleAsset
+                              }
+                            )
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          TabsContent,
+                          {
+                            value: "upload",
+                            className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
+                            children: /* @__PURE__ */ jsx(
+                              UploadTab,
+                              {
+                                folderId: selectedFolder,
+                                accept,
+                                onUploaded: handleUploaded
+                              }
+                            )
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          TabsContent,
+                          {
+                            value: "url",
+                            className: "m-0 h-full min-h-0 data-[state=active]:flex data-[state=active]:flex-col",
+                            children: /* @__PURE__ */ jsx(
+                              UrlTab,
+                              {
+                                folderId: selectedFolder,
+                                onRegistered: handleUrlRegistered
+                              }
+                            )
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                ) })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-t px-3 py-2 sm:flex-row sm:items-center sm:justify-between", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: selectedAssets.length > 0 ? `${selectedAssets.length} selected` : "Click a file to select it" }),
+                /* @__PURE__ */ jsxs("div", { className: "flex w-full gap-2 sm:w-auto", children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      type: "button",
+                      variant: "ghost",
+                      size: "sm",
+                      onClick: handleClose,
+                      className: "flex-1 sm:flex-none",
+                      children: "Cancel"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      type: "button",
+                      size: "sm",
+                      "data-testid": "media-select-button",
+                      onClick: handleConfirm,
+                      disabled: selectedAssets.length === 0,
+                      className: "flex-1 sm:flex-none",
+                      children: multiple ? `Select ${selectedAssets.length > 0 ? `(${selectedAssets.length})` : ""}` : "Select"
+                    }
+                  )
+                ] })
+              ] })
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
+function ImageInputField({
+  value,
+  onChange
+}) {
+  const { Image: ImageComponent } = usePluginOverrides("media", {});
+  if (value) {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      ImageComponent ? /* @__PURE__ */ jsx(
+        ImageComponent,
+        {
+          src: value,
+          alt: "Featured image preview",
+          className: "h-auto w-full max-w-xs rounded-md border object-cover",
+          width: 400,
+          height: 300,
+          "data-testid": "image-preview"
+        }
+      ) : /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: value,
+          alt: "Featured image preview",
+          className: "h-auto w-full max-w-xs rounded-md border object-cover",
+          "data-testid": "image-preview"
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(
+          MediaPicker,
+          {
+            trigger: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "sm",
+                type: "button",
+                "data-testid": "open-media-picker",
+                children: "Change Image"
+              }
+            ),
+            accept: ["image/*"],
+            onSelect: (assets) => onChange(assets[0]?.url ?? "")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "destructive",
+            size: "sm",
+            "data-testid": "remove-image-button",
+            onClick: () => onChange(""),
+            children: "Remove"
+          }
+        )
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2 items-center", children: /* @__PURE__ */ jsx(
+    MediaPicker,
+    {
+      trigger: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          type: "button",
+          "data-testid": "open-media-picker",
+          children: "Browse Media"
+        }
+      ),
+      accept: ["image/*"],
+      onSelect: (assets) => onChange(assets[0]?.url ?? "")
+    }
+  ) });
+}
+
+export { ImageInputField, MediaPicker };

package/dist/packages/stack/src/plugins/media/client/components/media-picker/upload-tab.cjs

@@ -0,0 +1,104 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const useMedia = require('../../hooks/use-media.cjs');
+const button = require('../../../../../../../ui/src/components/button.cjs');
+const LucideIcons = require('lucide-react');
+const utils$1 = require('../../../../../../../ui/src/lib/utils.cjs');
+const utils = require('./utils.cjs');
+
+function UploadTab({
+  folderId,
+  accept,
+  onUploaded
+}) {
+  const [dragging, setDragging] = React.useState(false);
+  const [uploading, setUploading] = React.useState(false);
+  const [error, setError] = React.useState(null);
+  const fileInputRef = React.useRef(null);
+  const { mutateAsync: uploadAsset } = useMedia.useUploadAsset();
+  const acceptAttr = accept?.join(",") ?? void 0;
+  const handleFiles = React.useCallback(
+    async (files) => {
+      const fileArr = Array.from(files);
+      if (fileArr.length === 0) return;
+      setError(null);
+      setUploading(true);
+      try {
+        for (const file of fileArr) {
+          if (accept && !utils.matchesAccept(file.type, accept)) {
+            setError(`File type ${file.type} is not accepted.`);
+            continue;
+          }
+          const asset = await uploadAsset({
+            file,
+            folderId: folderId ?? void 0
+          });
+          onUploaded(asset);
+        }
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Upload failed");
+      } finally {
+        setUploading(false);
+      }
+    },
+    [accept, folderId, uploadAsset, onUploaded]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col gap-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        onDragOver: (e) => {
+          e.preventDefault();
+          setDragging(true);
+        },
+        onDragLeave: () => setDragging(false),
+        onDrop: (e) => {
+          e.preventDefault();
+          setDragging(false);
+          void handleFiles(e.dataTransfer.files);
+        },
+        className: utils$1.cn(
+          "flex flex-1 flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed px-4 py-6 text-center transition-colors sm:px-6",
+          dragging ? "border-ring bg-ring/5" : "border-muted-foreground/30"
+        ),
+        children: uploading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Loader2, { className: "size-8 animate-spin text-muted-foreground" }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "Uploading\u2026" })
+        ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Upload, { className: "size-8 text-muted-foreground" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: "Drop files here" }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "or click to browse" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            button.Button,
+            {
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              onClick: () => fileInputRef.current?.click(),
+              children: "Choose files"
+            }
+          )
+        ] })
+      }
+    ),
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive", children: error }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        ref: fileInputRef,
+        type: "file",
+        accept: acceptAttr,
+        multiple: true,
+        className: "hidden",
+        "data-testid": "media-upload-input",
+        onChange: (e) => e.target.files && handleFiles(e.target.files)
+      }
+    )
+  ] });
+}
+
+exports.UploadTab = UploadTab;

package/dist/packages/stack/src/plugins/media/client/components/media-picker/upload-tab.mjs

@@ -0,0 +1,102 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useState, useRef, useCallback } from 'react';
+import { useUploadAsset } from '../../hooks/use-media.mjs';
+import { Button } from '../../../../../../../ui/src/components/button.mjs';
+import { Loader2, Upload } from 'lucide-react';
+import { cn } from '../../../../../../../ui/src/lib/utils.mjs';
+import { matchesAccept } from './utils.mjs';
+
+function UploadTab({
+  folderId,
+  accept,
+  onUploaded
+}) {
+  const [dragging, setDragging] = useState(false);
+  const [uploading, setUploading] = useState(false);
+  const [error, setError] = useState(null);
+  const fileInputRef = useRef(null);
+  const { mutateAsync: uploadAsset } = useUploadAsset();
+  const acceptAttr = accept?.join(",") ?? void 0;
+  const handleFiles = useCallback(
+    async (files) => {
+      const fileArr = Array.from(files);
+      if (fileArr.length === 0) return;
+      setError(null);
+      setUploading(true);
+      try {
+        for (const file of fileArr) {
+          if (accept && !matchesAccept(file.type, accept)) {
+            setError(`File type ${file.type} is not accepted.`);
+            continue;
+          }
+          const asset = await uploadAsset({
+            file,
+            folderId: folderId ?? void 0
+          });
+          onUploaded(asset);
+        }
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Upload failed");
+      } finally {
+        setUploading(false);
+      }
+    },
+    [accept, folderId, uploadAsset, onUploaded]
+  );
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-3", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        onDragOver: (e) => {
+          e.preventDefault();
+          setDragging(true);
+        },
+        onDragLeave: () => setDragging(false),
+        onDrop: (e) => {
+          e.preventDefault();
+          setDragging(false);
+          void handleFiles(e.dataTransfer.files);
+        },
+        className: cn(
+          "flex flex-1 flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed px-4 py-6 text-center transition-colors sm:px-6",
+          dragging ? "border-ring bg-ring/5" : "border-muted-foreground/30"
+        ),
+        children: uploading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Loader2, { className: "size-8 animate-spin text-muted-foreground" }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Uploading\u2026" })
+        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Upload, { className: "size-8 text-muted-foreground" }),
+          /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Drop files here" }),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "or click to browse" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              onClick: () => fileInputRef.current?.click(),
+              children: "Choose files"
+            }
+          )
+        ] })
+      }
+    ),
+    error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: fileInputRef,
+        type: "file",
+        accept: acceptAttr,
+        multiple: true,
+        className: "hidden",
+        "data-testid": "media-upload-input",
+        onChange: (e) => e.target.files && handleFiles(e.target.files)
+      }
+    )
+  ] });
+}
+
+export { UploadTab };

package/dist/packages/stack/src/plugins/media/client/components/media-picker/url-tab.cjs

@@ -0,0 +1,70 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const useMedia = require('../../hooks/use-media.cjs');
+const input = require('../../../../../../../ui/src/components/input.cjs');
+const button = require('../../../../../../../ui/src/components/button.cjs');
+const LucideIcons = require('lucide-react');
+
+function UrlTab({
+  folderId,
+  onRegistered
+}) {
+  const [url, setUrl] = React.useState("");
+  const [error, setError] = React.useState(null);
+  const { mutateAsync: registerAsset, isPending } = useMedia.useRegisterAsset();
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError(null);
+    const trimmed = url.trim();
+    if (!trimmed) return;
+    try {
+      const filename = trimmed.split("/").pop() ?? "asset";
+      const asset = await registerAsset({
+        url: trimmed,
+        filename,
+        folderId: folderId ?? void 0
+      });
+      setUrl("");
+      onRegistered(asset);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to register URL");
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col gap-3 pt-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "Paste a public URL to register it as an asset without uploading a file." }),
+    /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          input.Input,
+          {
+            type: "url",
+            value: url,
+            onChange: (e) => setUrl(e.target.value),
+            placeholder: "https://example.com/image.png",
+            className: "flex-1",
+            "data-testid": "media-url-input",
+            autoFocus: true
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          button.Button,
+          {
+            type: "submit",
+            size: "sm",
+            disabled: isPending || !url.trim(),
+            className: "w-full sm:w-auto",
+            children: [
+              isPending ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Loader2, { className: "mr-1 size-4 animate-spin" }) : /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Check, { className: "mr-1 size-4" }),
+              "Use URL"
+            ]
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive", children: error })
+    ] })
+  ] });
+}
+
+exports.UrlTab = UrlTab;

package/dist/packages/stack/src/plugins/media/client/components/media-picker/url-tab.mjs

@@ -0,0 +1,68 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { useRegisterAsset } from '../../hooks/use-media.mjs';
+import { Input } from '../../../../../../../ui/src/components/input.mjs';
+import { Button } from '../../../../../../../ui/src/components/button.mjs';
+import { Loader2, Check } from 'lucide-react';
+
+function UrlTab({
+  folderId,
+  onRegistered
+}) {
+  const [url, setUrl] = useState("");
+  const [error, setError] = useState(null);
+  const { mutateAsync: registerAsset, isPending } = useRegisterAsset();
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError(null);
+    const trimmed = url.trim();
+    if (!trimmed) return;
+    try {
+      const filename = trimmed.split("/").pop() ?? "asset";
+      const asset = await registerAsset({
+        url: trimmed,
+        filename,
+        folderId: folderId ?? void 0
+      });
+      setUrl("");
+      onRegistered(asset);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to register URL");
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-3 pt-2", children: [
+    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Paste a public URL to register it as an asset without uploading a file." }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "url",
+            value: url,
+            onChange: (e) => setUrl(e.target.value),
+            placeholder: "https://example.com/image.png",
+            className: "flex-1",
+            "data-testid": "media-url-input",
+            autoFocus: true
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "submit",
+            size: "sm",
+            disabled: isPending || !url.trim(),
+            className: "w-full sm:w-auto",
+            children: [
+              isPending ? /* @__PURE__ */ jsx(Loader2, { className: "mr-1 size-4 animate-spin" }) : /* @__PURE__ */ jsx(Check, { className: "mr-1 size-4" }),
+              "Use URL"
+            ]
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error })
+    ] })
+  ] });
+}
+
+export { UrlTab };

package/dist/packages/stack/src/plugins/media/client/components/media-picker/utils.cjs

@@ -0,0 +1,21 @@
+'use strict';
+
+function matchesAccept(mimeType, accept) {
+  if (!accept || accept.length === 0) return true;
+  return accept.some((a) => {
+    if (a.endsWith("/*")) return mimeType.startsWith(a.slice(0, -1));
+    return mimeType === a;
+  });
+}
+function isImage(mimeType) {
+  return mimeType.startsWith("image/");
+}
+function formatBytes(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / 1024 / 1024).toFixed(1)} MB`;
+}
+
+exports.formatBytes = formatBytes;
+exports.isImage = isImage;
+exports.matchesAccept = matchesAccept;