raydit-editor 0.0.14 → 0.0.16
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 +8 -55
- package/dist/index.js +0 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +0 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/dist/index.css +0 -1
package/README.md
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @raydit-editor
|
|
2
2
|
|
|
3
|
-
A powerful
|
|
3
|
+
A powerful rich text editor built with TipTap and React.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
7
7
|
\`\`\`bash
|
|
8
|
-
npm install @
|
|
8
|
+
npm install @raydit-editor
|
|
9
9
|
|
|
10
10
|
# or
|
|
11
11
|
|
|
12
|
-
yarn add @
|
|
12
|
+
yarn add @raydit-editor
|
|
13
13
|
|
|
14
14
|
# or
|
|
15
15
|
|
|
16
|
-
pnpm add @
|
|
16
|
+
pnpm add @raydit-editor
|
|
17
17
|
\`\`\`
|
|
18
18
|
|
|
19
19
|
**Note:** This package requires Tailwind CSS to be set up in your project.
|
|
@@ -21,13 +21,14 @@ pnpm add @omnics/notion-editor
|
|
|
21
21
|
## Usage
|
|
22
22
|
|
|
23
23
|
\`\`\`tsx
|
|
24
|
-
import {
|
|
24
|
+
import { RayditEditor } from '@raydit-editor';
|
|
25
|
+
import "RayditEditor/dist/index.css";
|
|
25
26
|
|
|
26
27
|
function App() {
|
|
27
28
|
const [content, setContent] = useState('');
|
|
28
29
|
|
|
29
30
|
return (
|
|
30
|
-
<
|
|
31
|
+
<RayditEditor
|
|
31
32
|
content={content}
|
|
32
33
|
onChange={(html) => setContent(html)}
|
|
33
34
|
onBlur={(html) => console.log('Saved:', html)}
|
|
@@ -56,17 +57,6 @@ autoFocus
|
|
|
56
57
|
|
|
57
58
|
This package uses Tailwind CSS. Make sure your Tailwind config includes:
|
|
58
59
|
|
|
59
|
-
\`\`\`js
|
|
60
|
-
// tailwind.config.js
|
|
61
|
-
module.exports = {
|
|
62
|
-
content: [
|
|
63
|
-
'./node_modules/@yourorg/notion-editor/dist/**/*.{js,jsx}',
|
|
64
|
-
// ... your other paths
|
|
65
|
-
],
|
|
66
|
-
// ... rest of config
|
|
67
|
-
}
|
|
68
|
-
\`\`\`
|
|
69
|
-
|
|
70
60
|
## License
|
|
71
61
|
|
|
72
62
|
MIT
|
|
@@ -92,25 +82,6 @@ You need to decide how to handle styles:
|
|
|
92
82
|
- **Option B:** Require users to have Tailwind (current approach)
|
|
93
83
|
- **Option C:** Provide vanilla CSS alternative
|
|
94
84
|
|
|
95
|
-
### 2. Missing Components
|
|
96
|
-
|
|
97
|
-
You need to create/fix these files:
|
|
98
|
-
|
|
99
|
-
- `SlashExtension.ts`
|
|
100
|
-
- `SelectionToolbar.tsx`
|
|
101
|
-
- `RowAddButton.tsx`
|
|
102
|
-
- `ColumnAddButton.tsx`
|
|
103
|
-
- `useRowHover.ts`
|
|
104
|
-
- `useColumnHover.ts`
|
|
105
|
-
|
|
106
|
-
### 3. Testing
|
|
107
|
-
|
|
108
|
-
Add tests before publishing:
|
|
109
|
-
|
|
110
|
-
```bash
|
|
111
|
-
npm install --save-dev @testing-library/react @testing-library/jest-dom vitest
|
|
112
|
-
```
|
|
113
|
-
|
|
114
85
|
### 4. Publishing Checklist
|
|
115
86
|
|
|
116
87
|
- [ ] All TypeScript errors resolved
|
|
@@ -120,21 +91,3 @@ npm install --save-dev @testing-library/react @testing-library/jest-dom vitest
|
|
|
120
91
|
- [ ] Version number set correctly
|
|
121
92
|
- [ ] Test in a separate project before publishing
|
|
122
93
|
- [ ] Set up npm account and organization
|
|
123
|
-
|
|
124
|
-
## 🚀 Publishing Steps
|
|
125
|
-
|
|
126
|
-
```bash
|
|
127
|
-
# Build the package
|
|
128
|
-
npm run build
|
|
129
|
-
|
|
130
|
-
# Test locally first
|
|
131
|
-
npm link
|
|
132
|
-
cd /path/to/test-project
|
|
133
|
-
npm link @yourorg/notion-editor
|
|
134
|
-
|
|
135
|
-
# When ready to publish
|
|
136
|
-
npm login
|
|
137
|
-
npm publish --access public
|
|
138
|
-
```
|
|
139
|
-
|
|
140
|
-
Your code is definitely usable as a package foundation, but needs these structural improvements to be production-ready!
|
package/dist/index.js
CHANGED
|
@@ -5492,7 +5492,6 @@ var RayditEditor = ({
|
|
|
5492
5492
|
}) => {
|
|
5493
5493
|
const lastSavedRef = React2.useRef("");
|
|
5494
5494
|
const isDirtyRef = React2.useRef(false);
|
|
5495
|
-
console.log("demo", 233232362);
|
|
5496
5495
|
const editor = react.useEditor({
|
|
5497
5496
|
autofocus: autoFocus,
|
|
5498
5497
|
editable: !disabled,
|