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/components/pisellDateTimeDisplay/PisellDateTimeDisplay.tsx
var PisellDateTimeDisplay_exports = {};
__export(PisellDateTimeDisplay_exports, {
  PisellDateTimeDisplay: () => PisellDateTimeDisplay,
  default: () => PisellDateTimeDisplay_default
});
module.exports = __toCommonJS(PisellDateTimeDisplay_exports);
var import_react = __toESM(require("react"));
var import_dayjs = __toESM(require("dayjs"));
var import_zh_cn = require("dayjs/locale/zh-cn");
var import_en = require("dayjs/locale/en");
var import_hooks = require("./hooks");
var import_utils = require("./utils");
var import_components = require("./components");
var import_dateTimeDisplayFormats = require("./formats/dateTimeDisplayFormats");
var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
var import_PisellDateTimeDisplay = require("./PisellDateTimeDisplay.less");
var PisellDateTimeDisplay = (props) => {
  var _a, _b;
  const {
    value: valueProp,
    layout = "horizontal",
    textAlign = "center",
    fields,
    formatByLocale,
    timeFormat,
    dateFormat,
    weekdayFormat,
    customFormat,
    inlineSeparator = " · ",
    containerStyle,
    timeStyle,
    dateStyle,
    weekdayStyle,
    refreshInterval,
    disableAutoRefresh = false,
    locale,
    onTimeUpdate,
    onClick,
    className,
    style
  } = props;
  const context = (0, import_useEngineContext.default)();
  const resolvedLocale = locale || ((_b = (_a = context == null ? void 0 : context.engine) == null ? void 0 : _a.props) == null ? void 0 : _b.locale) || "en";
  const localeKey = (0, import_utils.getDayjsLocale)(resolvedLocale);
  const baseLocale = localeKey.split("-")[0];
  const presetSource = formatByLocale ?? import_dateTimeDisplayFormats.DATETIME_DISPLAY_FORMATS;
  const preset = presetSource[localeKey] ?? presetSource[baseLocale] ?? {};
  const effectiveFields = { ...preset.fields, ...fields };
  const effectiveDateFormat = { ...preset.dateFormat, ...dateFormat };
  const effectiveTimeFormat = { ...preset.timeFormat, ...timeFormat };
  const effectiveWeekdayFormat = { ...preset.weekdayFormat, ...weekdayFormat };
  const computedRefreshInterval = refreshInterval ?? (0, import_utils.getRefreshInterval)(effectiveTimeFormat);
  const currentTime = (0, import_hooks.useCurrentTime)({
    refreshInterval: computedRefreshInterval,
    disabled: disableAutoRefresh || valueProp !== void 0,
    locale: resolvedLocale,
    onUpdate: onTimeUpdate
  });
  const displayTime = valueProp !== void 0 && valueProp !== null ? (0, import_dayjs.default)(valueProp).locale(localeKey) : currentTime;
  if (customFormat) {
    const formattedTime = displayTime.format(customFormat);
    const containerInlineStyle2 = {
      background: containerStyle == null ? void 0 : containerStyle.background,
      borderRadius: containerStyle == null ? void 0 : containerStyle.borderRadius,
      border: containerStyle == null ? void 0 : containerStyle.border,
      boxShadow: containerStyle == null ? void 0 : containerStyle.boxShadow,
      padding: containerStyle == null ? void 0 : containerStyle.padding,
      textAlign,
      ...style
    };
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: `pisell-datetime-display pisell-datetime-display-custom ${className || ""}`.trim(),
        style: containerInlineStyle2,
        onClick
      },
      /* @__PURE__ */ import_react.default.createElement("span", null, formattedTime)
    );
  }
  const {
    showTime = true,
    showDate = true,
    showWeekday = true,
    fieldOrder = ["time", "date", "weekday"]
  } = effectiveFields || {};
  const referenceDate = (0, import_dayjs.default)();
  const relativeDay = (effectiveDateFormat == null ? void 0 : effectiveDateFormat.showRelativeDay) ? (0, import_utils.getRelativeDay)(displayTime, referenceDate) : null;
  const hideWeekdayWhenDateRelative = showDate && relativeDay !== null;
  const containerInlineStyle = {
    background: containerStyle == null ? void 0 : containerStyle.background,
    borderRadius: containerStyle == null ? void 0 : containerStyle.borderRadius,
    border: containerStyle == null ? void 0 : containerStyle.border,
    boxShadow: containerStyle == null ? void 0 : containerStyle.boxShadow,
    padding: containerStyle == null ? void 0 : containerStyle.padding,
    gap: containerStyle == null ? void 0 : containerStyle.gap,
    textAlign,
    ...style
  };
  const renderField = (fieldType) => {
    switch (fieldType) {
      case "time":
        return showTime ? /* @__PURE__ */ import_react.default.createElement(
          import_components.TimeDisplay,
          {
            key: "time",
            time: displayTime,
            format: effectiveTimeFormat,
            style: timeStyle
          }
        ) : null;
      case "date":
        return showDate ? /* @__PURE__ */ import_react.default.createElement(
          import_components.DateDisplay,
          {
            key: "date",
            date: displayTime,
            format: effectiveDateFormat,
            referenceDate: (0, import_dayjs.default)(),
            style: dateStyle
          }
        ) : null;
      case "weekday":
        return showWeekday && !hideWeekdayWhenDateRelative ? /* @__PURE__ */ import_react.default.createElement(
          import_components.WeekdayDisplay,
          {
            key: "weekday",
            weekday: displayTime,
            format: effectiveWeekdayFormat,
            style: weekdayStyle
          }
        ) : null;
      default:
        return null;
    }
  };
  if (layout === "inline") {
    const inlineSeparators = effectiveFields == null ? void 0 : effectiveFields.inlineSeparators;
    const renderedFields2 = fieldOrder.map(renderField).filter((field) => field !== null);
    if (renderedFields2.length === 0) {
      return null;
    }
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: `pisell-datetime-display pisell-datetime-display-inline ${className || ""}`.trim(),
        style: containerInlineStyle,
        onClick
      },
      renderedFields2.map((field, index) => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, { key: index }, field, index < renderedFields2.length - 1 && /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-datetime-display-separator" }, (inlineSeparators == null ? void 0 : inlineSeparators[index]) ?? inlineSeparator)))
    );
  }
  const renderedFields = fieldOrder.map(renderField).filter((field) => field !== null);
  if (renderedFields.length === 0) {
    return null;
  }
  if (layout === "horizontal") {
    const timeField = showTime ? renderField("time") : null;
    const currentLocale = displayTime.locale();
    const isChinese = (0, import_utils.isChinese)(currentLocale);
    if (showDate && showWeekday) {
      const labels = effectiveDateFormat == null ? void 0 : effectiveDateFormat.relativeDayLabels;
      const dateStr = relativeDay ? (labels == null ? void 0 : labels[relativeDay]) ?? (0, import_utils.getRelativeDayLabel)(relativeDay, displayTime.locale()) : isChinese ? displayTime.format("M月D日") : displayTime.format("D MMM");
      const weekdayStr = displayTime.format("ddd");
      const combinedStr = relativeDay ? dateStr : isChinese ? `${weekdayStr} ${dateStr}` : `${weekdayStr}, ${dateStr}`;
      const dateInlineStyle = {
        fontSize: dateStyle == null ? void 0 : dateStyle.fontSize,
        fontWeight: dateStyle == null ? void 0 : dateStyle.fontWeight,
        color: dateStyle == null ? void 0 : dateStyle.color,
        lineHeight: dateStyle == null ? void 0 : dateStyle.lineHeight
      };
      return /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          className: `pisell-datetime-display pisell-datetime-display-${layout} ${className || ""}`.trim(),
          style: containerInlineStyle,
          onClick
        },
        timeField,
        /* @__PURE__ */ import_react.default.createElement(
          "span",
          {
            className: "pisell-datetime-display-date pisell-datetime-display-combined",
            style: dateInlineStyle
          },
          combinedStr
        )
      );
    }
    const dateField = showDate ? renderField("date") : null;
    const weekdayField = showWeekday ? renderField("weekday") : null;
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: `pisell-datetime-display pisell-datetime-display-${layout} ${className || ""}`.trim(),
        style: containerInlineStyle,
        onClick
      },
      timeField,
      (dateField || weekdayField) && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-datetime-display-date-weekday-row" }, dateField, weekdayField)
    );
  }
  return /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      className: `pisell-datetime-display pisell-datetime-display-${layout} ${className || ""}`.trim(),
      style: containerInlineStyle,
      onClick
    },
    renderedFields
  );
};
var PisellDateTimeDisplay_default = import_react.default.memo(PisellDateTimeDisplay);
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  PisellDateTimeDisplay
});
