var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/plus/salesSdk/adjustTime/components/AdjustTimeComparePanel.tsx
var AdjustTimeComparePanel_exports = {};
__export(AdjustTimeComparePanel_exports, {
  AdjustTimeComparePanel: () => AdjustTimeComparePanel
});
module.exports = __toCommonJS(AdjustTimeComparePanel_exports);
var import_react = __toESM(require("react"));
var import_dayjs = __toESM(require("dayjs"));
var import_materials = require("@pisell/materials");
var import_i18n = require("../i18n");
var import_time = require("../utils/time");
var CurrentTimeText = import_react.default.memo(
  ({ active = true }) => {
    const [now, setNow] = (0, import_react.useState)(() => /* @__PURE__ */ new Date());
    (0, import_react.useEffect)(() => {
      if (!active) return void 0;
      setNow(/* @__PURE__ */ new Date());
      const timerId = window.setInterval(() => setNow(/* @__PURE__ */ new Date()), 1e3);
      return () => window.clearInterval(timerId);
    }, [active]);
    return /* @__PURE__ */ import_react.default.createElement("strong", null, (0, import_time.formatClockTime)(now));
  }
);
var resolveCurrentMinute = () => {
  return (0, import_dayjs.default)((0, import_time.resolveBillableMinuteDate)(/* @__PURE__ */ new Date()));
};
var useCurrentMinute = (active = true) => {
  const [currentMinute, setCurrentMinute] = (0, import_react.useState)(
    () => resolveCurrentMinute()
  );
  (0, import_react.useEffect)(() => {
    if (!active) return void 0;
    let timeoutId;
    let intervalId;
    const tick = () => {
      setCurrentMinute((prev) => {
        const next = resolveCurrentMinute();
        return next.isSame(prev) ? prev : next;
      });
    };
    timeoutId = window.setTimeout(() => {
      tick();
      intervalId = window.setInterval(tick, 60 * 1e3);
    }, (0, import_time.getDelayToNextBillableMinuteChange)());
    return () => {
      if (timeoutId != null) window.clearTimeout(timeoutId);
      if (intervalId != null) window.clearInterval(intervalId);
    };
  }, [active]);
  return currentMinute;
};
var formatTicketCountLabel = (ticketCount) => {
  const count = Math.max(1, Number(ticketCount) || 1);
  const label = (0, import_i18n.t)("pisell2.adjust-time.ticket-count").replace("{count}", String(count));
  return count === 1 ? label.replace(/\btickets\b/i, "ticket") : label;
};
var AdjustTimeComparePanel = ({
  title,
  subtitle,
  icon,
  startAt,
  endAt,
  startTimeHighlighted,
  endTimeHighlighted,
  ticketCount = 1,
  selectableTicketCount,
  onTicketCountClick,
  addedDuration,
  minimumExtensionDuration,
  totalDuration,
  overtimeDuration,
  shouldShowEffectiveUntilHint,
  effectiveUntilTime,
  resourceAvailabilityWarning,
  active
}) => {
  const currentMinute = useCurrentMinute(active);
  const displayStartAt = (0, import_react.useMemo)(() => (0, import_dayjs.default)(startAt), [startAt]);
  const displayEndAt = (0, import_react.useMemo)(() => (0, import_dayjs.default)(endAt), [endAt]);
  const status = (0, import_react.useMemo)(
    () => displayEndAt.startOf("minute").isAfter(currentMinute) ? (0, import_i18n.t)("pisell2.adjust-time.active") : (0, import_i18n.t)("pisell2.adjust-time.ended"),
    [currentMinute, displayEndAt]
  );
  const durationDetail = (0, import_react.useMemo)(
    () => [
      overtimeDuration ? `${(0, import_i18n.t)("pisell2.adjust-time.actual-overtime")} ${overtimeDuration}` : null,
      minimumExtensionDuration ? `${(0, import_i18n.t)(
        "pisell2.adjust-time.minimum-extension-period"
      )} ${minimumExtensionDuration}` : null
    ].filter(Boolean).join(", "),
    [minimumExtensionDuration, overtimeDuration]
  );
  const effectiveUntilHint = shouldShowEffectiveUntilHint && effectiveUntilTime ? (0, import_i18n.t)("pisell2.adjust-time.effective-until-closing").replace("{time}", effectiveUntilTime) : void 0;
  const canSelectMultipleTickets = Math.max(1, Number(selectableTicketCount || ticketCount) || 1) > 1;
  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__section-head" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__head-icon" }, icon), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__kicker" }, title), /* @__PURE__ */ import_react.default.createElement("p", { className: "pisell-adjust-time__subtitle" }, subtitle))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      style: {
        alignItems: "center",
        display: "flex",
        justifyContent: "space-between",
        gap: 12
      }
    },
    /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-adjust-time__kicker" }, (0, import_i18n.t)("pisell2.adjust-time.new-compare")),
    /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-adjust-time__compare-top" }, (0, import_i18n.t)("pisell2.adjust-time.current-time"), " ", /* @__PURE__ */ import_react.default.createElement(CurrentTimeText, { active }))
  ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__compare-card" }, /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" } }, /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-adjust-time__compare-label" }, (0, import_i18n.t)("pisell2.adjust-time.new"))), canSelectMultipleTickets ? /* @__PURE__ */ import_react.default.createElement(
    "button",
    {
      type: "button",
      className: "pisell-adjust-time__compare-ticket-count",
      onClick: onTicketCountClick,
      disabled: !onTicketCountClick
    },
    /* @__PURE__ */ import_react.default.createElement(
      import_materials.Iconfont,
      {
        type: "pisell2-edit-05",
        className: "pisell-adjust-time__compare-ticket-icon"
      }
    ),
    formatTicketCountLabel(ticketCount)
  ) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__duration-line" }, /* @__PURE__ */ import_react.default.createElement(
    import_materials.PisellTimeRangeDisplay,
    {
      className: "pisell-adjust-time__new-range",
      startAt: displayStartAt,
      endAt: displayEndAt,
      showDateForSameDay: false,
      fields: {
        showTimeRange: true,
        showDate: false,
        showWeekday: false,
        showDuration: false
      },
      dateFormat: {
        order: "DMY",
        numericMonth: true,
        separator: "/",
        showYear: true
      },
      textAlign: "left",
      timeStyle: {
        fontSize: 26,
        fontWeight: 950,
        color: "var(--ink)",
        lineHeight: 1.1
      },
      startTimeStyle: startTimeHighlighted ? { color: "var(--violet-2)" } : void 0,
      endTimeStyle: endTimeHighlighted ? { color: "var(--violet-2)" } : void 0
    }
  ), addedDuration ? /* @__PURE__ */ import_react.default.createElement("small", { style: { color: "var(--violet-2)" } }, `${(0, import_i18n.t)(
    "pisell2.adjust-time.added-prefix"
  )} ${addedDuration}`) : null, /* @__PURE__ */ import_react.default.createElement("small", null, totalDuration)), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__duration-footer" }, durationDetail ? /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-adjust-time__duration-detail" }, durationDetail) : /* @__PURE__ */ import_react.default.createElement("span", null)), effectiveUntilHint ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__effective-until" }, effectiveUntilHint) : null, resourceAvailabilityWarning ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-adjust-time__effective-until" }, resourceAvailabilityWarning) : null)));
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  AdjustTimeComparePanel
});
