@questflow/canvas

``typescript
interface CanvasProps {
idToken: string; // 通过"获取用户的id_token"获取
theme?: 'light' | 'dark'; // 主题，默认为light
template?: { [key: string]: any }; // 模板对象，默认没有模板对象
flowName?: string; // 新建流程的名称，默认为New Flow
flowDescription?: string; // 新建流程的描述，默认为New Flow description
onPublish?: (publishedFlow: PublishedFlow) => void; // 发布后回调
onPre?: () => void; // 当点击返回时候的回调
showPublishAsTemplate?: boolean; // 是否展示 publish as template按钮，默认不展示
showPublish?: boolean; // 是否展示 publish 按钮，默认不展示
showSave?: boolean; // 是否展示 save 按钮，默认不展示
questflowURL?: string; // questflow地址，用于组件与questflow服务器通信
}

onPublish回调参数

interface PublishedFlow {
createdAt: Date; // 创建时间
name: string; // 流程名称
isPublished: boolean; // 是否已经发布
publishedAt: Date; // 发布时间
flowId: string; // 流程id
webhook?: string; // 执行流程的webhook
}
`

###一个使用的示例，可以使用create-react-app，然后替换App.tsx文件内容

`
import React from 'react';
import ReactDOM from 'react-dom';
import Canvas, { PublishedFlow } from '@questflow/canvas';

function App() {
const idToken = 'eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6ImRQRmFnYnhObW1KM21zdHk2RXpuTmV1WGhpTE5LMGpmSlZhdlZDWXZtRWMifQ.eyJzdWIiOiI2NDVjYWFhMGVhM2UwZDk3YjcyNWNmY2UiLCJhdF9oYXNoIjoiUWljOEtpV0pBenRuUEliQnNSamdEdyIsInNpZCI6Ik9qeFhHQXVJa2lNWU1iaGpVVEtGTSIsImF1ZCI6ImZvb3RwcmludCIsImV4cCI6MTY4MzgyNjg5MCwiaWF0IjoxNjgzODIzMjkwLCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjMwMDAvYXBpL29pZGMifQ.S8Rrrn-r2mOwUpclVkWd2P6Rv3oNhOWvHwnDIjRTVjFMkeujBMWgH3aTWhvtoGBKPy3si7E2EmV5O572UTaaEr_mBljSjIiCabzvdYhbwnSw6MSpwNdt-io-G9Rxb8Zm9VFHsvnxNif2ueHc50eo9vPtAI6m47e1MU6irVBOOOmEz_6xHMCv397PXxVfpTF4peHsMNueceK-BYgjAbiXP52JJ4AeIvgwOEo5vR4ZdLMzS5KdSvELa08j_ag8KumKuK2njlaontIo2-56j_f2SvUSs7hWJfHC7F1k0VYMWcLjdmxcbucHIaViIyWszS-hmZXjQvkjUaM8blvjSd_Zfg'

const onPublish = (flow: PublishedFlow) => {
console.log(flow)
}

return (


export default App;
``