const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_useEngineContext = require("../../hooks/useEngineContext.js");
const require_localeUtils = require("../pisellDateTimeDisplay/utils/localeUtils.js");
const require_relativeDay = require("../pisellDateTimeDisplay/utils/relativeDay.js");
const require_parseTimeRange = require("./utils/parseTimeRange.js");
const require_TimeRangeBlock = require("./components/TimeRangeBlock.js");
const require_DateBlock = require("./components/DateBlock.js");
const require_WeekdayBlock = require("./components/WeekdayBlock.js");
const require_DurationBlock = require("./components/DurationBlock.js");
let react = require("react");
react = require_runtime.__toESM(react);
let dayjs = require("dayjs");
dayjs = require_runtime.__toESM(dayjs);
require("dayjs/locale/zh-cn");
require("dayjs/locale/en");
require("./PisellTimeRangeDisplay.less");
//#region src/components/pisellTimeRangeDisplay/PisellTimeRangeDisplay.tsx
/**
* PisellTimeRangeDisplay 组件
*
* @description
* 纯展示型时间区间组件，将 startAt / endAt 格式化为「时间区间 + 持续时间」。
* - 同一天：HH:mm-HH:mm，可选显示日期/星期
* - 跨天：起止日期时间
* - 持续时间：d h m s 格式
* - 字段顺序由 fieldOrder 控制，可将 duration 放在中间
*
* @example
* <PisellTimeRangeDisplay
*   startAt="2026-02-04 09:00"
*   endAt="2026-02-04 18:00"
* />
* // => "09:00-18:00" + "9h"
*
* <PisellTimeRangeDisplay
*   startAt={start}
*   endAt={end}
*   fields={{ fieldOrder: ['time', 'duration', 'date', 'weekday'] }}
*   showDateForSameDay
* />
*/
const PisellTimeRangeDisplay = (props) => {
	var _context$engine, _durationFormat$showS;
	const { startAt, endAt, textAlign = "center", fields, showDateForSameDay = true, timeFormat, dateFormat, weekdayFormat, durationFormat, containerStyle, timeStyle, dateStyle, weekdayStyle, durationStyle, locale: localeProp, className, style, onClick } = props;
	const context = require_useEngineContext.default();
	const resolvedLocale = localeProp || (context === null || context === void 0 || (_context$engine = context.engine) === null || _context$engine === void 0 || (_context$engine = _context$engine.props) === null || _context$engine === void 0 ? void 0 : _context$engine.locale) || "en";
	const effectiveLocale = (0, react.useMemo)(() => require_localeUtils.getDayjsLocale(resolvedLocale), [resolvedLocale]);
	const { start, end, isSameDay } = (0, react.useMemo)(() => require_parseTimeRange.parseTimeRange(startAt, endAt, effectiveLocale), [
		startAt,
		endAt,
		effectiveLocale
	]);
	const durationMs = (0, react.useMemo)(() => end.diff(start), [start, end]);
	const { showTimeRange = true, showDate = true, showWeekday = true, showDuration = true, fieldOrder = [
		"weekday",
		"date",
		"time",
		"duration"
	] } = fields || {};
	const showSeconds = (_durationFormat$showS = durationFormat === null || durationFormat === void 0 ? void 0 : durationFormat.showSeconds) !== null && _durationFormat$showS !== void 0 ? _durationFormat$showS : false;
	const effectiveDateFormat = (0, react.useMemo)(() => require_objectSpread2._objectSpread2({ showRelativeDay: false }, dateFormat), [dateFormat]);
	const referenceDate = (0, dayjs.default)();
	const relativeDay = (effectiveDateFormat === null || effectiveDateFormat === void 0 ? void 0 : effectiveDateFormat.showRelativeDay) ? require_relativeDay.getRelativeDay(start, referenceDate) : null;
	const hideWeekdayWhenDateRelative = showDate && relativeDay !== null;
	const justifyContent = textAlign === "right" ? "flex-end" : textAlign === "left" ? "flex-start" : "center";
	const containerInlineStyle = require_objectSpread2._objectSpread2({
		background: containerStyle === null || containerStyle === void 0 ? void 0 : containerStyle.background,
		borderRadius: containerStyle === null || containerStyle === void 0 ? void 0 : containerStyle.borderRadius,
		border: containerStyle === null || containerStyle === void 0 ? void 0 : containerStyle.border,
		boxShadow: containerStyle === null || containerStyle === void 0 ? void 0 : containerStyle.boxShadow,
		padding: containerStyle === null || containerStyle === void 0 ? void 0 : containerStyle.padding,
		gap: containerStyle === null || containerStyle === void 0 ? void 0 : containerStyle.gap,
		textAlign,
		justifyContent
	}, style);
	const renderField = (fieldType) => {
		switch (fieldType) {
			case "time": return showTimeRange ? /* @__PURE__ */ react.default.createElement(require_TimeRangeBlock.default, {
				key: "time",
				start,
				end,
				isSameDay,
				timeFormat,
				dateFormat: effectiveDateFormat,
				weekdayFormat,
				referenceDate: (0, dayjs.default)(),
				style: timeStyle
			}) : null;
			case "date":
				if (!showDate) return null;
				if (!isSameDay) return null;
				if (!showDateForSameDay) return null;
				return /* @__PURE__ */ react.default.createElement(require_DateBlock.default, {
					key: "date",
					date: start,
					format: effectiveDateFormat,
					referenceDate: (0, dayjs.default)(),
					style: dateStyle
				});
			case "weekday":
				if (!showWeekday) return null;
				if (!isSameDay) return null;
				if (!showDateForSameDay) return null;
				if (hideWeekdayWhenDateRelative) return null;
				return /* @__PURE__ */ react.default.createElement(require_WeekdayBlock.default, {
					key: "weekday",
					weekday: start,
					format: weekdayFormat,
					style: weekdayStyle
				});
			case "duration": return showDuration ? /* @__PURE__ */ react.default.createElement(require_DurationBlock.default, {
				key: "duration",
				durationMs,
				showSeconds,
				locale: effectiveLocale,
				style: durationStyle
			}) : null;
			default: return null;
		}
	};
	const items = [];
	fieldOrder.forEach((fieldType) => {
		const node = renderField(fieldType);
		if (node != null) items.push({
			type: fieldType,
			node
		});
	});
	if (items.length === 0) return null;
	const renderedWithSeparator = items.flatMap(({ type, node }, index) => {
		const needDotBefore = type === "duration" && index > 0;
		const needDotAfter = type === "duration" && index < items.length - 1;
		const sep = /* @__PURE__ */ react.default.createElement("span", {
			className: "pisell-time-range-display-sep",
			"aria-hidden": true
		}, " · ");
		const el = react.default.cloneElement(node, { key: type });
		if (needDotBefore) return [sep, el];
		if (needDotAfter) return [el, sep];
		return [el];
	});
	return /* @__PURE__ */ react.default.createElement("div", {
		className: `pisell-time-range-display ${className || ""}`.trim(),
		style: containerInlineStyle,
		onClick
	}, renderedWithSeparator);
};
react.default.memo(PisellTimeRangeDisplay);
//#endregion
exports.PisellTimeRangeDisplay = PisellTimeRangeDisplay;
