"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { cn } from "@open-mercato/shared/lib/utils";
import { renderDictionaryColor, renderDictionaryIcon } from "@open-mercato/core/modules/dictionaries/components/dictionaryAppearance";
import { formatDateTime } from "@open-mercato/shared/lib/time";
import { formatRelativeTime } from "@open-mercato/shared/lib/time";
const ICON_WRAPPER_SIZES = {
  sm: "h-6 w-6",
  md: "h-8 w-8"
};
const ICON_SIZES = {
  sm: "h-3.5 w-3.5",
  md: "h-4 w-4"
};
function TimelineItemHeader({
  title,
  subtitle,
  timestamp,
  fallbackTimestampLabel,
  icon,
  color,
  iconSize = "md",
  className
}) {
  const wrapperSize = ICON_WRAPPER_SIZES[iconSize];
  const iconSizeClass = ICON_SIZES[iconSize];
  const resolvedTimestamp = React.useMemo(() => {
    if (subtitle) return subtitle;
    if (!timestamp) return fallbackTimestampLabel ?? null;
    const value = typeof timestamp === "string" ? timestamp : timestamp.toISOString();
    const date = new Date(value);
    if (Number.isNaN(date.getTime())) return fallbackTimestampLabel ?? null;
    const now = Date.now();
    const diff = Math.abs(now - date.getTime());
    const THIRTY_DAYS_MS = 30 * 24 * 60 * 60 * 1e3;
    const relativeLabel = diff <= THIRTY_DAYS_MS ? formatRelativeTime(value) : null;
    const absoluteLabel = formatDateTime(value);
    if (relativeLabel) {
      return /* @__PURE__ */ jsx("span", { title: absoluteLabel ?? void 0, children: relativeLabel });
    }
    return absoluteLabel ?? fallbackTimestampLabel ?? null;
  }, [fallbackTimestampLabel, subtitle, timestamp]);
  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-start gap-3", className), children: [
    icon ? /* @__PURE__ */ jsx(
      "span",
      {
        className: cn(
          "inline-flex items-center justify-center rounded border border-border bg-muted/50",
          wrapperSize
        ),
        children: renderDictionaryIcon(icon, iconSizeClass)
      }
    ) : null,
    /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
      /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
        /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: title }),
        color ? renderDictionaryColor(color, "h-3 w-3 rounded-full border border-border") : null
      ] }),
      resolvedTimestamp ? /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: resolvedTimestamp }) : null
    ] })
  ] });
}
export {
  TimelineItemHeader
};
//# sourceMappingURL=TimelineItemHeader.js.map
