export function promptForAuthorIds(document: Document): Promise<string | null> {
  return new Promise((resolve) => {
    const overlay = document.createElement("div");
    overlay.dataset.authorIdDialog = "overlay";
    applyOverlayStyles(overlay);

    const dialog = document.createElement("section");
    applyDialogStyles(dialog);

    const title = document.createElement("h2");
    title.textContent = "按星图ID导出";
    applyTitleStyles(title);

    const textarea = document.createElement("textarea");
    textarea.dataset.authorIdDialogInput = "textarea";
    textarea.placeholder = "每行一个星图ID，也支持逗号、空格分隔";
    applyTextareaStyles(textarea);

    const hint = document.createElement("p");
    hint.textContent = "粘贴客户提供的达人星图ID，确认后将批量导出达人数据。";
    applyHintStyles(hint);

    const actions = document.createElement("div");
    applyActionsStyles(actions);

    const cancelButton = document.createElement("button");
    cancelButton.type = "button";
    cancelButton.textContent = "取消";
    applySecondaryButtonStyles(cancelButton);

    const confirmButton = document.createElement("button");
    confirmButton.type = "button";
    confirmButton.textContent = "开始导出";
    applyPrimaryButtonStyles(confirmButton);

    actions.append(cancelButton, confirmButton);
    dialog.append(title, hint, textarea, actions);
    overlay.append(dialog);
    document.body.appendChild(overlay);

    const close = (value: string | null) => {
      overlay.remove();
      resolve(value);
    };

    cancelButton.addEventListener("click", () => close(null));
    confirmButton.addEventListener("click", () => close(textarea.value));
    overlay.addEventListener("click", (event) => {
      if (event.target === overlay) {
        close(null);
      }
    });
    textarea.focus();
  });
}

function applyOverlayStyles(overlay: HTMLElement): void {
  overlay.style.position = "fixed";
  overlay.style.inset = "0";
  overlay.style.zIndex = "2147483647";
  overlay.style.display = "flex";
  overlay.style.alignItems = "center";
  overlay.style.justifyContent = "center";
  overlay.style.background = "rgba(15, 23, 42, 0.38)";
}

function applyDialogStyles(dialog: HTMLElement): void {
  dialog.style.width = "520px";
  dialog.style.maxWidth = "calc(100vw - 32px)";
  dialog.style.background = "#ffffff";
  dialog.style.borderRadius = "8px";
  dialog.style.boxShadow = "0 18px 45px rgba(15, 23, 42, 0.22)";
  dialog.style.padding = "20px";
  dialog.style.boxSizing = "border-box";
}

function applyTitleStyles(title: HTMLElement): void {
  title.style.margin = "0 0 8px";
  title.style.fontSize = "18px";
  title.style.fontWeight = "700";
  title.style.color = "#1f2329";
}

function applyHintStyles(hint: HTMLElement): void {
  hint.style.margin = "0 0 12px";
  hint.style.fontSize = "13px";
  hint.style.lineHeight = "20px";
  hint.style.color = "#64748b";
}

function applyTextareaStyles(textarea: HTMLTextAreaElement): void {
  textarea.style.width = "100%";
  textarea.style.height = "220px";
  textarea.style.resize = "vertical";
  textarea.style.border = "1px solid #d0d7de";
  textarea.style.borderRadius = "6px";
  textarea.style.padding = "10px";
  textarea.style.boxSizing = "border-box";
  textarea.style.fontSize = "13px";
  textarea.style.lineHeight = "20px";
  textarea.style.fontFamily = "ui-monospace, SFMono-Regular, Menlo, monospace";
  textarea.style.color = "#1f2329";
}

function applyActionsStyles(actions: HTMLElement): void {
  actions.style.display = "flex";
  actions.style.justifyContent = "flex-end";
  actions.style.columnGap = "8px";
  actions.style.marginTop = "14px";
}

function applyPrimaryButtonStyles(button: HTMLButtonElement): void {
  button.style.height = "32px";
  button.style.padding = "0 15px";
  button.style.border = "1px solid #7f1d2d";
  button.style.borderRadius = "8px";
  button.style.background = "#7f1d2d";
  button.style.color = "#ffffff";
  button.style.fontWeight = "600";
}

function applySecondaryButtonStyles(button: HTMLButtonElement): void {
  button.style.height = "32px";
  button.style.padding = "0 15px";
  button.style.border = "1px solid #d0d7de";
  button.style.borderRadius = "8px";
  button.style.background = "#ffffff";
  button.style.color = "#1f2329";
  button.style.fontWeight = "600";
}