documint 0.0.4 → 0.0.5

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.
Files changed (2) hide show
  1. package/README.md +34 -1
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -44,7 +44,9 @@ export function App() {
44
44
  }
45
45
  ```
46
46
 
47
- You can also start from one of the built-in themes and tweak just the values you care about.
47
+ ## Custom Themes
48
+
49
+ By default, Documint will detect the end-user's system theme and apply either the built-in light or dark theme. You can also specify a theme explicitly by passing `"light"` or `"dark"` to the `theme` prop, or provide a custom theme object with your own colors and styles.
48
50
 
49
51
  ```tsx
50
52
  import { useState } from "react";
@@ -63,3 +65,34 @@ export function App() {
63
65
  return <Documint content={content} onContentChanged={setContent} theme={customTheme} />;
64
66
  }
65
67
  ```
68
+
69
+ ## Custom Storage
70
+
71
+ If the document includes http-based images, then the editor will automatically load and render them. However, if you want to support pasting images from the clipboard or uploading images from the user's device, you'll need to provide a `storage` prop that implements the `DocumintStorage` interface.
72
+
73
+ ```tsx
74
+ import { useState } from "react";
75
+ import { Documint, DocumintStorage } from "documint";
76
+
77
+ function createInMemoryStorage(): DocumintStorage {
78
+ const files = new Map<string, Blob>();
79
+
80
+ return {
81
+ async readFile(path) {
82
+ return files.get(path) ?? null;
83
+ },
84
+ async writeFile(file) {
85
+ files.set(file.name, file);
86
+ return file.name;
87
+ },
88
+ };
89
+ }
90
+
91
+ const storage = createInMemoryStorage();
92
+
93
+ export function App() {
94
+ const [content, setContent] = useState("# Documint with Custom Storage");
95
+
96
+ return <Documint content={content} onContentChanged={setContent} storage={storage} />;
97
+ }
98
+ ```
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "documint",
3
- "version": "0.0.4",
3
+ "version": "0.0.5",
4
4
  "files": [
5
5
  "dist/index.js",
6
6
  "dist/index.d.ts"