src/index.js

import { Ketcher } from 'ketcher-standalone';

// 导出一个初始化函数，以便在 HTML 中调用
export function initializeKetcher(containerId, binaryWasmPath) {
  const ketcherInstance = new Ketcher(containerId, {
    preset: 'default',
    binaryWasmPath: binaryWasmPath,
  });

  // 设置初始 SMILES 为 "c1cccc1"
  ketcherInstance.setMolecule("c1cccc1").then(() => {
    console.log("初始 SMILES 加载完成");
  }).catch(err => {
    console.error("加载初始 SMILES 时出错:", err);
  });

  // 监听 Ketcher 的 'change' 事件，当分子结构改变时触发
  ketcherInstance.on('change', () => {
    ketcherInstance.getSmiles().then(smiles => {
      console.log("生成的新 SMILES:", smiles);
      // 在此处可以添加与 Gradio 后端的交互逻辑
    }).catch(err => {
      console.error('获取 SMILES 时出错:', err);
    });
  });

  // 监听 Ketcher 的 'load' 事件，当分子结构加载时触发
  ketcherInstance.on('load', () => {
    ketcherInstance.getSmiles().then(smiles => {
      console.log("加载的 SMILES:", smiles);
    }).catch(err => {
      console.error('获取 SMILES 时出错:', err);
    });
  });
}