+
An error occurred.
{getMessage()}
-
diff --git a/src/components/Editor/components/Layout.tsx b/src/components/Editor/components/Layout.tsx
index 2d9a35e0..eeea10a8 100644
--- a/src/components/Editor/components/Layout.tsx
+++ b/src/components/Editor/components/Layout.tsx
@@ -1,17 +1,19 @@
-import type { JSX } from 'solid-js/jsx-runtime';
+import type { JSX } from 'solid-js/jsx-runtime'
import type { Config } from '../store/context'
import '../styles/Layout.scss'
export type Styled = {
- children: JSX.Element;
- config?: Config;
- 'data-testid'?: string;
- onClick?: () => void;
- onMouseEnter?: (e: MouseEvent) => void;
+ children: JSX.Element
+ config?: Config
+ 'data-testid'?: string
+ onClick?: () => void
+ onMouseEnter?: (e: MouseEvent) => void
}
export const Layout = (props: Styled) => {
- return (
- {props.children}
-
)
+ return (
+
+ {props.children}
+
+ )
}
diff --git a/src/components/Editor/components/ProseMirror.tsx b/src/components/Editor/components/ProseMirror.tsx
index da06ba55..1f1c9a86 100644
--- a/src/components/Editor/components/ProseMirror.tsx
+++ b/src/components/Editor/components/ProseMirror.tsx
@@ -6,14 +6,13 @@ import { Schema } from 'prosemirror-model'
import type { NodeViewFn, ProseMirrorExtension, ProseMirrorState } from '../prosemirror/helpers'
interface ProseMirrorProps {
- style?: string;
- className?: string;
- text?: Store
;
- editorView?: Store;
- extensions?: Store;
- onInit: (s: EditorState, v: EditorView) => void;
- onReconfigure: (s: EditorState) => void;
- onChange: (s: EditorState) => void;
+ cssClass?: string
+ text?: Store
+ editorView?: Store
+ extensions?: Store
+ onInit: (s: EditorState, v: EditorView) => void
+ onReconfigure: (s: EditorState) => void
+ onChange: (s: EditorState) => void
}
export const ProseMirror = (props: ProseMirrorProps) => {
@@ -28,45 +27,39 @@ export const ProseMirror = (props: ProseMirrorProps) => {
props.onChange(newState)
}
- createEffect((payload: [EditorState, ProseMirrorExtension[]]) => {
- const [prevText, prevExtensions] = payload
- const text = unwrap(props.text)
- const extensions: ProseMirrorExtension[] = unwrap(props.extensions)
- if (!text || !extensions?.length) {
+ createEffect(
+ (payload: [EditorState, ProseMirrorExtension[]]) => {
+ const [prevText, prevExtensions] = payload
+ const text = unwrap(props.text)
+ const extensions: ProseMirrorExtension[] = unwrap(props.extensions)
+ if (!text || !extensions?.length) {
+ return [text, extensions]
+ }
+
+ if (!props.editorView) {
+ const { editorState, nodeViews } = createEditorState(text, extensions)
+ const view = new EditorView(editorRef, { state: editorState, nodeViews, dispatchTransaction })
+ view.focus()
+ props.onInit(editorState, view)
+ return [editorState, extensions]
+ }
+
+ if (extensions !== prevExtensions || (!(text instanceof EditorState) && text !== prevText)) {
+ const { editorState, nodeViews } = createEditorState(text, extensions, prevText)
+ if (!editorState) return
+ editorView().updateState(editorState)
+ editorView().setProps({ nodeViews, dispatchTransaction })
+ props.onReconfigure(editorState)
+ editorView().focus()
+ return [editorState, extensions]
+ }
+
return [text, extensions]
- }
-
- if (!props.editorView) {
- const { editorState, nodeViews } = createEditorState(text, extensions)
- const view = new EditorView(editorRef, { state: editorState, nodeViews, dispatchTransaction })
- view.focus()
- props.onInit(editorState, view)
- return [editorState, extensions]
- }
-
- if (extensions !== prevExtensions || (!(text instanceof EditorState) && text !== prevText)) {
- const { editorState, nodeViews } = createEditorState(text, extensions, prevText)
- if (!editorState) return
- editorView().updateState(editorState)
- editorView().setProps({ nodeViews, dispatchTransaction })
- props.onReconfigure(editorState)
- editorView().focus()
- return [editorState, extensions]
- }
-
- return [text, extensions]
- },
- [props.text, props.extensions]
+ },
+ [props.text, props.extensions]
)
- return (
-
- )
+ return
}
const createEditorState = (
@@ -74,8 +67,8 @@ const createEditorState = (
extensions: ProseMirrorExtension[],
prevText?: EditorState
): {
- editorState: EditorState;
- nodeViews: { [key: string]: NodeViewFn };
+ editorState: EditorState
+ nodeViews: { [key: string]: NodeViewFn }
} => {
const reconfigure = text instanceof EditorState && prevText?.schema
let schemaSpec = { nodes: {} }
@@ -104,7 +97,7 @@ const createEditorState = (
editorState = text.reconfigure({ schema, plugins } as EditorStateConfig)
} else if (text instanceof EditorState) {
editorState = EditorState.fromJSON({ schema, plugins }, text.toJSON())
- } else if (text){
+ } else if (text) {
console.debug(text)
editorState = EditorState.fromJSON({ schema, plugins }, text)
}
diff --git a/src/components/Editor/components/Sidebar.module.scss b/src/components/Editor/components/Sidebar.module.scss
new file mode 100644
index 00000000..a626b942
--- /dev/null
+++ b/src/components/Editor/components/Sidebar.module.scss
@@ -0,0 +1,3 @@
+.withMargin {
+ margin-bottom: 10px;
+}
diff --git a/src/components/Editor/components/Sidebar.tsx b/src/components/Editor/components/Sidebar.tsx
index ecb392c1..f7fb7415 100644
--- a/src/components/Editor/components/Sidebar.tsx
+++ b/src/components/Editor/components/Sidebar.tsx
@@ -7,17 +7,20 @@ import * as remote from '../remote'
import { isEmpty } from '../prosemirror/helpers'
import type { Styled } from './Layout'
import '../styles/Sidebar.scss'
+import { clsx } from 'clsx'
+import styles from './Sidebar.module.scss'
-const Off = (props) =>
+const Off = (props) =>
-const Label = (props: Styled) =>
+const Label = (props: Styled) =>
const Link = (
props: Styled & { withMargin?: boolean; disabled?: boolean; title?: string; className?: string }
) => (