Expose React APIs globally

Author: kyoshino

package.json

@@ -38,6 +38,7 @@
     "@sindresorhus/transliterate": "^1.6.0",
     "@sveltia/ui": "^0.27.9",
     "@sveltia/utils": "^0.8.0",
+    "create-react-class": "^15.7.0",
     "dayjs": "^1.11.18",
     "deepmerge": "^4.3.1",
     "exifreader": "^4.31.2",
@@ -52,6 +53,8 @@
     "parse-entities": "^4.0.2",
     "pdfjs-dist": "^5.4.149",
     "qrcode": "^1.5.4",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
     "sanitize-filename": "^1.6.3",
     "smol-toml": "^1.4.2",
     "svelte-i18n": "^4.0.1",

pnpm-lock.yaml

@@ -1,3 +1,5 @@
+import createClass from 'create-react-class';
+import { createElement } from 'react';
 import { mount } from 'svelte';
 
 import { customPreviewStyleRegistry } from '$lib/services/contents/editor';
@@ -205,6 +207,13 @@ export { init };
 window.CMS = CMS;
 window.initCMS = init;
 
+// Expose React APIs for custom widgets, custom preview templates and custom editor components
+// @see https://decapcms.org/docs/custom-widgets/
+// @see https://decapcms.org/docs/customization/
+window.createClass = createClass;
+window.createElement = createElement;
+window.h = createElement;
+
 // Automatically initialize the CMS if manual initialization is not requested AND the script is NOT
 // a module; We can’t just use `document.currentScript` for module detection because the earlier
 // versions of Sveltia CMS were built and shipped as modules

src/lib/main.js

@@ -3,6 +3,10 @@ interface Window {
   CMS_MANUAL_INIT?: boolean;
   initCMS: Function;
   showDirectoryPicker: Function;
+  // React
+  createClass: Function;
+  createElement: Function;
+  h: Function;
 }
 
 interface Navigator {