Iphone Carousel

import {HighlightsSection} from "@/components/ui/iphone-carousel"
import type {VideoSlide} from "@/components/ui/iphone-carousel"

export const defaultSlides: VideoSlide[] = [
  {
    id: 1,
    textLists: ["Enter A17 Pro.", "Game-changing chip.", "Groundbreaking performance."],
    video: "https://res.cloudinary.com/ds3yn5l5e/video/upload/v1769010712/highlight-first_dukqys.mp4",
    videoDuration: 4,
  },
  {
    id: 2,
    textLists: ["Titanium.", "So strong. So light. So Pro."],
    video: "https://res.cloudinary.com/ds3yn5l5e/video/upload/v1769010712/hightlight-third_xquibo.mp4",
    videoDuration: 5,
  },
  {
    id: 3,
    textLists: ["iPhone 15 Pro Max has the", "longest optical zoom in", "iPhone ever. Far out."],
    video: "https://res.cloudinary.com/ds3yn5l5e/video/upload/v1769010700/hightlight-sec_qtf7tq.mp4",
    videoDuration: 2,
  },
  {
    id: 4,
    textLists: ["All-new Action button.", "What will yours do?"],
    video: "https://res.cloudinary.com/ds3yn5l5e/video/upload/v1769010704/hightlight-fourth_iooitu.mp4",
    videoDuration: 3.6,
  },
];

export default function DemoOne() {
  return (
    <HighlightsSection
      slides={defaultSlides}
      videoOffsets={{ 2: "translate-x-44" }}
    />
  );
}