v2.3.1

demos/cases/GanttEditor.jsx

@@ -0,0 +1,34 @@
+import { useMemo, useState, useCallback } from 'react';
+import { getData } from '../data';
+import { Gantt, Editor } from '../../src/';
+
+function GanttEditor(props) {
+  const { skinSettings } = props;
+
+  const data = useMemo(() => getData(), []);
+
+  const [api, setApi] = useState();
+
+  const init = useCallback((ganttApi) => {
+    setApi(ganttApi);
+    // show Editor on "add-task" action
+    ganttApi.on('add-task', ({ id }) => {
+      ganttApi.exec('show-editor', { id });
+    });
+  }, []);
+
+  return (
+    <>
+      <Gantt
+        init={init}
+        {...skinSettings}
+        tasks={data.tasks}
+        links={data.links}
+        scales={data.scales}
+      />
+      {api && <Editor api={api} />}
+    </>
+  );
+}
+
+export default GanttEditor;