math-rich-editor-pack 0.1.2 → 0.1.3

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/README.md CHANGED
@@ -1,6 +1,6 @@
1
- # Math Rich Editor Pack
1
+ # Math Rich Editor Pack
2
2
 
3
- Reusable React editor with rich-text + inline math insertion.
3
+ Reusable React editor for rich text and math equations in the same flow.
4
4
 
5
5
  ## Install
6
6
 
@@ -8,63 +8,120 @@ Reusable React editor with rich-text + inline math insertion.
8
8
  npm install math-rich-editor-pack
9
9
  ```
10
10
 
11
- ## Basic Usage
11
+ ```jsx
12
+ import { MathRichEditor } from 'math-rich-editor-pack'
13
+ import 'math-rich-editor-pack/style.css'
14
+ ```
15
+
16
+ ## Quick Start
12
17
 
13
18
  ```jsx
19
+ import { useRef } from 'react'
14
20
  import { MathRichEditor } from 'math-rich-editor-pack'
15
21
  import 'math-rich-editor-pack/style.css'
16
22
 
17
23
  export default function QuestionForm() {
24
+ const editorRef = useRef(null)
25
+
18
26
  return (
19
27
  <MathRichEditor
28
+ ref={editorRef}
29
+ placeholder="Write question text and equations..."
20
30
  onChange={({ html, json, text, latexList }) => {
21
- // Save the formats you need
31
+ // Save any format you need
22
32
  }}
23
33
  />
24
34
  )
25
35
  }
26
36
  ```
27
37
 
38
+ ## Built-In Features
39
+
40
+ - Rich text editing (bold, italic, underline, headings, lists, undo/redo)
41
+ - Equation insertion with MathLive keyboard and hardware keyboard
42
+ - Inline math output with KaTeX rendering
43
+ - Table support with clean UX:
44
+ - Main toolbar has one `Table` button
45
+ - Table controls appear only when cursor is inside a table
46
+ - Advanced table actions are under `More`
47
+ - Load content from HTML
48
+ - Load content from DOCX (with equation conversion + warning reporting)
49
+
28
50
  ## Callback API
29
51
 
30
52
  - `onChange(payload)`
31
- - `payload.html`
32
- - `payload.json`
33
- - `payload.text`
34
- - `payload.latexList`
53
+ - `payload.html`
54
+ - `payload.json`
55
+ - `payload.text`
56
+ - `payload.latexList`
35
57
  - `onHtmlChange(html)`
36
58
  - `onJsonChange(json)`
37
59
  - `onTextChange(text)`
38
60
  - `onLatexChange(latexList)`
39
61
  - `onMathInsert(latex)`
62
+ - `onLoadResult(result)`
63
+ - `result.source`: `'html' | 'docx'`
64
+ - `result.success`: `boolean`
65
+ - `result.warnings`: `string[]`
66
+ - `result.error`: `string | null`
67
+
68
+ ## Ref Methods (Imperative API)
69
+
70
+ Use `ref` on `MathRichEditor`:
71
+
72
+ ```jsx
73
+ const editorRef = useRef(null)
74
+ ```
40
75
 
41
- ## Main Props
76
+ Available methods:
42
77
 
43
- - `initialContent` (HTML string or JSON doc)
44
- - `placeholder`
45
- - `toolbarOptions`
46
- - default: `['bold','italic','underline','h1','h2','ul','ol','undo','redo','math']`
47
- - `mathShortcutEnabled` (default `true`)
48
- - `mathShortcutKey` (default `'m'`, used with Ctrl/Cmd)
78
+ - `loadFromHtml(html: string): boolean`
79
+ - `loadFromDocx(fileOrBuffer: File | Blob | ArrayBuffer): Promise<{ source, success, warnings, error }>`
80
+ - `getContent(): { html, json, text, latexList } | null`
81
+
82
+ Example:
83
+
84
+ ```jsx
85
+ editorRef.current?.loadFromHtml('<p>Hello <strong>world</strong></p>')
86
+
87
+ const file = input.files?.[0]
88
+ if (file) {
89
+ const result = await editorRef.current?.loadFromDocx(file)
90
+ console.log(result)
91
+ }
92
+
93
+ const current = editorRef.current?.getContent()
94
+ ```
95
+
96
+ ## Props
97
+
98
+ - `initialContent`: HTML string or Tiptap JSON doc
99
+ - `placeholder`: editor placeholder text
100
+ - `toolbarOptions`: custom visible tools
101
+ - Default: `['bold', 'italic', 'underline', 'h1', 'h2', 'ul', 'ol', 'table', 'undo', 'redo', 'math']`
102
+ - `mathShortcutEnabled`: enable `Ctrl/Cmd + key` shortcut for equation composer
103
+ - `mathShortcutKey`: shortcut key, default `'m'`
49
104
  - `className`, `toolbarClassName`, `editorClassName`
50
105
  - `composerTitle`, `composerDescription`, `composerInsertLabel`, `composerCancelLabel`
51
106
 
52
- ## Local Dev
107
+ ## Local Development
53
108
 
54
109
  ```bash
55
110
  npm install
56
111
  npm run dev
57
112
  ```
58
113
 
59
- ## Build Library
114
+ ## Build
60
115
 
61
116
  ```bash
62
117
  npm run build
63
118
  ```
64
119
 
65
- ## Pack Tarball (local test)
120
+ ## Publish Checklist
66
121
 
67
122
  ```bash
68
- npm run pack:local
69
- ```
70
-
123
+ npm run build
124
+ npm pack
125
+ npm publish --access public
126
+ ```
127
+
@@ -0,0 +1,6 @@
1
+ function r(o) {
2
+ throw new Error('Could not dynamically require "' + o + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
3
+ }
4
+ export {
5
+ r as c
6
+ };
@@ -0,0 +1,8 @@
1
+ var o = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
2
+ function l(e) {
3
+ return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
4
+ }
5
+ export {
6
+ o as c,
7
+ l as g
8
+ };