@vonaffenfels/contentful-slate-editor 1.2.21 → 1.2.23

package/src/index.js

@@ -1,86 +1,86 @@
-import React, {useState} from 'react';
-import {createRoot} from 'react-dom/client';
-
-import {
-    init,
-    locations,
-} from '@contentful/app-sdk';
-import '@contentful/forma-36-react-components/dist/styles.css';
-import '@contentful/forma-36-fcss/dist/styles.css';
-import '@contentful/forma-36-tokens/dist/css/index.css';
-import '@vonaffenfels/slate-editor/dist/index.css';
-
-import EntryEditor from './components/EntryEditor';
-import Config from './components/ConfigScreen';
-import Field from './components/Field';
-import Dialog from "./components/Dialog";
-import {Sidebar} from "./components/Sidebar";
-
-export const BaseContentfulApp = (props) => {
-    init(async (sdk) => {
-        const rootContainer = document.getElementById('root');
-        const RendererWrapperComponent = props?.RendererWrapperComponent || (({children}) => <div
-            className="h-full">{children}</div>);
-        const wrapperProps = {
-            sdk,
-            value: sdk.parameters?.invocation?.value || sdk?.field?.getValue(),
-            portal: sdk.parameters?.invocation?.portal || sdk?.entry?.fields?.portal.getValue(),
-            contentType: sdk.parameters?.invocation?.contentType || sdk?.entry?.getSys()?.contentType?.sys?.id,
-        };
-        const elementPropsMap = props?.getElementPropsMap?.(wrapperProps.contentType) || props?.elementPropsMap;
-
-        let config = {};
-
-        if (wrapperProps.portal && props.getByPortal) {
-            try {
-                config = await props.getByPortal(wrapperProps.portal);
-
-                if (props.getDomain) {
-                    config.domain = props.getDomain(wrapperProps.portal);
-                }
-            } catch (e) {
-                console.error(`Error in getting config for portal ${wrapperProps.portal}`, e);
-            }
-        }
-
-        const ComponentLocationSettings = [
-            {
-                location: locations.LOCATION_APP_CONFIG,
-                component: <Config sdk={sdk}/>,
-            },
-            {
-                location: locations.LOCATION_ENTRY_FIELD,
-                component: <RendererWrapperComponent {...wrapperProps}><Field
-                    sdk={sdk}
-                    elementPropsMap={elementPropsMap}/></RendererWrapperComponent>,
-            },
-            {
-                location: locations.LOCATION_ENTRY_EDITOR,
-                component: <RendererWrapperComponent {...wrapperProps}><EntryEditor
-                    elementPropsMap={elementPropsMap}
-                    sdk={sdk}
-                    onStorybookElementClick={element => {
-                        const storybookElementChangeEvent = new CustomEvent("storybookElementChange", {detail: element});
-
-                        window.parent.document.dispatchEvent(storybookElementChangeEvent);
-                    }}
-                    activeConfig={config}/></RendererWrapperComponent>,
-            },
-            {
-                location: locations.LOCATION_DIALOG,
-                component: <Dialog sdk={sdk} elementPropsMap={elementPropsMap} activeConfig={config}/>,
-            },
-            {
-                location: locations.LOCATION_ENTRY_SIDEBAR,
-                component: <Sidebar sdk={sdk} activeConfig={config}/>,
-            },
-        ];
-
-        ComponentLocationSettings.forEach((componentLocationSetting) => {
-            if (sdk.location.is(componentLocationSetting.location)) {
-                const root = createRoot(rootContainer); // createRoot(container!) if you use TypeScript
-                root.render(componentLocationSetting.component);
-            }
-        });
-    });
+import React, {useState} from 'react';
+import {createRoot} from 'react-dom/client';
+
+import {
+    init,
+    locations,
+} from '@contentful/app-sdk';
+import '@contentful/forma-36-react-components/dist/styles.css';
+import '@contentful/forma-36-fcss/dist/styles.css';
+import '@contentful/forma-36-tokens/dist/css/index.css';
+import '@vonaffenfels/slate-editor/dist/index.css';
+
+import EntryEditor from './components/EntryEditor';
+import Config from './components/ConfigScreen';
+import Field from './components/Field';
+import Dialog from "./components/Dialog";
+import {Sidebar} from "./components/Sidebar";
+
+export const BaseContentfulApp = (props) => {
+    init(async (sdk) => {
+        const rootContainer = document.getElementById('root');
+        const RendererWrapperComponent = props?.RendererWrapperComponent || (({children}) => <div
+            className="h-full">{children}</div>);
+        const wrapperProps = {
+            sdk,
+            value: sdk.parameters?.invocation?.value || sdk?.field?.getValue(),
+            portal: sdk.parameters?.invocation?.portal || sdk?.entry?.fields?.portal.getValue(),
+            contentType: sdk.parameters?.invocation?.contentType || sdk?.entry?.getSys()?.contentType?.sys?.id,
+        };
+        const elementPropsMap = props?.getElementPropsMap?.(wrapperProps.contentType) || props?.elementPropsMap;
+
+        let config = {};
+
+        if (wrapperProps.portal && props.getByPortal) {
+            try {
+                config = await props.getByPortal(wrapperProps.portal);
+
+                if (props.getDomain) {
+                    config.domain = props.getDomain(wrapperProps.portal);
+                }
+            } catch (e) {
+                console.error(`Error in getting config for portal ${wrapperProps.portal}`, e);
+            }
+        }
+
+        const ComponentLocationSettings = [
+            {
+                location: locations.LOCATION_APP_CONFIG,
+                component: <Config sdk={sdk}/>,
+            },
+            {
+                location: locations.LOCATION_ENTRY_FIELD,
+                component: <RendererWrapperComponent {...wrapperProps}><Field
+                    sdk={sdk}
+                    elementPropsMap={elementPropsMap}/></RendererWrapperComponent>,
+            },
+            {
+                location: locations.LOCATION_ENTRY_EDITOR,
+                component: <RendererWrapperComponent {...wrapperProps}><EntryEditor
+                    elementPropsMap={elementPropsMap}
+                    sdk={sdk}
+                    onStorybookElementClick={element => {
+                        const storybookElementChangeEvent = new CustomEvent("storybookElementChange", {detail: element});
+
+                        window.parent.document.dispatchEvent(storybookElementChangeEvent);
+                    }}
+                    activeConfig={config}/></RendererWrapperComponent>,
+            },
+            {
+                location: locations.LOCATION_DIALOG,
+                component: <Dialog sdk={sdk} elementPropsMap={elementPropsMap} activeConfig={config}/>,
+            },
+            {
+                location: locations.LOCATION_ENTRY_SIDEBAR,
+                component: <Sidebar sdk={sdk} activeConfig={config}/>,
+            },
+        ];
+
+        ComponentLocationSettings.forEach((componentLocationSetting) => {
+            if (sdk.location.is(componentLocationSetting.location)) {
+                const root = createRoot(rootContainer); // createRoot(container!) if you use TypeScript
+                root.render(componentLocationSetting.component);
+            }
+        });
+    });
 };

package/src/scss/dialog-cloudinary.scss

@@ -1,18 +1,18 @@
-html, body, #root, #root > div {
-    width: 100%;
-    height: 100%;
-}
-
-.cloudinary-dialog {
-    width: 100%;
-    height: 100%;
-    min-width: 100%;
-    min-height: 100%;
-
-    iframe {
-        width: 100%;
-        height: 100%;
-        min-width: 100%;
-        min-height: 100%;
-    }
+html, body, #root, #root > div {
+    width: 100%;
+    height: 100%;
+}
+
+.cloudinary-dialog {
+    width: 100%;
+    height: 100%;
+    min-width: 100%;
+    min-height: 100%;
+
+    iframe {
+        width: 100%;
+        height: 100%;
+        min-width: 100%;
+        min-height: 100%;
+    }
 }

package/src/scss/index.scss

@@ -1,24 +1,24 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-html, body, div {
-    margin: 0;
-    padding: 0;
-    border: 0;
-    font-size: 100%;
-    font: inherit;
-    vertical-align: baseline;
-}
-
-.editor-field {
-    position: relative;
-    height: 100%;
-}
-
-@media (prefers-color-scheme: dark) {
-    .editor-field {
-        color: white;
-    }
-}
-
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+html, body, div {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    font: inherit;
+    vertical-align: baseline;
+}
+
+.editor-field {
+    position: relative;
+    height: 100%;
+}
+
+@media (prefers-color-scheme: dark) {
+    .editor-field {
+        color: white;
+    }
+}
+

package/tailwind.config.js

@@ -1,5 +1,5 @@
-module.exports = {
-    content: [
-        './src/**/*.js',
-    ],
+module.exports = {
+    content: [
+        './src/**/*.js',
+    ],
 };

package/webpack.config.dev.js

@@ -1,26 +1,26 @@
-const path = require('path');
-let config = require("./webpack.config")({
-    componentImportRoot: "@vonaffenfels/slate-editor/src/dev/testComponents",
-    relativePathToComponents: path.resolve(__dirname + "../../../@base/slate-editor/src/dev/testComponents"),
-});
-
-
-config.entry = {index: './src/dev.js'};
-
-config.mode = "development";
-config.watch = true;
-config.watchOptions = {ignored: ['dist/**', 'node_modules/**']};
-config.cache = {type: "memory"};
-
-config.output.publicPath = "/dist/";
-config.devtool = 'inline-source-map';
-
-config.devServer = {
-    static: path.join(__dirname, 'dist'),
-    compress: true,
-    historyApiFallback: true,
-    port: process.env.PORT,
-    devMiddleware: {writeToDisk: true},
-};
-
+const path = require('path');
+let config = require("./webpack.config")({
+    componentImportRoot: "@vonaffenfels/slate-editor/src/dev/testComponents",
+    relativePathToComponents: path.resolve(__dirname + "../../../@base/slate-editor/src/dev/testComponents"),
+});
+
+
+config.entry = {index: './src/dev.js'};
+
+config.mode = "development";
+config.watch = true;
+config.watchOptions = {ignored: ['dist/**', 'node_modules/**']};
+config.cache = {type: "memory"};
+
+config.output.publicPath = "/dist/";
+config.devtool = 'inline-source-map';
+
+config.devServer = {
+    static: path.join(__dirname, 'dist'),
+    compress: true,
+    historyApiFallback: true,
+    port: process.env.PORT,
+    devMiddleware: {writeToDisk: true},
+};
+
 module.exports = config;