🎉 创世提交

src/components/ScreenshotCarousel/index.tsx

@@ -0,0 +1,40 @@
+import { Component } from 'solid-js';
+import { Skeleton } from "@/components/ui/skeleton";
+import BaseCarousel from "@/components/ui/base-carousel";
+
+interface ScreenshotCarouselProps {
+  screenshots?: {
+    url: string;
+    title: string;
+  }[];
+  loading?: boolean;
+}
+
+const ScreenshotCarousel: Component<ScreenshotCarouselProps> = (props) => {
+  const renderItem = (screenshot: NonNullable<ScreenshotCarouselProps['screenshots']>[0]) => (
+    <div class="w-full h-full aspect-[16/9]">
+      <img 
+        src={screenshot.url} 
+        alt={screenshot.title} 
+        class="w-full h-full object-cover rounded-lg" 
+      />
+    </div>
+  );
+
+  const renderSkeleton = () => (
+    <div class="w-full h-full aspect-[16/9]">
+      <Skeleton class="w-full h-full rounded-lg" />
+    </div>
+  );
+
+  return (
+    <BaseCarousel
+      items={props.screenshots}
+      loading={props.loading}
+      renderItem={renderItem}
+      renderSkeleton={renderSkeleton}
+    />
+  );
+};
+
+export default ScreenshotCarousel;