import { jsx } from "react/jsx-runtime";
import { tcv, formatRelativeTime, tcx } from "@choiceform/design-system";
import { observer, use$ as useSelector } from "../../../_vendor/@legendapp/state/react.js";
import { messageComputed$ } from "../../../stores/message-store.js";
import { coreStore$ } from "../../../stores/core-store.js";
const timestampTv = tcv({
  base: "text-secondary-foreground leading-5",
  variants: {
    showActions: {
      true: "opacity-100",
      false: "opacity-0"
    },
    hasAvatar: {
      true: {},
      false: {}
    },
    hasActions: {
      true: "place-self-end",
      false: "place-self-start"
    }
  },
  compoundVariants: [
    {
      hasAvatar: true,
      hasActions: false,
      class: "col-start-2"
    }
  ],
  defaultVariants: {
    showActions: false,
    hasActions: false
  }
});
const ResponseTimestamp = observer(function ResponseTimestamp2(props) {
  const { className, response, messageId, hasActions, hasAvatar, showActions } = props;
  const id = messageId ?? response?.message?.id;
  const message = useSelector(id ? messageComputed$.getMessage(id) : void 0);
  const language = useSelector(coreStore$.ui.language);
  if (!message || !message.createdAt) return null;
  const isStreaming = message.isStreaming === true;
  const languageMap = {
    us: "en",
    cn: "cn"
  };
  const tv = timestampTv({
    showActions: (showActions ?? false) && !isStreaming,
    hasActions,
    hasAvatar
  });
  return /* @__PURE__ */ jsx("div", { className: tcx(tv, className), children: formatRelativeTime(new Date(message.createdAt), {
    showSpecificTime: true,
    language: languageMap[language]
  }) });
});
export {
  ResponseTimestamp
};
//# sourceMappingURL=response-timestamp.js.map
