Hero Exemple 2

1"use client";
2
3import { useState } from "react";
4import { AnimatePresence, motion, Variants } from "framer-motion";
5import Image from "next/image";
6import {
7  ChevronDown,
8  ChevronLeft,
9  ChevronRight,
10  Clock,
11  Video,
12  Globe,
13  Rocket,
14} from "lucide-react";
15
16type NavItem = { title: string; description: string };
17type NavLink = { label: string; dropdown: boolean; items?: NavItem[] };
18
19const NAV_LINKS: NavLink[] = [
20  {
21    label: "Solutions",
22    dropdown: true,
23    items: [
24      { title: "For Startups", description: "Ship scheduling fast" },
25      { title: "For Enterprise", description: "Scale your meeting infra" },
26      { title: "For Agencies", description: "Client booking, streamlined" },
27    ],
28  },
29  { label: "Enterprise", dropdown: false },
30  {
31    label: "Developers",
32    dropdown: true,
33    items: [
34      { title: "API Reference", description: "Build on the platform" },
35      { title: "Webhooks", description: "React to booking events" },
36      { title: "SDKs", description: "Official client libraries" },
37    ],
38  },
39  {
40    label: "Resources",
41    dropdown: true,
42    items: [
43      { title: "Blog", description: "Product updates & guides" },
44      { title: "Help Center", description: "Get support fast" },
45      { title: "Changelog", description: "See what shipped" },
46    ],
47  },
48  { label: "Pricing", dropdown: false },
49];
50
51const WEEKDAYS = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
52const MONTH_NAMES = [
53  "January",
54  "February",
55  "March",
56  "April",
57  "May",
58  "June",
59  "July",
60  "August",
61  "September",
62  "October",
63  "November",
64  "December",
65];
66const WEEKDAY_NAMES = [
67  "Sunday",
68  "Monday",
69  "Tuesday",
70  "Wednesday",
71  "Thursday",
72  "Friday",
73  "Saturday",
74];
75// Reference "today" — also the default selected date
76const TODAY = { year: 2026, month: 3, day: 5 }; // April 5, 2026
77
78function daysInMonth(year: number, month: number) {
79  return new Date(year, month + 1, 0).getDate();
80}
81function firstWeekday(year: number, month: number) {
82  return new Date(year, month, 1).getDay();
83}
84function isPastDate(year: number, month: number, day: number) {
85  return (
86    new Date(year, month, day) < new Date(TODAY.year, TODAY.month, TODAY.day)
87  );
88}
89function isAvailable(year: number, month: number, day: number) {
90  const weekday = new Date(year, month, day).getDay();
91  const isWeekend = weekday === 0 || weekday === 6;
92// … truncated