@oix1987/yjd 1.0.0 → 1.0.1

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 +65 -22
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,21 +1,30 @@
1
- # Rich Text Editor
1
+ # @oix1987/yjd - Professional Rich Text Editor
2
2
 
3
- A powerful rich text editor with real-time content change tracking.
3
+ A powerful, commercial-grade rich text editor with real-time content change tracking for web applications. Built with vanilla JavaScript for maximum performance and compatibility.
4
4
 
5
- ## Features
5
+ ## 🚀 Features
6
6
 
7
- - Rich text formatting (Bold, Italic, Underline, Strikethrough, etc.)
8
- - Real-time content change tracking with `onChange` callback
9
- - Modern UI with customizable toolbar
10
- - Support for images, tables, links, and more
11
- - TypeScript support
7
+ - **Rich Text Formatting**: Bold, Italic, Underline, Strikethrough, Subscript, Superscript
8
+ - **Advanced Formatting**: Text alignment, line height, font family, text size, background colors
9
+ - **Content Management**: Images, tables, links, lists, emojis, videos
10
+ - **Real-time Tracking**: `onChange` callback for live content monitoring
11
+ - **Modern UI**: Customizable toolbar with intuitive controls
12
+ - **TypeScript Support**: Full type definitions included
13
+ - **Lightweight**: Pure JavaScript implementation, no heavy dependencies
14
+ - **Cross-browser**: Compatible with all modern browsers
12
15
 
13
- ## Usage
16
+ ## 📦 Installation
14
17
 
15
- ### Basic Usage
18
+ ```bash
19
+ npm install @oix1987/yjd
20
+ ```
21
+
22
+ ## 💻 Usage
23
+
24
+ ### Basic Implementation
16
25
 
17
26
  ```javascript
18
- import RichEditor from "./index.js";
27
+ import RichEditor from "@oix1987/yjd";
19
28
 
20
29
  const editor = new RichEditor("#editor-container", {
21
30
  content: "<p>Initial content</p>",
@@ -32,14 +41,25 @@ const editor = new RichEditor("#editor-container", {
32
41
  });
33
42
  ```
34
43
 
35
- ### Options
44
+ ### CDN Usage
45
+
46
+ ```html
47
+ <script src="https://unpkg.com/@oix1987/yjd/dist/rich-editor.min.js"></script>
48
+ <script>
49
+ const editor = new RichEditor("#editor-container", {
50
+ // configuration options
51
+ });
52
+ </script>
53
+ ```
54
+
55
+ ## ⚙️ Configuration Options
36
56
 
37
57
  | Option | Type | Default | Description |
38
58
  | ------------- | -------- | -------------- | --------------------------------------------- |
39
59
  | `content` | string | null | Initial content for the editor |
40
60
  | `height` | number | 400 | Editor height in pixels |
41
61
  | `width` | number | 800 | Editor width in pixels |
42
- | `theme` | string | 'light' | Editor theme |
62
+ | `theme` | string | 'light' | Editor theme (light/dark) |
43
63
  | `placeholder` | string | 'Type here...' | Placeholder text |
44
64
  | `onChange` | function | undefined | Callback function called when content changes |
45
65
 
@@ -64,9 +84,9 @@ onChange: (content) => {
64
84
  };
65
85
  ```
66
86
 
67
- ## Events
87
+ ## 🎯 Events
68
88
 
69
- The editor also supports event listeners:
89
+ The editor supports comprehensive event handling:
70
90
 
71
91
  ```javascript
72
92
  // Listen for text changes
@@ -74,18 +94,41 @@ editor.on("text-change", (content) => {
74
94
  console.log("Text changed:", content);
75
95
  });
76
96
 
97
+ // Listen for focus events
98
+ editor.on("focus", () => {
99
+ console.log("Editor focused");
100
+ });
101
+
77
102
  // Remove event listener
78
103
  editor.off("text-change", handler);
79
104
  ```
80
105
 
81
- ## Methods
106
+ ## 🔧 API Methods
107
+
108
+ | Method | Description | Parameters | Returns |
109
+ | --------------------- | ------------------------ | ---------------------------------- | -------- |
110
+ | `getContent()` | Get current HTML content | - | `string` |
111
+ | `setContent(content)` | Set editor content | `content: string` | `void` |
112
+ | `focus()` | Focus the editor | - | `void` |
113
+ | `on(event, handler)` | Add event listener | `event: string, handler: function` | `void` |
114
+ | `off(event, handler)` | Remove event listener | `event: string, handler: function` | `void` |
115
+
116
+ ## 💼 Commercial License
117
+
118
+ This is a commercial product. For licensing information and pricing, please contact:
119
+
120
+ - **Author**: Oix1987
121
+ - **License**: ISC (Commercial)
122
+ - **Version**: 1.0.1
123
+
124
+ ## 📄 License
125
+
126
+ Copyright (c) 2024 Oix1987. All rights reserved.
127
+
128
+ This software is licensed under the ISC License. Commercial use requires a valid license.
82
129
 
83
- - `getContent()` - Get current HTML content
84
- - `setContent(content)` - Set editor content
85
- - `focus()` - Focus the editor
86
- - `on(event, handler)` - Add event listener
87
- - `off(event, handler)` - Remove event listener
130
+ ## 🆘 Support
88
131
 
89
- ## Example
132
+ For technical support, feature requests, or licensing inquiries, please contact the author.
90
133
 
91
134
  See `index.html` and `main.js` for a complete working example that demonstrates the `onChange` functionality with real-time output display.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oix1987/yjd",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "A powerful rich text editor with real-time content change tracking for web applications using base javascript",
5
5
  "license": "ISC",
6
6
  "author": "Oix1987",