import { jsxs, Fragment, jsx } from "react/jsx-runtime";
import { B as ButtonGradientPrimary } from "./button-gradient-primary-DnxbZRJu.js";
import { R as RatingStars } from "./rating-stars-BSwu6ht6.js";
import { B as Button } from "./button-CdJZJLGw.js";
import { C as Card } from "./card-B-gBwpxd.js";
import { D as Dialog, a as DialogTrigger, b as DialogContent } from "./dialog-DGP_3dPQ.js";
import { V as VideoPlayer } from "./video-player-DbcUPn7s.js";
import { g as getPageSection, S as Section, a as getPropertyArray } from "./section-DPFpz4mP.js";
import { c as cn } from "./utils-DLCPGU0v.js";
import { usePage, Link } from "@inertiajs/react";
import { Play } from "lucide-react";
import "react";
import "@radix-ui/react-slot";
import "class-variance-authority";
import "@radix-ui/react-dialog";
import "plyr-react";
/* empty css                */
import "./use-lang-44ndmTOc.js";
import "./chunked-uploader-input-CZfv7yqS.js";
import "./input-BsvJqbcd.js";
import "axios";
import "sonner";
import "./input-error-D1JIzedA.js";
import "./loading-button-CCIxhJrY.js";
import "./label-0rIIfpX0.js";
import "@radix-ui/react-label";
import "./textarea-Z0d4V-ti.js";
import "./inertia-BtwbgBI3.js";
import "./icon-picker-dialog-Bc1iwzL6.js";
import "./icon-picker-C-E-UbjO.js";
import "./debounce-ZFxqVthq.js";
import "./tooltip-BYKuzaoQ.js";
import "@radix-ui/react-tooltip";
import "lucide-react/dynamic";
import "./scroll-area-CDdrLubh.js";
import "@radix-ui/react-scroll-area";
import "./table-header-CdEXSV6s.js";
import "./table-BMWNGY4o.js";
import "@tanstack/react-table";
import "./table-page-size-CF314lUl.js";
import "./dropdown-menu-msun3TP8.js";
import "@radix-ui/react-dropdown-menu";
import "./route-DlE7FdTW.js";
import "./avatar-C8iCpF5R.js";
import "@radix-ui/react-avatar";
import "clsx";
import "tailwind-merge";
const Hero = () => {
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
  const { props } = usePage();
  const { page } = props;
  const heroSection = getPageSection(page, "hero");
  return /* @__PURE__ */ jsxs(Fragment, { children: [
    /* @__PURE__ */ jsxs("div", { className: "relative mx-auto max-w-[1440px]", children: [
      /* @__PURE__ */ jsxs(Section, { customize: props.customize, pageSection: heroSection, containerClass: "pt-20", contentClass: "relative", children: [
        /* @__PURE__ */ jsx("div", { className: cn("relative z-10 grid grid-cols-1 items-center gap-x-20"), children: /* @__PURE__ */ jsxs("div", { className: "mx-auto mb-16 max-w-[712px] text-center", children: [
          /* @__PURE__ */ jsx("h1", { className: "mb-4 text-4xl font-bold md:text-5xl md:leading-14 md:font-extrabold", children: heroSection == null ? void 0 : heroSection.title }),
          /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mb-6 text-lg md:px-8", children: heroSection == null ? void 0 : heroSection.description }),
          /* @__PURE__ */ jsxs("div", { className: "mb-10 flex flex-row justify-center gap-6", children: [
            ((_a = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _a.button_text_1) && /* @__PURE__ */ jsx(ButtonGradientPrimary, { size: "lg", asChild: true, shadow: false, children: /* @__PURE__ */ jsx(Link, { href: ((_b = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _b.button_link_1) || "", children: (_c = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _c.button_text_1 }) }),
            ((_d = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _d.button_text_2) && /* @__PURE__ */ jsx(Button, { size: "lg", asChild: true, variant: "outline", className: "px-4", children: /* @__PURE__ */ jsx(Link, { href: ((_e = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _e.button_link_2) || "", children: (_f = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _f.button_text_2 }) })
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            ((_g = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _g.ratings) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2", children: [
              /* @__PURE__ */ jsx(RatingStars, { rating: 5, starClass: "w-4 h-4" }),
              /* @__PURE__ */ jsx("p", { className: "font-medium", children: (_h = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _h.ratings })
            ] }),
            ((_i = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _i.subscribers) && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: (_j = heroSection == null ? void 0 : heroSection.properties) == null ? void 0 : _j.subscribers })
          ] })
        ] }) }),
        /* @__PURE__ */ jsxs("div", { className: "shadow-card-hover relative z-10 mx-auto max-w-[780px] overflow-hidden rounded-3xl md:rounded-4xl", children: [
          /* @__PURE__ */ jsx("img", { src: (heroSection == null ? void 0 : heroSection.thumbnail) || "/assets/blank-image.png", alt: heroSection == null ? void 0 : heroSection.title, className: "mx-auto w-full" }),
          (heroSection == null ? void 0 : heroSection.video_url) && /* @__PURE__ */ jsxs(Dialog, { children: [
            /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsx("button", { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 cursor-pointer rounded-full bg-black/70 p-4 transition-transform hover:scale-110", children: /* @__PURE__ */ jsx(Play, { className: "h-6 w-6 text-white" }) }) }),
            /* @__PURE__ */ jsx(DialogContent, { className: "overflow-hidden p-0 md:min-w-3xl", children: /* @__PURE__ */ jsx(
              VideoPlayer,
              {
                source: {
                  type: "video",
                  sources: [
                    {
                      src: heroSection == null ? void 0 : heroSection.video_url,
                      type: "video/mp4"
                    }
                  ]
                }
              }
            ) })
          ] })
        ] }),
        /* @__PURE__ */ jsx("div", { className: "hidden lg:block", children: getPropertyArray(heroSection).map((item, index) => /* @__PURE__ */ jsx(
          Card,
          {
            className: cn(
              "overflow-hidden rounded-xl",
              index === 0 && "absolute top-[180px] left-20 z-10",
              index === 1 && "absolute top-[200px] right-20 z-10",
              index === 2 && "absolute bottom-0 left-20 z-10",
              index === 3 && "absolute right-20 bottom-20 z-10"
            ),
            children: /* @__PURE__ */ jsx("img", { src: item.image, alt: "", className: cn("h-[180px]") })
          },
          `item-${index}`
        )) }),
        /* @__PURE__ */ jsx("div", { className: "after:pointer-events-none after:absolute after:top-0 after:left-0 after:h-[334px] after:w-[334px] after:rounded-full after:bg-[rgba(89,85,220,1)] after:blur-[320px] after:content-['']" }),
        /* @__PURE__ */ jsx("div", { className: "after:pointer-events-none after:absolute after:top-[220px] after:right-0 after:h-[300px] after:w-[300px] after:rounded-full after:bg-[rgba(255,190,0,1)] after:blur-[310px] after:content-['']" })
      ] }),
      /* @__PURE__ */ jsx("img", { src: heroSection == null ? void 0 : heroSection.background_image, alt: "", className: "absolute bottom-0 w-full object-cover" })
    ] }),
    /* @__PURE__ */ jsx("div", { className: "container grid grid-cols-2 gap-6 py-10 sm:grid-cols-4 lg:hidden", children: getPropertyArray(heroSection).map((item, index) => /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx("img", { src: item.image, alt: "", className: "shadow-card h-[160px] overflow-hidden rounded-xl sm:h-[180px]" }) }, `item-${index}`)) })
  ] });
};
export {
  Hero as default
};