/**
 * 周日期选项卡
 * 横向展示一周 7 天，每天显示周几、日期数字、起步价和可用状态
 * 数据来自 context 中的 dateSummary（PisellOS venueBooking.getDateRangeSummary）
 * 支持左右滑动手势切换前后周
 */
import React, { useMemo, useRef } from 'react';
import { Iconfont } from '@pisell/materials';
import { locales } from '@pisell/utils';
import { useVenueBookingContext } from "../../../context";
import { getSelectedDateKeySet, useVenueBookingSymbol } from "../../../hooks";
import { formatDateKey, getDateMetaFromSummary, getWeekDays, getWeekdayShortLabel } from "../../../utils";
export default function DayTabs(_ref) {
  var onPrevWeek = _ref.onPrevWeek,
    onNextWeek = _ref.onNextWeek;
  var symbol = useVenueBookingSymbol();
  var _useVenueBookingConte = useVenueBookingContext(),
    anchorDate = _useVenueBookingConte.anchorDate,
    setAnchorDate = _useVenueBookingConte.setAnchorDate,
    setMonthCursor = _useVenueBookingConte.setMonthCursor,
    viewModel = _useVenueBookingConte.viewModel,
    venueBookingModule = _useVenueBookingConte.venueBookingModule,
    isWeekLoading = _useVenueBookingConte.isWeekLoading;
  var days = getWeekDays(anchorDate);
  var currentKey = formatDateKey(anchorDate);
  var selectedDateKeySet = useMemo(function () {
    return getSelectedDateKeySet(venueBookingModule);
  }, [venueBookingModule, viewModel.cartItems]);
  var showFewLeftRow = days.some(function (date) {
    var meta = getDateMetaFromSummary(date, viewModel.dateSummary, symbol);
    return !meta.soldOut && meta.fewLeft;
  });
  var shouldHideTopTag = typeof window !== 'undefined' && window.innerWidth < 920;

  // Hooks 必须在条件分支之前执行，保持顺序稳定（Rules of Hooks）
  var swipeRef = useRef({
    startX: 0,
    startY: 0,
    active: false,
    moved: false
  });

  // 周视图加载中：渲染 7 个骨架卡片（保持与正常态相同的布局尺寸）
  if (isWeekLoading) {
    return /*#__PURE__*/React.createElement("div", {
      className: "grid grid-cols-7 gap-1 select-none",
      "aria-busy": "true",
      "aria-live": "polite"
    }, Array.from({
      length: 7
    }).map(function (_, idx) {
      return /*#__PURE__*/React.createElement("div", {
        key: "day-skeleton-".concat(idx),
        className: "relative min-h-[56px] overflow-hidden rounded-[12px] bg-zinc-100 px-2 py-2 ring-1 ring-black/5 md:min-h-[60px] md:rounded-[16px] md:px-3 md:py-2"
      }, /*#__PURE__*/React.createElement("div", {
        className: "h-2 w-8 rounded bg-zinc-200/90 md:h-2.5 md:w-10"
      }), /*#__PURE__*/React.createElement("div", {
        className: "mt-2 flex items-end justify-between gap-1"
      }, /*#__PURE__*/React.createElement("div", {
        className: "h-3 w-5 rounded bg-zinc-200/90 md:h-4 md:w-6"
      }), /*#__PURE__*/React.createElement("div", {
        className: "h-2 w-8 rounded bg-zinc-200/90 md:h-2.5 md:w-10"
      })), /*#__PURE__*/React.createElement("span", {
        className: "vb-skeleton-shimmer",
        "aria-hidden": "true"
      }));
    }));
  }
  function handlePointerDown(e) {
    if (e.pointerType === 'mouse' && e.button !== 0) return;
    swipeRef.current = {
      startX: e.clientX,
      startY: e.clientY,
      active: true,
      moved: false
    };
  }
  function handlePointerMove(e) {
    if (!swipeRef.current.active) return;
    var dx = e.clientX - swipeRef.current.startX;
    var dy = e.clientY - swipeRef.current.startY;
    if (Math.abs(dx) > 8 || Math.abs(dy) > 8) swipeRef.current.moved = true;
  }
  function handlePointerUp(e) {
    if (!swipeRef.current.active) return;
    var dx = e.clientX - swipeRef.current.startX;
    var dy = e.clientY - swipeRef.current.startY;
    swipeRef.current.active = false;
    if (Math.abs(dx) < 48 || Math.abs(dx) <= Math.abs(dy)) return;
    if (dx < 0) onNextWeek();else onPrevWeek();
  }
  function handleDateClick(date) {
    if (swipeRef.current.moved) {
      swipeRef.current.moved = false;
      return;
    }
    setAnchorDate(date);
    setMonthCursor(date.startOf('month'));
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "grid grid-cols-7 gap-1 touch-pan-y select-none",
    onPointerDown: handlePointerDown,
    onPointerMove: handlePointerMove,
    onPointerUp: handlePointerUp,
    onPointerCancel: function onPointerCancel() {
      swipeRef.current.active = false;
      swipeRef.current.moved = false;
    }
  }, days.map(function (date) {
    var _meta$startingPrice;
    var key = formatDateKey(date);
    var active = key === currentKey;
    var meta = getDateMetaFromSummary(date, viewModel.dateSummary, symbol);
    var showSelectedBadge = selectedDateKeySet.has(key) && !active;
    var cardClass = meta.soldOut ? 'bg-zinc-50 text-zinc-400 ring-1 ring-zinc-200' : active ? 'text-white shadow-sm' : 'bg-white text-zinc-800 ring-1 ring-black/8 hover:bg-zinc-50';
    var cardStyle = !meta.soldOut && active ? {
      backgroundColor: 'var(--vb-primary)'
    } : undefined;
    var tagClass = active ? 'bg-white/15 text-white ring-white/20' : meta.topTag === 'Promo' ? 'bg-emerald-50 text-emerald-700 ring-emerald-200' : 'bg-zinc-100 text-zinc-600 ring-zinc-200';
    return /*#__PURE__*/React.createElement("button", {
      key: key,
      type: "button",
      onClick: function onClick() {
        return handleDateClick(date);
      },
      className: "relative min-w-0 cursor-pointer rounded-[12px] px-2 py-2 text-left transition md:rounded-[16px] md:px-3 md:py-2 ".concat(showFewLeftRow ? 'min-h-[66px] pb-5 md:min-h-[72px] md:pb-6' : 'min-h-[56px] md:min-h-[60px]', " ").concat(cardClass),
      style: cardStyle
    }, meta.topTag && !shouldHideTopTag ? /*#__PURE__*/React.createElement("div", {
      className: "pointer-events-none absolute right-1 top-1 inline-flex rounded-full px-1.5 py-0.5 text-[8px] font-semibold ring-1 md:right-2 md:top-2 md:text-[10px] ".concat(tagClass)
    }, meta.topTag) : null, /*#__PURE__*/React.createElement("div", {
      className: "pointer-events-none inline-flex max-w-full items-center gap-1 truncate text-[8px] leading-none md:text-xs ".concat(meta.soldOut ? 'text-zinc-400' : active ? 'text-white/85' : 'text-zinc-500')
    }, /*#__PURE__*/React.createElement("span", {
      className: "truncate"
    }, getWeekdayShortLabel(date)), showSelectedBadge ? /*#__PURE__*/React.createElement(Iconfont, {
      type: "pisell2-check-circle",
      style: {
        fontSize: 13,
        color: 'var(--vb-primary, #ea1018)'
      }
    }) : null), /*#__PURE__*/React.createElement("div", {
      className: "pointer-events-none mt-1 flex w-full flex-wrap items-end justify-between gap-x-1"
    }, /*#__PURE__*/React.createElement("div", {
      className: "text-[13px] font-bold leading-none md:text-base ".concat(meta.soldOut ? 'line-through' : '')
    }, date.date()), /*#__PURE__*/React.createElement("div", {
      className: "text-[8px] font-semibold leading-tight md:text-[10px] lg:text-xs ".concat(active ? 'text-white/70' : 'text-zinc-400')
    }, meta.soldOut ? locales.getText('pisell2.venue.label.sold.out') || '已满' : (_meta$startingPrice = meta.startingPrice) !== null && _meta$startingPrice !== void 0 ? _meta$startingPrice : '')), showFewLeftRow ? /*#__PURE__*/React.createElement("div", {
      className: "pointer-events-none absolute bottom-2 left-2 text-[10px] font-bold leading-none md:bottom-2 md:left-3 md:text-[11px] ".concat(meta.fewLeft && !meta.soldOut ? active ? 'text-white' : '' : 'opacity-0'),
      style: meta.fewLeft && !meta.soldOut && !active ? {
        color: 'var(--vb-primary)'
      } : undefined
    }, locales.getText('pisell2.venue.label.few.left') || '即将满') : null);
  }));
}