@inf-monkeys-tech/monkeys-design 2.0.15 → 2.0.17

package/dist/components/primitives/index.d.mts

@@ -526,6 +526,19 @@ interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement> {
     animation?: SkeletonAnimation;
 }
 declare const Skeleton: React$1.ForwardRefExoticComponent<SkeletonProps & React$1.RefAttributes<HTMLDivElement>>;
+interface ImageCardProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    status: "error" | "loading" | "ready";
+    aspectRatio?: string;
+    loadingLabel?: string;
+    errorContent?: React__default.ReactNode;
+}
+/** Presentation only: fetching, retrying and URL authorization belong to the consumer. */
+declare function ImageCard({ status, aspectRatio, loadingLabel, errorContent, children, style, ...props }: ImageCardProps): react_jsx_runtime.JSX.Element;
+interface ImageGalleryProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    minCardWidth?: number;
+    gap?: number;
+}
+declare function ImageGallery({ minCardWidth, gap, style, ...props }: ImageGalleryProps): react_jsx_runtime.JSX.Element;
 interface SkeletonAvatarProps extends React__default.HTMLAttributes<HTMLDivElement> {
     animation?: SkeletonAnimation;
     /**
@@ -859,4 +872,4 @@ declare const Tree: React__default.ForwardRefExoticComponent<React__default.HTML
     labelRenderer?: (item: any, onExpand: () => void) => React__default.ReactNode;
     leafRenderer?: (item: any) => React__default.ReactNode;
 } & React__default.RefAttributes<HTMLDivElement>>;
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDangerAction, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, type AutosizeTextAreaRef, AutosizeTextarea, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, type BadgeShape, type BadgeVariant, BentoPanel, type BentoPanelProps, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, Calendar, type CalendarProps, Card, CardAction, type CardAppearance, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, type ControlAppearance, Dialog, DialogClose, DialogContent, DialogContentNoAnimation, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FloatingPopover, FloatingPopoverContent, type FloatingPopoverContentProps, type FloatingPopoverProps, FloatingPopoverTrigger, type FloatingPopoverTriggerProps, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, Indicator, InfiniteScroll, type InfiniteScrollProps, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, MEDIA_PREVIEW_ASPECT_RATIOS, type MediaPreviewAspectRatio, type MediaPreviewFit, MediaPreviewFrame, type MediaPreviewFrameProps, MediaPreviewImage, type MediaPreviewImageProps, type MediaPreviewRatio, type PillFieldType, PillInput, type PillInputMessages, type PillInputProps, type PillValue, PolymorphicSlot, Popover, PopoverAnchor, PopoverClose, PopoverContent, type PopoverContentProps, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, RoundedBadge, ScrollArea, type ScrollAreaProps, ScrollBar, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, type SheetSide, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, Skeleton, SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, SkeletonButton, type SkeletonButtonProps, SkeletonCard, type SkeletonCardProps, SkeletonForm, SkeletonFormField, type SkeletonFormFieldProps, type SkeletonFormProps, SkeletonGroupAnimation, SkeletonImage, type SkeletonImageProps, SkeletonList, type SkeletonListProps, type SkeletonProps, SkeletonTable, type SkeletonTableProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, StatusState, type StatusStateProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableProps, TableRow, Tabs, TabsContent, TabsList, type TabsProps, TabsTrigger, type TabsVariant, Textarea, type TextareaProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleProps, type ToggleSize, type ToggleVariant, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tree, type TreeDataItem, type TreeProps, alertVariants, badgeVariants, buttonGroupVariants, buttonVariants, convertPillValue, formatSliderNumber, isValidPillValue, mediaPreviewFrameClassName, normalizeSliderNumber, resolveMediaPreviewAspectRatioValue, toggleClassName, toggleVariants, useAutosizeTextArea, useCarousel };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDangerAction, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, type AutosizeTextAreaRef, AutosizeTextarea, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, type BadgeShape, type BadgeVariant, BentoPanel, type BentoPanelProps, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, Calendar, type CalendarProps, Card, CardAction, type CardAppearance, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, type ControlAppearance, Dialog, DialogClose, DialogContent, DialogContentNoAnimation, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FloatingPopover, FloatingPopoverContent, type FloatingPopoverContentProps, type FloatingPopoverProps, FloatingPopoverTrigger, type FloatingPopoverTriggerProps, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, ImageCard, type ImageCardProps, ImageGallery, type ImageGalleryProps, Indicator, InfiniteScroll, type InfiniteScrollProps, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, MEDIA_PREVIEW_ASPECT_RATIOS, type MediaPreviewAspectRatio, type MediaPreviewFit, MediaPreviewFrame, type MediaPreviewFrameProps, MediaPreviewImage, type MediaPreviewImageProps, type MediaPreviewRatio, type PillFieldType, PillInput, type PillInputMessages, type PillInputProps, type PillValue, PolymorphicSlot, Popover, PopoverAnchor, PopoverClose, PopoverContent, type PopoverContentProps, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, RoundedBadge, ScrollArea, type ScrollAreaProps, ScrollBar, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, type SheetSide, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, Skeleton, SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, SkeletonButton, type SkeletonButtonProps, SkeletonCard, type SkeletonCardProps, SkeletonForm, SkeletonFormField, type SkeletonFormFieldProps, type SkeletonFormProps, SkeletonGroupAnimation, SkeletonImage, type SkeletonImageProps, SkeletonList, type SkeletonListProps, type SkeletonProps, SkeletonTable, type SkeletonTableProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, StatusState, type StatusStateProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableProps, TableRow, Tabs, TabsContent, TabsList, type TabsProps, TabsTrigger, type TabsVariant, Textarea, type TextareaProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleProps, type ToggleSize, type ToggleVariant, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tree, type TreeDataItem, type TreeProps, alertVariants, badgeVariants, buttonGroupVariants, buttonVariants, convertPillValue, formatSliderNumber, isValidPillValue, mediaPreviewFrameClassName, normalizeSliderNumber, resolveMediaPreviewAspectRatioValue, toggleClassName, toggleVariants, useAutosizeTextArea, useCarousel };

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

@@ -526,6 +526,19 @@ interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement> {
     animation?: SkeletonAnimation;
 }
 declare const Skeleton: React$1.ForwardRefExoticComponent<SkeletonProps & React$1.RefAttributes<HTMLDivElement>>;
+interface ImageCardProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    status: "error" | "loading" | "ready";
+    aspectRatio?: string;
+    loadingLabel?: string;
+    errorContent?: React__default.ReactNode;
+}
+/** Presentation only: fetching, retrying and URL authorization belong to the consumer. */
+declare function ImageCard({ status, aspectRatio, loadingLabel, errorContent, children, style, ...props }: ImageCardProps): react_jsx_runtime.JSX.Element;
+interface ImageGalleryProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    minCardWidth?: number;
+    gap?: number;
+}
+declare function ImageGallery({ minCardWidth, gap, style, ...props }: ImageGalleryProps): react_jsx_runtime.JSX.Element;
 interface SkeletonAvatarProps extends React__default.HTMLAttributes<HTMLDivElement> {
     animation?: SkeletonAnimation;
     /**
@@ -859,4 +872,4 @@ declare const Tree: React__default.ForwardRefExoticComponent<React__default.HTML
     labelRenderer?: (item: any, onExpand: () => void) => React__default.ReactNode;
     leafRenderer?: (item: any) => React__default.ReactNode;
 } & React__default.RefAttributes<HTMLDivElement>>;
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDangerAction, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, type AutosizeTextAreaRef, AutosizeTextarea, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, type BadgeShape, type BadgeVariant, BentoPanel, type BentoPanelProps, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, Calendar, type CalendarProps, Card, CardAction, type CardAppearance, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, type ControlAppearance, Dialog, DialogClose, DialogContent, DialogContentNoAnimation, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FloatingPopover, FloatingPopoverContent, type FloatingPopoverContentProps, type FloatingPopoverProps, FloatingPopoverTrigger, type FloatingPopoverTriggerProps, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, Indicator, InfiniteScroll, type InfiniteScrollProps, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, MEDIA_PREVIEW_ASPECT_RATIOS, type MediaPreviewAspectRatio, type MediaPreviewFit, MediaPreviewFrame, type MediaPreviewFrameProps, MediaPreviewImage, type MediaPreviewImageProps, type MediaPreviewRatio, type PillFieldType, PillInput, type PillInputMessages, type PillInputProps, type PillValue, PolymorphicSlot, Popover, PopoverAnchor, PopoverClose, PopoverContent, type PopoverContentProps, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, RoundedBadge, ScrollArea, type ScrollAreaProps, ScrollBar, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, type SheetSide, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, Skeleton, SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, SkeletonButton, type SkeletonButtonProps, SkeletonCard, type SkeletonCardProps, SkeletonForm, SkeletonFormField, type SkeletonFormFieldProps, type SkeletonFormProps, SkeletonGroupAnimation, SkeletonImage, type SkeletonImageProps, SkeletonList, type SkeletonListProps, type SkeletonProps, SkeletonTable, type SkeletonTableProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, StatusState, type StatusStateProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableProps, TableRow, Tabs, TabsContent, TabsList, type TabsProps, TabsTrigger, type TabsVariant, Textarea, type TextareaProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleProps, type ToggleSize, type ToggleVariant, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tree, type TreeDataItem, type TreeProps, alertVariants, badgeVariants, buttonGroupVariants, buttonVariants, convertPillValue, formatSliderNumber, isValidPillValue, mediaPreviewFrameClassName, normalizeSliderNumber, resolveMediaPreviewAspectRatioValue, toggleClassName, toggleVariants, useAutosizeTextArea, useCarousel };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDangerAction, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, type AutosizeTextAreaRef, AutosizeTextarea, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, type BadgeShape, type BadgeVariant, BentoPanel, type BentoPanelProps, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, Calendar, type CalendarProps, Card, CardAction, type CardAppearance, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, type ControlAppearance, Dialog, DialogClose, DialogContent, DialogContentNoAnimation, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FloatingPopover, FloatingPopoverContent, type FloatingPopoverContentProps, type FloatingPopoverProps, FloatingPopoverTrigger, type FloatingPopoverTriggerProps, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, ImageCard, type ImageCardProps, ImageGallery, type ImageGalleryProps, Indicator, InfiniteScroll, type InfiniteScrollProps, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, MEDIA_PREVIEW_ASPECT_RATIOS, type MediaPreviewAspectRatio, type MediaPreviewFit, MediaPreviewFrame, type MediaPreviewFrameProps, MediaPreviewImage, type MediaPreviewImageProps, type MediaPreviewRatio, type PillFieldType, PillInput, type PillInputMessages, type PillInputProps, type PillValue, PolymorphicSlot, Popover, PopoverAnchor, PopoverClose, PopoverContent, type PopoverContentProps, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, RoundedBadge, ScrollArea, type ScrollAreaProps, ScrollBar, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, type SheetSide, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarMenu, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, Skeleton, SkeletonAnimation, SkeletonAvatar, type SkeletonAvatarProps, SkeletonButton, type SkeletonButtonProps, SkeletonCard, type SkeletonCardProps, SkeletonForm, SkeletonFormField, type SkeletonFormFieldProps, type SkeletonFormProps, SkeletonGroupAnimation, SkeletonImage, type SkeletonImageProps, SkeletonList, type SkeletonListProps, type SkeletonProps, SkeletonTable, type SkeletonTableProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, StatusState, type StatusStateProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, type TableProps, TableRow, Tabs, TabsContent, TabsList, type TabsProps, TabsTrigger, type TabsVariant, Textarea, type TextareaProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleProps, type ToggleSize, type ToggleVariant, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tree, type TreeDataItem, type TreeProps, alertVariants, badgeVariants, buttonGroupVariants, buttonVariants, convertPillValue, formatSliderNumber, isValidPillValue, mediaPreviewFrameClassName, normalizeSliderNumber, resolveMediaPreviewAspectRatioValue, toggleClassName, toggleVariants, useAutosizeTextArea, useCarousel };

package/dist/components/primitives/index.js

@@ -4198,6 +4198,87 @@ var SkeletonGroup = React15.forwardRef(function SkeletonGroup2({ animation, anim
     }
   );
 });
+var roundedMap = {
+  none: "rounded-none",
+  sm: "rounded-sm",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  full: "rounded-full"
+};
+function SkeletonImage({
+  className,
+  width,
+  height,
+  aspectRatio = "16/9",
+  rounded = "md",
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Skeleton,
+    {
+      className: cn(roundedMap[rounded], className),
+      style: {
+        width,
+        height,
+        aspectRatio: !height ? aspectRatio : void 0,
+        ...style
+      },
+      ...props
+    }
+  );
+}
+function ImageCard({
+  status,
+  aspectRatio = "1",
+  loadingLabel = "Loading image",
+  errorContent = "Image unavailable",
+  children,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      "aria-busy": status === "loading",
+      style: {
+        position: "relative",
+        overflow: "hidden",
+        width: "100%",
+        aspectRatio,
+        ...style
+      },
+      children: status === "loading" ? /* @__PURE__ */ jsxRuntime.jsx(SkeletonImage, { width: "100%", height: "100%", "aria-label": loadingLabel }) : status === "error" ? /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          role: "status",
+          style: { display: "grid", placeItems: "center", height: "100%" },
+          children: errorContent
+        }
+      ) : children
+    }
+  );
+}
+function ImageGallery({
+  minCardWidth = 180,
+  gap = 12,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      style: {
+        display: "grid",
+        gridTemplateColumns: `repeat(auto-fit,minmax(min(100%,${minCardWidth}px),1fr))`,
+        gap,
+        ...style
+      }
+    }
+  );
+}
 var sizeMap = {
   xs: "size-6",
   sm: "size-8",
@@ -4348,36 +4429,6 @@ function SkeletonForm({
     showSubmitButton && /* @__PURE__ */ jsxRuntime.jsx(SkeletonItem, { index: fields, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("pt-2", layout === "horizontal" && `pl-[${labelWidth + 16}px]`), children: /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-9 w-24 rounded-md" }) }) })
   ] }) });
 }
-var roundedMap = {
-  none: "rounded-none",
-  sm: "rounded-sm",
-  md: "rounded-md",
-  lg: "rounded-lg",
-  full: "rounded-full"
-};
-function SkeletonImage({
-  className,
-  width,
-  height,
-  aspectRatio = "16/9",
-  rounded = "md",
-  style,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Skeleton,
-    {
-      className: cn(roundedMap[rounded], className),
-      style: {
-        width,
-        height,
-        aspectRatio: !height ? aspectRatio : void 0,
-        ...style
-      },
-      ...props
-    }
-  );
-}
 var spacingMap = {
   sm: "py-2",
   md: "py-3",
@@ -4754,6 +4805,8 @@ exports.HoverCard = HoverCard;
 exports.HoverCardContent = HoverCardContent;
 exports.HoverCardPortal = HoverCardPortal;
 exports.HoverCardTrigger = HoverCardTrigger;
+exports.ImageCard = ImageCard;
+exports.ImageGallery = ImageGallery;
 exports.Indicator = Indicator2;
 exports.InfiniteScroll = InfiniteScroll;
 exports.Input = Input;