Wysiwyg composer for Element Web using React
npm install @vector-im/matrix-wysiwyg
The Matrix Rich Text Editor is a React library.
The wysiwyg composer API is a react hook.
``tsx
const { ref, isWysiwygReady, wysiwyg } = useWysiwyg();
return (
Contribute
$3
#### Generate WASM bindings
The composer uses a cross-platform rust library. In order to work as intended, the WASM bindings must be generated according to the Matrix Rich Text Editor README.md
#### Yarn install
Requirements:
- node >= 8.X
- yarn 1.X
sh
yarn install
`If your environment supports the experimental ES Module Integration Proposal for WebAssembly,
you can instead use that, by setting the
custom export condition.
This is only supported when the library is imported as an ES Module. For example:
- In Webpack, set experiments.asyncWebAssembly
to and resolve.conditionNames
to (the "..." preserves default condition names).$3
#### Folder structure
- Inside the
lib folder, the wysiwyg composer library files are located with useWysiwyg as en entrypoint
- Inside the src folder, the demo page of the composer is located.$3
Launch:
`sh
yarn dev
`A dev server with hot reload is launched on
by default.For more information, see Vite for more information.
$3
Vite is the Wysiwyg Composer builder.
To build:
`sh
yarn build
`The builded files are located in the
folder$3
The tests are powered by Vitest.
To run them, different options are available:
- Classic run
`sh
yarn test
`- Watch mode
sh
yarn test:watch
`- Code coverage
sh
yarn coverage
`The coverage report is located in the