update react test (#870)

src/editor/index.html

@@ -38,7 +38,7 @@ svgEditor.setConfig({
           allowInitialUserOverride: true,
           extensions: [],
           noDefaultExtensions: false,
-          userExtensions: [/* { pathName: './react-extensions/react-test/dist/react-test.js' } */]
+          userExtensions: [/* { pathName: '/packages/react-test/dist/react-test.js' } */]
         })
 // Variable XDOMAIN below is created by Rollup for the Xdomain build (see rollup.config.js)
 /* globals XDOMAIN */

src/editor/react-extensions/react-test/package.json

@@ -1,26 +0,0 @@
-{
-  "name": "react-test",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "build": "rollup -c"
-  },
-  "author": "OptimistikSAS",
-  "license": "MIT",
-  "dependencies": {
-    "react": "^18.1.0",
-    "react-dom": "^18.1.0",
-    "standard": "^17.0.0"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.17.10",
-    "@babel/preset-react": "^7.16.7",
-    "@rollup/plugin-babel": "^5.3.1",
-    "@rollup/plugin-commonjs": "^22.0.0",
-    "@rollup/plugin-node-resolve": "^13.3.0",
-    "@rollup/plugin-replace": "^4.0.0",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.73.0"
-  }
-}

src/editor/react-extensions/react-test/rollup.config.js

@@ -1,33 +0,0 @@
-import babel from '@rollup/plugin-babel'
-import { nodeResolve } from '@rollup/plugin-node-resolve'
-import commonjs from '@rollup/plugin-commonjs'
-import replace from '@rollup/plugin-replace'
-import rimraf from 'rimraf'
-
-// remove existing distribution
-rimraf('./dist', () => console.info('recreating dist'))
-export default {
-  input: 'src/index.js',
-  output: {
-    file: 'dist/react-test.js',
-    sourcemap: true
-  },
-  plugins: [
-    replace({
-      preventAssignment: true,
-      'process.env.NODE_ENV': '"production"'
-    }),
-    nodeResolve({
-      extensions: ['.js'],
-      browser: true
-    }),
-    babel({
-      babelHelpers: 'bundled',
-      presets: [['@babel/preset-react', { runtime: 'automatic' }]],
-      exclude: 'node_modules/**'
-    }),
-    commonjs({
-      transformMixedEsModules: true
-    })
-  ]
-}

src/editor/react-extensions/react-test/src/ReactTest.js

@@ -1,48 +0,0 @@
-import React, { useEffect } from 'react'
-
-const ReactTest = ({ svgEdit }) => {
-  const { svgCanvas } = svgEdit
-  const handleSvgEditEvent = (ev) => {
-    const { vars } = ev.detail
-    switch (ev.detail.action) {
-      case 'mouseDown':
-        // This is triggered when the main mouse button is pressed down
-        // on the editor canvas (not the tool panels)
-        // Check the mode on mousedown
-        if (svgCanvas.getMode() === 'hello_world') {
-          // event based extensions must set the start themselves
-          // to a value of true in order for mouseUp to be triggered
-          svgCanvas.setStarted(true)
-        }
-        break
-      case 'mouseUp':
-        // This is triggered from anywhere, but "started" must have been set
-        // to true (see above). Note that "opts" is an object with event info
-        // Check the mode on mouseup
-        if (svgCanvas.getMode() === 'hello_world') {
-          const zoom = svgCanvas.getZoom()
-          // Get the actual coordinate by dividing by the zoom value
-          const x = vars.mouse_x / zoom
-          const y = vars.mouse_y / zoom
-          // Show the text using the custom alert function
-          alert(`hello world ${x},${y})`)
-        }
-        break
-      default:
-        break
-    }
-  }
-  useEffect(() => {
-    document.addEventListener('svgedit', handleSvgEditEvent)
-    return () => {
-      // Clean up the subscription
-      document.removeEventListener('svgedit', handleSvgEditEvent)
-    }
-  })
-  const onClick = () => {
-    svgCanvas.setMode('hello_world')
-  }
-
-  return <se-button id='hello_world' title='Hello World' src='hello_world.svg' onClick={onClick} />
-}
-export default ReactTest

src/editor/react-extensions/react-test/src/index.js

@@ -1,22 +0,0 @@
-import React from 'react'
-import ReactDOM from 'react-dom'
-
-import ReactTest from './ReactTest'
-
-const name = 'react-test'
-const div = document.createElement('div')
-
-export default {
-  name,
-  async init () {
-    return {
-      name,
-      eventBased: true, // if eventbased is true, the extensions needs to listen to svgedit events
-      callback () {
-        // position the div used by React in the left bar
-        document.getElementById('tools_left').append(div)
-        ReactDOM.render(<ReactTest svgEdit={this} trigger='callback' />, div)
-      }
-    }
-  }
-}