"use client";
import { useMemo, useState, useEffect } from 'react';
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { jsx, jsxs } from 'react/jsx-runtime';

// components/blocks/banner/banner-countdown-sale.tsx
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
function BannerCountdownSale({
  endTime,
  message = "Flash Sale Ends In",
  description = "Up to 50% off on selected items",
  className
}) {
  const defaultEndTime = useMemo(
    () => new Date(Date.now() + 24 * 60 * 60 * 1e3),
    []
  );
  const targetTime = endTime ?? defaultEndTime;
  const [timeLeft, setTimeLeft] = useState({
    hours: 0,
    minutes: 0,
    seconds: 0
  });
  useEffect(() => {
    const calculateTimeLeft = () => {
      const now = (/* @__PURE__ */ new Date()).getTime();
      const target = targetTime.getTime();
      const diff = target - now;
      if (diff <= 0) {
        return { hours: 0, minutes: 0, seconds: 0 };
      }
      return {
        hours: Math.floor(diff / (1e3 * 60 * 60)),
        minutes: Math.floor(diff % (1e3 * 60 * 60) / (1e3 * 60)),
        seconds: Math.floor(diff % (1e3 * 60) / 1e3)
      };
    };
    setTimeLeft(calculateTimeLeft());
    const timer = setInterval(() => {
      setTimeLeft(calculateTimeLeft());
    }, 1e3);
    return () => clearInterval(timer);
  }, [targetTime]);
  const pad = (n) => n.toString().padStart(2, "0");
  return /* @__PURE__ */ jsx("div", { className: cn("w-full bg-red-600 text-white", className), children: /* @__PURE__ */ jsx("div", { className: "container py-2.5", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-center gap-x-4 gap-y-1 text-sm", children: [
    /* @__PURE__ */ jsx("span", { className: "font-medium", children: message }),
    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 font-mono text-lg font-bold", children: [
      /* @__PURE__ */ jsx("span", { className: "rounded bg-red-700 px-2 py-0.5", children: pad(timeLeft.hours) }),
      /* @__PURE__ */ jsx("span", { children: ":" }),
      /* @__PURE__ */ jsx("span", { className: "rounded bg-red-700 px-2 py-0.5", children: pad(timeLeft.minutes) }),
      /* @__PURE__ */ jsx("span", { children: ":" }),
      /* @__PURE__ */ jsx("span", { className: "rounded bg-red-700 px-2 py-0.5", children: pad(timeLeft.seconds) })
    ] }),
    /* @__PURE__ */ jsx("span", { className: "text-red-100", children: description })
  ] }) }) });
}

export { BannerCountdownSale };
//# sourceMappingURL=banner-countdown-sale.js.map
//# sourceMappingURL=banner-countdown-sale.js.map