ui.html

<h2>Tailwind CSS Helper</h2>
<button id="export">export</button>
<script>
  function downloadObjectAsJson(exportObj, exportName) {
    var dataStr =
      "data:text/json;charset=utf-8," +
      encodeURIComponent(JSON.stringify(exportObj, null, 4));
    var downloadAnchorNode = document.createElement("a");
    downloadAnchorNode.setAttribute("href", dataStr);
    downloadAnchorNode.setAttribute("download", exportName + ".json");
    document.body.appendChild(downloadAnchorNode); // required for firefox
    downloadAnchorNode.click();
    downloadAnchorNode.remove();
  }
  window.onmessage = (msg) => {
    const data = msg.data.pluginMessage;
    if (data.type == "stylesInJson") {
      const stylesInJson = data.stylesInJson;
      downloadObjectAsJson(stylesInJson, "tailwindCSSHelper");
    }
  };
  document.getElementById("export").onclick = () => {
    parent.postMessage({ pluginMessage: { type: "export" } }, "*");
  };
</script>