ImportPopup.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <style>
      body { font-family: Arial, sans-serif; font-size: 13px; margin: 0; }
      label { display: block; margin: 8px 0 4px; }
      textarea { width: 100%; height: 280px; box-sizing: border-box; font-family: monospace; font-size: 12px; }
      input[type=text] { width: 100%; box-sizing: border-box; }
      .row { display: flex; gap: 8px; align-items: center; margin-top: 10px; }
      #error { color: #c5221f; white-space: pre-wrap; margin-top: 8px; }
    </style>
    <script>
      function loadFile(input) {
        var file = input.files[0];
        if (!file) return;
        var reader = new FileReader();
        reader.onload = () => { document.getElementById('jsonInput').value = reader.result; };
        reader.readAsText(file);
      }

      function onSubmitJSON() {
        var btn = document.getElementById('jsonBtn');
        var error = document.getElementById('error');
        error.textContent = '';
        btn.disabled = true;
        btn.value = 'Working...';

        google.script.run
          .withSuccessHandler(() => google.script.host.close())
          .withFailureHandler(e => {
            error.textContent = e.message;
            btn.disabled = false;
            btn.value = 'Create sheet';
          })
          .processJSONForm({
            json: document.getElementById('jsonInput').value,
            name: document.getElementById('nameInput').value,
          });
      }
    </script>
  </head>
  <body>
    <label for="jsonInput">Paste JSON, or load it from a file:</label>
    <textarea id="jsonInput" spellcheck="false"></textarea>
    <input type="file" accept=".json,application/json,text/plain" onchange="loadFile(this)" />
    <label for="nameInput">Tab name (optional):</label>
    <input id="nameInput" type="text" placeholder="ImportedJSON (n)" />
    <div class="row">
      <input id="jsonBtn" type="button" value="Create sheet" onclick="onSubmitJSON()" />
    </div>
    <div id="error"></div>
  </body>
</html>