JSFiddle - React, Tailwind, and code Playground

by dipeshbeckham

HTML

<button onclick="tiggerFileProcessed('preview-image')">
  Preview Image File Processed.
</button>

<button onclick="tiggerFileProcessed('base-file')">
  Base File Processed.
</button>

JavaScript

document.addEventListener("file-processed", (e) => {
console.log(e)
    alert(`The file-processed for ${e.detail.flag} event was triggered`);
});

function tiggerFileProcessed (flag) {
  const fileProcessedEvent = new CustomEvent("file-processed", {
    detail: { flag },
  });
	document.dispatchEvent(fileProcessedEvent);
}