@nextsparkjs/core 0.1.0-beta.91 → 0.1.0-beta.94

package/dist/components/media/MediaTagFilter.js

@@ -0,0 +1,122 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo, useState, useMemo, useCallback } from "react";
+import { useTranslations } from "next-intl";
+import { TagIcon, XIcon } from "lucide-react";
+import { Badge } from "../ui/badge.js";
+import { Button } from "../ui/button.js";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger
+} from "../ui/popover.js";
+import { cn } from "../../lib/utils/index.js";
+import { sel } from "../../lib/selectors/index.js";
+import { useMediaTags } from "../../hooks/useMedia.js";
+const MediaTagFilter = memo(function MediaTagFilter2({
+  selectedTagIds,
+  onTagsChange,
+  className
+}) {
+  const t = useTranslations("media");
+  const { data: tags = [], isLoading } = useMediaTags();
+  const [isOpen, setIsOpen] = useState(false);
+  const selectedIdSet = useMemo(() => new Set(selectedTagIds), [selectedTagIds]);
+  const selectedTags = useMemo(
+    () => tags.filter((tag) => selectedIdSet.has(tag.id)),
+    [tags, selectedIdSet]
+  );
+  const toggleTag = useCallback((tagId) => {
+    if (selectedIdSet.has(tagId)) {
+      onTagsChange(selectedTagIds.filter((id) => id !== tagId));
+    } else {
+      onTagsChange([...selectedTagIds, tagId]);
+    }
+  }, [selectedIdSet, selectedTagIds, onTagsChange]);
+  const clearTags = useCallback(() => {
+    onTagsChange([]);
+  }, [onTagsChange]);
+  if (isLoading) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-cy": sel("media.tagFilter.container"),
+      className: cn("flex items-center gap-2 flex-wrap", className),
+      children: [
+        /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: setIsOpen, children: [
+          /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+            Button,
+            {
+              "data-cy": sel("media.tagFilter.trigger"),
+              variant: "outline",
+              size: "sm",
+              className: "h-8 gap-1",
+              children: [
+                /* @__PURE__ */ jsx(TagIcon, { className: "h-3.5 w-3.5" }),
+                t("dashboard.tags"),
+                selectedTagIds.length > 0 && /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "ml-1 h-5 px-1 text-xs", children: selectedTagIds.length })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ jsx(
+            PopoverContent,
+            {
+              "data-cy": sel("media.tagFilter.popover"),
+              className: "w-64 p-3",
+              align: "start",
+              children: /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: t("dashboard.filterByTag") }),
+                /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5", children: tags.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("dashboard.noTags") }) : tags.map((tag) => {
+                  const isSelected = selectedIdSet.has(tag.id);
+                  return /* @__PURE__ */ jsx(
+                    Badge,
+                    {
+                      "data-cy": sel("media.tagFilter.tag", { id: tag.id }),
+                      variant: isSelected ? "default" : "outline",
+                      className: cn(
+                        "cursor-pointer transition-colors",
+                        isSelected && tag.color && "border-transparent"
+                      ),
+                      style: isSelected && tag.color ? { backgroundColor: tag.color, color: "#fff" } : void 0,
+                      onClick: () => toggleTag(tag.id),
+                      children: tag.name
+                    },
+                    tag.id
+                  );
+                }) }),
+                selectedTagIds.length > 0 && /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    className: "w-full h-7 text-xs",
+                    onClick: clearTags,
+                    children: t("dashboard.clearSelection")
+                  }
+                )
+              ] })
+            }
+          )
+        ] }),
+        selectedTags.map((tag) => /* @__PURE__ */ jsxs(
+          Badge,
+          {
+            "data-cy": sel("media.tagFilter.activeTag", { id: tag.id }),
+            variant: "secondary",
+            className: "gap-1 cursor-pointer hover:bg-destructive/20",
+            style: tag.color ? { borderColor: tag.color } : void 0,
+            onClick: () => toggleTag(tag.id),
+            children: [
+              tag.name,
+              /* @__PURE__ */ jsx(XIcon, { className: "h-3 w-3" })
+            ]
+          },
+          tag.id
+        ))
+      ]
+    }
+  );
+});
+export {
+  MediaTagFilter
+};

package/dist/components/media/MediaToolbar.d.ts

@@ -0,0 +1,25 @@
+/**
+ * MediaToolbar Component
+ *
+ * Toolbar with upload button, search input, filters, sort, and view toggle.
+ *
+ * Performance: Wrapped with memo. Sort options memoized.
+ */
+import type { MediaListOptions } from '../../lib/media/types';
+type ViewMode = 'grid' | 'list';
+interface MediaToolbarProps {
+    onUploadClick?: () => void;
+    searchQuery: string;
+    onSearchChange: (query: string) => void;
+    typeFilter: 'all' | 'image' | 'video';
+    onTypeFilterChange: (type: 'all' | 'image' | 'video') => void;
+    sortBy: MediaListOptions['orderBy'];
+    sortDir: MediaListOptions['orderDir'];
+    onSortChange: (orderBy: MediaListOptions['orderBy'], orderDir: MediaListOptions['orderDir']) => void;
+    viewMode: ViewMode;
+    onViewModeChange: (mode: ViewMode) => void;
+    className?: string;
+}
+export declare const MediaToolbar: import("react").NamedExoticComponent<MediaToolbarProps>;
+export {};
+//# sourceMappingURL=MediaToolbar.d.ts.map

package/dist/components/media/MediaToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/media/MediaToolbar.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAkBH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAE7D,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAA;AAE/B,UAAU,iBAAiB;IACzB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,WAAW,EAAE,MAAM,CAAA;IACnB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,UAAU,EAAE,KAAK,GAAG,OAAO,GAAG,OAAO,CAAA;IACrC,kBAAkB,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,OAAO,GAAG,OAAO,KAAK,IAAI,CAAA;IAC7D,MAAM,EAAE,gBAAgB,CAAC,SAAS,CAAC,CAAA;IACnC,OAAO,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAA;IACrC,YAAY,EAAE,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,gBAAgB,CAAC,UAAU,CAAC,KAAK,IAAI,CAAA;IACpG,QAAQ,EAAE,QAAQ,CAAA;IAClB,gBAAgB,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAA;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,YAAY,yDAwHvB,CAAA"}

package/dist/components/media/MediaToolbar.js

@@ -0,0 +1,136 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo, useMemo, useCallback } from "react";
+import { useTranslations } from "next-intl";
+import { UploadIcon, SearchIcon, GridIcon, ListIcon } from "lucide-react";
+import { Button } from "../ui/button.js";
+import { Input } from "../ui/input.js";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "../ui/select.js";
+import { cn } from "../../lib/utils/index.js";
+import { sel } from "../../lib/selectors/index.js";
+const MediaToolbar = memo(function MediaToolbar2({
+  onUploadClick,
+  searchQuery,
+  onSearchChange,
+  typeFilter,
+  onTypeFilterChange,
+  sortBy = "createdAt",
+  sortDir = "desc",
+  onSortChange,
+  viewMode,
+  onViewModeChange,
+  className
+}) {
+  const t = useTranslations("media");
+  const sortOptions = useMemo(() => [
+    { value: "createdAt:desc", label: t("toolbar.sort.newest"), orderBy: "createdAt", orderDir: "desc" },
+    { value: "createdAt:asc", label: t("toolbar.sort.oldest"), orderBy: "createdAt", orderDir: "asc" },
+    { value: "filename:asc", label: t("toolbar.sort.nameAsc"), orderBy: "filename", orderDir: "asc" },
+    { value: "filename:desc", label: t("toolbar.sort.nameDesc"), orderBy: "filename", orderDir: "desc" },
+    { value: "fileSize:desc", label: t("toolbar.sort.sizeDesc"), orderBy: "fileSize", orderDir: "desc" },
+    { value: "fileSize:asc", label: t("toolbar.sort.sizeAsc"), orderBy: "fileSize", orderDir: "asc" }
+  ], [t]);
+  const currentSortValue = `${sortBy}:${sortDir}`;
+  const handleSortChange = useCallback((value) => {
+    const option = sortOptions.find((opt) => opt.value === value);
+    if (option) {
+      onSortChange(option.orderBy, option.orderDir);
+    }
+  }, [sortOptions, onSortChange]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-cy": sel("media.toolbar.container"),
+      className: cn("flex flex-col sm:flex-row gap-2 sm:items-center", className),
+      children: [
+        onUploadClick && /* @__PURE__ */ jsxs(
+          Button,
+          {
+            "data-cy": sel("media.toolbar.uploadBtn"),
+            onClick: onUploadClick,
+            className: "shrink-0",
+            children: [
+              /* @__PURE__ */ jsx(UploadIcon, { className: "mr-2 h-4 w-4" }),
+              t("toolbar.upload")
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "relative flex-1 min-w-[200px]", children: [
+          /* @__PURE__ */ jsx(SearchIcon, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none" }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              "data-cy": sel("media.toolbar.searchInput"),
+              type: "text",
+              placeholder: t("toolbar.search"),
+              value: searchQuery,
+              onChange: (e) => onSearchChange(e.target.value),
+              className: "pl-9"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(Select, { value: typeFilter, onValueChange: (value) => onTypeFilterChange(value), children: [
+          /* @__PURE__ */ jsx(
+            SelectTrigger,
+            {
+              "data-cy": sel("media.toolbar.typeFilter"),
+              className: "w-full sm:w-[150px]",
+              children: /* @__PURE__ */ jsx(SelectValue, {})
+            }
+          ),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: "all", children: t("toolbar.typeFilter.all") }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "image", children: t("toolbar.typeFilter.images") }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "video", children: t("toolbar.typeFilter.videos") })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Select, { value: currentSortValue, onValueChange: handleSortChange, children: [
+          /* @__PURE__ */ jsx(
+            SelectTrigger,
+            {
+              "data-cy": sel("media.toolbar.sortSelect"),
+              className: "w-full sm:w-[180px]",
+              children: /* @__PURE__ */ jsx(SelectValue, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(SelectContent, { children: sortOptions.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: option.label }, option.value)) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-1 shrink-0", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              "data-cy": sel("media.toolbar.viewToggle.grid"),
+              variant: viewMode === "grid" ? "default" : "outline",
+              size: "icon",
+              onClick: () => onViewModeChange("grid"),
+              "aria-label": t("toolbar.viewGrid"),
+              title: t("toolbar.viewGrid"),
+              children: /* @__PURE__ */ jsx(GridIcon, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              "data-cy": sel("media.toolbar.viewToggle.list"),
+              variant: viewMode === "list" ? "default" : "outline",
+              size: "icon",
+              onClick: () => onViewModeChange("list"),
+              "aria-label": t("toolbar.viewList"),
+              title: t("toolbar.viewList"),
+              children: /* @__PURE__ */ jsx(ListIcon, { className: "h-4 w-4" })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+});
+export {
+  MediaToolbar
+};

package/dist/components/media/MediaUploadZone.d.ts

@@ -0,0 +1,19 @@
+/**
+ * MediaUploadZone Component
+ *
+ * Drag-and-drop file upload area with progress indicators.
+ * Uses useMediaUpload hook for upload mutations.
+ *
+ * Performance: Uses ref-based drag counter to avoid excessive setState
+ * on dragEnter/dragLeave events from nested elements.
+ */
+import type { Media } from '../../lib/media/types';
+interface MediaUploadZoneProps {
+    onUploadComplete?: (uploadedMedia: Media[]) => void;
+    maxSizeMB?: number;
+    acceptedTypes?: string[];
+    className?: string;
+}
+export declare function MediaUploadZone({ onUploadComplete, maxSizeMB, acceptedTypes, className, }: MediaUploadZoneProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MediaUploadZone.d.ts.map

package/dist/components/media/MediaUploadZone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaUploadZone.d.ts","sourceRoot":"","sources":["../../../src/components/media/MediaUploadZone.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAcH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAQlD,UAAU,oBAAoB;IAC5B,gBAAgB,CAAC,EAAE,CAAC,aAAa,EAAE,KAAK,EAAE,KAAK,IAAI,CAAA;IACnD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,eAAe,CAAC,EAC9B,gBAAgB,EAChB,SAAc,EACd,aAAsC,EACtC,SAAS,GACV,EAAE,oBAAoB,2CAgQtB"}

package/dist/components/media/MediaUploadZone.js

@@ -0,0 +1,248 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useCallback } from "react";
+import { useTranslations } from "next-intl";
+import { UploadCloudIcon, LoaderIcon, XCircleIcon, AlertTriangleIcon } from "lucide-react";
+import { Button } from "../ui/button.js";
+import { Progress } from "../ui/progress.js";
+import { Alert, AlertDescription } from "../ui/alert.js";
+import { cn } from "../../lib/utils/index.js";
+import { sel } from "../../lib/selectors/index.js";
+import { useMediaUpload } from "../../hooks/useMediaUpload.js";
+import { useToast } from "../../hooks/useToast.js";
+function MediaUploadZone({
+  onUploadComplete,
+  maxSizeMB = 10,
+  acceptedTypes = ["image/*", "video/*"],
+  className
+}) {
+  const t = useTranslations("media");
+  const { toast } = useToast();
+  const [isDragging, setIsDragging] = useState(false);
+  const [isChecking, setIsChecking] = useState(false);
+  const [pendingFiles, setPendingFiles] = useState(null);
+  const [duplicates, setDuplicates] = useState([]);
+  const fileInputRef = useRef(null);
+  const dragCounterRef = useRef(0);
+  const uploadMutation = useMediaUpload();
+  const checkForDuplicates = async (files) => {
+    var _a;
+    try {
+      const res = await fetch("/api/v1/media/check-duplicates", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          files: files.map((f) => ({ filename: f.name, fileSize: f.size }))
+        })
+      });
+      if (!res.ok) return [];
+      const json = await res.json();
+      return ((_a = json.data) == null ? void 0 : _a.duplicates) || [];
+    } catch {
+      return [];
+    }
+  };
+  const doUpload = async (files) => {
+    try {
+      const result = await uploadMutation.mutateAsync(files);
+      toast({
+        title: t("upload.success"),
+        description: files.length === 1 ? t("upload.success") : t("upload.successMultiple", { count: files.length })
+      });
+      onUploadComplete == null ? void 0 : onUploadComplete(result.media || []);
+    } catch (error) {
+      toast({
+        title: t("upload.error"),
+        description: error instanceof Error ? error.message : t("upload.error"),
+        variant: "destructive"
+      });
+    }
+  };
+  const handleFiles = async (files) => {
+    if (!files || files.length === 0) return;
+    const fileArray = Array.from(files);
+    const maxSizeBytes = maxSizeMB * 1024 * 1024;
+    const oversizedFiles = fileArray.filter((f) => f.size > maxSizeBytes);
+    if (oversizedFiles.length > 0) {
+      toast({
+        title: t("upload.error"),
+        description: t("upload.tooLarge"),
+        variant: "destructive"
+      });
+      return;
+    }
+    setIsChecking(true);
+    const dupes = await checkForDuplicates(fileArray);
+    setIsChecking(false);
+    if (dupes.length > 0) {
+      setDuplicates(dupes);
+      setPendingFiles(fileArray);
+      return;
+    }
+    await doUpload(fileArray);
+  };
+  const handleUploadAll = async () => {
+    if (!pendingFiles) return;
+    setDuplicates([]);
+    const files = pendingFiles;
+    setPendingFiles(null);
+    await doUpload(files);
+  };
+  const handleSkipDuplicates = async () => {
+    if (!pendingFiles) return;
+    const dupeNames = new Set(duplicates.map((d) => `${d.filename}:${d.fileSize}`));
+    const nonDuplicates = pendingFiles.filter((f) => !dupeNames.has(`${f.name}:${f.size}`));
+    setDuplicates([]);
+    setPendingFiles(null);
+    if (nonDuplicates.length > 0) {
+      await doUpload(nonDuplicates);
+    } else {
+      toast({ title: t("upload.error"), description: t("upload.duplicateFound", { count: duplicates.length }) });
+    }
+  };
+  const handleDismissDuplicates = () => {
+    setDuplicates([]);
+    setPendingFiles(null);
+  };
+  const handleDragEnter = useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    dragCounterRef.current++;
+    if (dragCounterRef.current === 1) {
+      setIsDragging(true);
+    }
+  }, []);
+  const handleDragOver = useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+  }, []);
+  const handleDragLeave = useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    dragCounterRef.current--;
+    if (dragCounterRef.current === 0) {
+      setIsDragging(false);
+    }
+  }, []);
+  const handleDrop = async (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    dragCounterRef.current = 0;
+    setIsDragging(false);
+    await handleFiles(e.dataTransfer.files);
+  };
+  const handleFileInputChange = (e) => {
+    handleFiles(e.target.files);
+  };
+  const handleBrowseClick = () => {
+    var _a;
+    (_a = fileInputRef.current) == null ? void 0 : _a.click();
+  };
+  const isBusy = uploadMutation.isPending || isChecking;
+  return /* @__PURE__ */ jsxs("div", { className: cn("w-full space-y-3", className), children: [
+    duplicates.length > 0 && /* @__PURE__ */ jsxs(Alert, { variant: "destructive", className: "border-amber-500/50 bg-amber-50 text-amber-900 dark:bg-amber-950/30 dark:text-amber-200 [&>svg]:text-amber-600", children: [
+      /* @__PURE__ */ jsx(AlertTriangleIcon, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsxs(AlertDescription, { className: "flex items-center justify-between gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: "font-medium", children: t("upload.duplicateFound", { count: duplicates.length }) }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs mt-0.5 opacity-80", children: duplicates.map((d) => d.filename).join(", ") })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              variant: "outline",
+              className: "border-amber-500/50 hover:bg-amber-100 dark:hover:bg-amber-900/30",
+              onClick: handleSkipDuplicates,
+              children: t("upload.duplicateSkip")
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              onClick: handleUploadAll,
+              children: t("upload.duplicateUploadAll")
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              variant: "ghost",
+              onClick: handleDismissDuplicates,
+              children: /* @__PURE__ */ jsx(XCircleIcon, { className: "h-4 w-4" })
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-cy": sel("media.upload.dropzone"),
+        className: cn(
+          "border-2 border-dashed rounded-lg p-8 text-center transition-all duration-200",
+          isDragging ? "border-primary bg-primary/5 scale-[1.01]" : "border-muted-foreground/25 hover:border-muted-foreground/50",
+          isBusy && "opacity-50 pointer-events-none"
+        ),
+        onDragEnter: handleDragEnter,
+        onDragOver: handleDragOver,
+        onDragLeave: handleDragLeave,
+        onDrop: handleDrop,
+        children: [
+          uploadMutation.isPending || isChecking ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-4", children: [
+            /* @__PURE__ */ jsx(LoaderIcon, { className: "h-12 w-12 animate-spin text-primary" }),
+            /* @__PURE__ */ jsxs("div", { className: "w-full max-w-xs", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mb-2", children: t("upload.uploading") }),
+              /* @__PURE__ */ jsx(
+                Progress,
+                {
+                  "data-cy": sel("media.upload.progressBar"),
+                  value: void 0,
+                  className: "w-full"
+                }
+              )
+            ] })
+          ] }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-4", children: [
+            /* @__PURE__ */ jsx(UploadCloudIcon, { className: "h-12 w-12 text-muted-foreground" }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
+                t("upload.dragDrop"),
+                " ",
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "link",
+                    className: "p-0 h-auto text-primary",
+                    onClick: handleBrowseClick,
+                    children: t("upload.browse")
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: t("upload.maxSize", { maxSize: maxSizeMB }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              "data-cy": sel("media.upload.fileInput"),
+              ref: fileInputRef,
+              type: "file",
+              multiple: true,
+              accept: acceptedTypes.join(","),
+              onChange: handleFileInputChange,
+              className: "hidden",
+              "aria-label": t("toolbar.upload")
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+export {
+  MediaUploadZone
+};

package/dist/components/media/index.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Media Components - Barrel Export
+ *
+ * All media library components for easy importing.
+ */
+export { MediaCard } from './MediaCard';
+export { MediaDetailPanel } from './MediaDetailPanel';
+export { MediaGrid } from './MediaGrid';
+export { MediaLibrary } from './MediaLibrary';
+export { MediaList } from './MediaList';
+export { MediaSelector } from './MediaSelector';
+export { MediaTagFilter } from './MediaTagFilter';
+export { MediaToolbar } from './MediaToolbar';
+export { MediaUploadZone } from './MediaUploadZone';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/media/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/media/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA"}

package/dist/components/media/index.js

@@ -0,0 +1,20 @@
+import { MediaCard } from "./MediaCard.js";
+import { MediaDetailPanel } from "./MediaDetailPanel.js";
+import { MediaGrid } from "./MediaGrid.js";
+import { MediaLibrary } from "./MediaLibrary.js";
+import { MediaList } from "./MediaList.js";
+import { MediaSelector } from "./MediaSelector.js";
+import { MediaTagFilter } from "./MediaTagFilter.js";
+import { MediaToolbar } from "./MediaToolbar.js";
+import { MediaUploadZone } from "./MediaUploadZone.js";
+export {
+  MediaCard,
+  MediaDetailPanel,
+  MediaGrid,
+  MediaLibrary,
+  MediaList,
+  MediaSelector,
+  MediaTagFilter,
+  MediaToolbar,
+  MediaUploadZone
+};

package/dist/contexts/TeamContext.js

@@ -72,7 +72,7 @@ function TeamProvider({ children }) {
     const activeTeam = storedTeam || userTeams[0];
     if (activeTeam) {
       setCurrentTeam(activeTeam.team);
-      if (typeof window !== "undefined" && storedTeamId !== activeTeam.team.id) {
+      if (typeof window !== "undefined") {
         localStorage.setItem("activeTeamId", activeTeam.team.id);
       }
       if (typeof window !== "undefined") {

package/dist/hooks/index.d.ts

@@ -18,6 +18,8 @@ export * from './useInvoice';
 export * from './useInvoices';
 export * from './useLastAuthMethod';
 export * from './useLocale';
+export * from './useMedia';
+export * from './useMediaUpload';
 export * from './useMembership';
 export * from './useNotifications';
 export * from './useOrigin';

package/dist/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAGA,cAAc,4BAA4B,CAAA;AAC1C,cAAc,WAAW,CAAA;AACzB,cAAc,yBAAyB,CAAA;AACvC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA;AACpC,cAAc,yBAAyB,CAAA;AACvC,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,mBAAmB,CAAA;AACjC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,cAAc,0BAA0B,CAAA;AACxC,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,WAAW,CAAA;AACzB,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,YAAY,CAAA;AAC1B,cAAc,kBAAkB,CAAA;AAChC,cAAc,YAAY,CAAA;AAC1B,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,kBAAkB,CAAA;AAChC,cAAc,mBAAmB,CAAA;AACjC,cAAc,wBAAwB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAGA,cAAc,4BAA4B,CAAA;AAC1C,cAAc,WAAW,CAAA;AACzB,cAAc,yBAAyB,CAAA;AACvC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA;AACpC,cAAc,yBAAyB,CAAA;AACvC,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,mBAAmB,CAAA;AACjC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,aAAa,CAAA;AAC3B,cAAc,YAAY,CAAA;AAC1B,cAAc,kBAAkB,CAAA;AAChC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,cAAc,0BAA0B,CAAA;AACxC,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,WAAW,CAAA;AACzB,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,YAAY,CAAA;AAC1B,cAAc,kBAAkB,CAAA;AAChC,cAAc,YAAY,CAAA;AAC1B,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,kBAAkB,CAAA;AAChC,cAAc,mBAAmB,CAAA;AACjC,cAAc,wBAAwB,CAAA"}

package/dist/hooks/index.js

@@ -18,6 +18,8 @@ export * from "./useInvoice.js";
 export * from "./useInvoices.js";
 export * from "./useLastAuthMethod.js";
 export * from "./useLocale.js";
+export * from "./useMedia.js";
+export * from "./useMediaUpload.js";
 export * from "./useMembership.js";
 export * from "./useNotifications.js";
 export * from "./useOrigin.js";

package/dist/hooks/useEnsureUserMetadata.d.ts

@@ -1,2 +1,6 @@
+/**
+ * Hook to ensure user has default metadata
+ * Uses TanStack Query for proper caching and deduplication
+ */
 export declare function useEnsureUserMetadata(): void;
 //# sourceMappingURL=useEnsureUserMetadata.d.ts.map

package/dist/hooks/useEnsureUserMetadata.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useEnsureUserMetadata.d.ts","sourceRoot":"","sources":["../../src/hooks/useEnsureUserMetadata.ts"],"names":[],"mappings":"AAMA,wBAAgB,qBAAqB,SAuEpC"}
+{"version":3,"file":"useEnsureUserMetadata.d.ts","sourceRoot":"","sources":["../../src/hooks/useEnsureUserMetadata.ts"],"names":[],"mappings":"AAsDA;;;GAGG;AACH,wBAAgB,qBAAqB,SA+DpC"}