Stop building email editors from scratch.

import TopolEditor from "@topol.io/editor-react";

const customOptions = {
  authorize: {
    apiKey: "YOUR_API_KEY",
    userId: "current-user-id",
  },
};

export function EmailEditor() {
  return (
    <TopolEditor
      options={customOptions}
      onSaveAndClose={({ json, html }) => saveTemplate({ json, html })}
    />
  );
}

<script setup>
import { TopolEditor } from "@topol.io/editor-vue";

const customOptions = {
  authorize: {
    apiKey: "YOUR_API_KEY",
    userId: "current-user-id",
  },
};

function handleSaveAndClose({ json, html }) {
  saveTemplate({ json, html });
}
</script>

<template>
  <TopolEditor
    :options="customOptions"
    @onSaveAndClose="handleSaveAndClose"
  />
</template>

import TopolEditor, { type ITopolOptions, type ISaveData } from "@topol.io/editor-react";

const customOptions: ITopolOptions = {
  authorize: {
    apiKey: "YOUR_API_KEY",
    userId: "current-user-id",
  },
};

export function EmailEditor() {
  return (
    <TopolEditor
      options={customOptions}
      onSaveAndClose={({ json, html }: ISaveData) => saveTemplate({ json, html })}
    />
  );
}