@eventuras/scribo 0.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE.md ADDED
@@ -0,0 +1,31 @@
1
+ # License info
2
+
3
+ ## Scribo Markdown package
4
+
5
+ MIT License
6
+
7
+ Copyright (c) 2023 Losol
8
+
9
+ Permission is hereby granted, free of charge, to any person obtaining a copy
10
+ of this software and associated documentation files (the "Software"), to deal
11
+ in the Software without restriction, including without limitation the rights
12
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
13
+ copies of the Software, and to permit persons to whom the Software is
14
+ furnished to do so, subject to the following conditions:
15
+
16
+ The above copyright notice and this permission notice shall be included in all
17
+ copies or substantial portions of the Software.
18
+
19
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
20
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
21
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
22
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
23
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
24
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
25
+ SOFTWARE.
26
+
27
+ ## Included open source work
28
+
29
+ - Lexical.dev is licensed under [MIT](https://github.com/facebook/lexical), and many of the files are based on the work of Meta. All files provided by Meta to his repo has a separate license info in the top of the file.
30
+
31
+ - [Bootstrap Icons](https://icons.getbootstrap.com) which are included in this Editor.css are licensed under MIT license <https://github.com/twbs/icons/blob/main/LICENSE.md>
package/README.md ADDED
@@ -0,0 +1,31 @@
1
+ # Scribo markdown editor
2
+
3
+ Markdown editor built on [Lexical framework](https://lexical.dev/). Intended to be used as part of eventuras, but also packed as a standalone component. Scribo is a WYSIWYG edito with markdown export.
4
+
5
+ The editor should provide simple and intuitive editing of markdown text, with a focus on the most common use cases.
6
+
7
+ ## Develop
8
+
9
+ To start developing Scribo, run the following commands:
10
+
11
+ ```bash
12
+ npm install
13
+ vite dev
14
+ ```
15
+
16
+ ## Publish
17
+
18
+ To publish a new version of the package:
19
+
20
+ 1. Update version number in package.json
21
+ 1. `npm run build`
22
+ 1. `npm login --scope @eventuras --auth-type web`
23
+ 1. `npm publish --access public`
24
+
25
+ ## Credits
26
+
27
+ Scribo is built on the [Lexical framework](https://lexical.dev/), and most of the code in the repo is done by [Meta under MIT license](https://github.com/facebook/lexical).
28
+
29
+ ## Learn More
30
+
31
+ - [Lexical](https://lexical.dev/)
@@ -0,0 +1,4 @@
1
+ /** @type {import("eslint").Linter.Config} */
2
+ module.exports = {
3
+ extends: ['@eventuras/eslint-config/react-library.js'],
4
+ };
package/index.html ADDED
@@ -0,0 +1,13 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <link rel="icon" type="image/svg+xml" href="/vite.svg" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ <title>Scribo Markdown Editor</title>
8
+ </head>
9
+ <body>
10
+ <div id="root"></div>
11
+ <script type="module" src="/src/index.tsx"></script>
12
+ </body>
13
+ </html>
package/package.json ADDED
@@ -0,0 +1,41 @@
1
+ {
2
+ "name": "@eventuras/scribo",
3
+ "version": "0.4.2",
4
+ "main": "src/main.tsx",
5
+ "type": "module",
6
+ "scripts": {
7
+ "build": "vite build",
8
+ "build:site": "BUILD_SITE=true vite build",
9
+ "dev": "vite"
10
+ },
11
+ "dependencies": {
12
+ "@lexical/link": "0.28.0",
13
+ "@lexical/markdown": "^0.28.0",
14
+ "@lexical/react": "^0.28.0",
15
+ "lexical": "^0.28.0"
16
+ },
17
+ "peerDependencies": {
18
+ "react": "^19.1.0",
19
+ "react-dom": "^19.1.0"
20
+ },
21
+ "devDependencies": {
22
+ "@eventuras/eslint-config": "*",
23
+ "@eventuras/typescript-config": "*",
24
+ "@swc/core": "^1.13.3",
25
+ "@testing-library/react": "^16.3.0",
26
+ "@types/react": "^19.1.9",
27
+ "@types/react-dom": "^19.1.7",
28
+ "@vitejs/plugin-react-swc": "^4.0.0",
29
+ "lightningcss": "^1.30.1",
30
+ "react": "19.1.1",
31
+ "react-dom": "19.1.1",
32
+ "typescript": "^5.9.2",
33
+ "vite": "^7.1.1",
34
+ "vitest": "^3.2.4"
35
+ },
36
+ "overrides": {
37
+ "vite": {
38
+ "rollup": "npm:@rollup/wasm-node"
39
+ }
40
+ }
41
+ }
package/src/App.css ADDED
@@ -0,0 +1,35 @@
1
+ body {
2
+ margin: 0;
3
+ background: #eee;
4
+ font-family: Arial, Helvetica, sans-serif;
5
+ }
6
+
7
+ h1 {
8
+ text-align: center;
9
+ margin: 20px 0;
10
+ }
11
+
12
+ .editor-container {
13
+ display: flex;
14
+ flex-direction: column;
15
+ }
16
+
17
+ .markdown-output {
18
+ white-space: pre-wrap;
19
+ overflow: auto;
20
+ }
21
+
22
+ @media (min-width: 768px) {
23
+ .editor-container {
24
+ flex-direction: row;
25
+ }
26
+
27
+ .markdown-editor,
28
+ .markdown-output {
29
+ flex: 1;
30
+ margin: 10px;
31
+ padding: 20px;
32
+ border: 1px solid #ccc;
33
+ border-radius: 5px;
34
+ }
35
+ }
package/src/App.tsx ADDED
@@ -0,0 +1,42 @@
1
+ import { useState } from 'react'
2
+ import MarkdownEditor from './MarkdownEditor'
3
+
4
+ interface Props {
5
+ /** Initial markdown string */
6
+ initialMarkdown: string
7
+ }
8
+
9
+ /**
10
+ * Wraps editor + rendered output
11
+ * @see {@link Props}
12
+ */
13
+ export function App({ initialMarkdown }: Readonly<Props>) {
14
+ // State for current markdown
15
+ const [markdown, setMarkdown] = useState<string>(initialMarkdown)
16
+
17
+ // Handle editor changes
18
+ const onChange = (newMd: string) => setMarkdown(newMd)
19
+
20
+ return (
21
+ <div className="App">
22
+ <h1>Scribo Markdown editor</h1>
23
+
24
+ <div className="editor-container">
25
+ {/* Editor panel */}
26
+ <div className="markdown-editor">
27
+ <h2>Edit content</h2>
28
+ <MarkdownEditor
29
+ initialMarkdown={markdown}
30
+ onChange={onChange}
31
+ />
32
+ </div>
33
+
34
+ {/* Rendered output */}
35
+ <div className="markdown-output">
36
+ <h2>See the markdown output</h2>
37
+ <pre>{markdown}</pre>
38
+ </div>
39
+ </div>
40
+ </div>
41
+ )
42
+ }