アセットグリッドAssetGridExperimental

import { AssetGrid, type AssetCardAsset } from "@gunjo/ui";

const assets: AssetCardAsset[] = [
  {
    id: "hero",
    title: "Campaign_Hero.jpg",
    src: "/patterns-thumbs/media-library.light.png",
    width: 1920,
    height: 1080,
    type: "JPG",
    size: "1.4MB",
    createdAt: "2026-05-12",
    isFavorite: true,
    rating: 4.5,
  },
  {
    id: "story",
    title: "Instagram_Story.png",
    src: "/patterns-thumbs/dashboard.light.png",
    width: 1080,
    height: 1920,
    type: "PNG",
    size: "2.1MB",
    createdAt: "2026-05-10",
    rating: 3.5,
  },
  {
    id: "square",
    title: "Product_Square.png",
    src: "/showcase-thumbs/blog.light.png",
    width: 1200,
    height: 1200,
    type: "PNG",
    size: "980KB",
    createdAt: "2026-05-09",
  },
];

export function MediaAssetGrid() {
  return (
    <AssetGrid
      items={assets}
      selectedIds={["hero"]}
      layout="content"
      onSelect={({ id }) => console.log(id)}
    />
  );
}