hivewrite-sdk 1.0.0 → 1.0.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.
Files changed (2) hide show
  1. package/README.md +111 -15
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,31 +1,45 @@
1
- # hivewrite-sdk
1
+ # HiveWrite Email Editor SDK
2
2
 
3
- Email Editor SDK for React and JavaScript applications.
3
+ The HiveWrite Email Editor SDK is a powerful, flexible, and easy-to-integrate drag-and-drop email builder for your React or JavaScript applications.
4
+
5
+ [![NPM Version](https://img.shields.io/npm/v/hivewrite-sdk.svg)](https://www.npmjs.com/package/hivewrite-sdk)
6
+ [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
4
7
 
5
8
  ## Installation
6
9
 
10
+ ### Via NPM
7
11
  ```bash
8
- npm install ./path/to/packages/sdk
12
+ npm install hivewrite-sdk
13
+ ```
14
+
15
+ ### Via CDN (Plain HTML/JS)
16
+ ```html
17
+ <script src="https://cdn.jsdelivr.net/npm/hivewrite-sdk/bundle.min.js"></script>
9
18
  ```
10
19
 
11
- ## Usage in React
20
+ ---
21
+
22
+ ## Quick Start
23
+
24
+ ### React Integration
12
25
 
13
26
  ```tsx
14
27
  import React, { useEffect, useRef } from 'react';
15
28
  import { EmailEditor } from 'hivewrite-sdk';
16
29
 
17
- const EmailEditorComponent = () => {
30
+ const MyEditor = () => {
18
31
  const containerRef = useRef(null);
19
32
 
20
33
  useEffect(() => {
21
34
  if (containerRef.current) {
22
35
  EmailEditor.init({
23
- apiKey: 'YOUR_API_KEY',
36
+ apiKey: 'your-api-key',
24
37
  container: containerRef.current,
25
38
  mode: 'FULL_EDITOR',
26
39
  callbacks: {
27
- onLoad: () => console.log('Editor Loaded'),
28
- onSave: (design) => console.log('Saved:', design)
40
+ onLoad: () => console.log('Editor ready'),
41
+ onSave: (design) => console.log('Saved:', design),
42
+ onExport: (html) => console.log('HTML:', html)
29
43
  }
30
44
  });
31
45
  }
@@ -33,13 +47,95 @@ const EmailEditorComponent = () => {
33
47
 
34
48
  return <div ref={containerRef} style={{ height: '100vh', width: '100%' }} />;
35
49
  };
50
+ ```
51
+
52
+ ### Plain JavaScript Integration
53
+
54
+ ```html
55
+ <div id="editor-container" style="height: 100vh;"></div>
36
56
 
37
- export default EmailEditorComponent;
57
+ <script src="https://cdn.jsdelivr.net/npm/hivewrite-sdk/bundle.min.js"></script>
58
+ <script>
59
+ EmailEditor.init({
60
+ apiKey: 'your-api-key',
61
+ container: '#editor-container',
62
+ mode: 'FULL_EDITOR',
63
+ callbacks: {
64
+ onLoad: () => console.log('Ready!')
65
+ }
66
+ });
67
+ </script>
38
68
  ```
39
69
 
40
- ## Features
41
- - Drag & Drop Interface
42
- - MJML Export
43
- - Custom Sections
44
- - Merge Tags
45
- - White Labeling
70
+ ---
71
+
72
+ ## API Reference
73
+
74
+ ### `EmailEditor.init(config: SDKConfig)`
75
+ Initializes and mounts the editor.
76
+
77
+ #### `SDKConfig` Parameters:
78
+
79
+ | Parameter | Type | Required | Description |
80
+ | :--- | :--- | :--- | :--- |
81
+ | `apiKey` | `string` | Yes | Your HiveWrite API Key. |
82
+ | `container` | `string \| HTMLElement` | Yes | CSS selector or DOM element to mount the editor. |
83
+ | `mode` | `string` | Yes | `'FULL_EDITOR'`, `'DESIGN_ONLY'`, `'READ_ONLY'`, `'HTML_IMPORT'` |
84
+ | `user` | `object` | No | `{ id: string, email: string }` for tracking. |
85
+ | `branding` | `object` | No | Custom white-labeling options (see below). |
86
+ | `mergeTags` | `array` | No | Array of `{ label, value }` for dynamic content. |
87
+ | `callbacks` | `object` | No | Event hooks for SDK actions. |
88
+
89
+ ---
90
+
91
+ ### Callbacks
92
+
93
+ | Callback | Arguments | Description |
94
+ | :--- | :--- | :--- |
95
+ | `onLoad` | `()` | Triggered when the editor is fully initialized. |
96
+ | `onSave` | `(jsonDesign: any)` | Triggered when the user clicks save or `saveDesign` is called. |
97
+ | `onExport` | `(html: string)` | Triggered when the user exports or `exportHtml` is called. |
98
+ | `onError` | `(err: any)` | Triggered during initialization or processing errors. |
99
+ | `onImageUpload`| `(file: File)` | **Async**. Intercept image uploads and return a URL string. |
100
+ | `onTemplateChange`| `(id: string)` | Triggered when a new template is selected. |
101
+
102
+ ---
103
+
104
+ ### Methods
105
+
106
+ #### `loadTemplate(data: { templateId?: string; design?: any })`
107
+ Loads a template by ID or a raw JSON design object.
108
+
109
+ #### `saveDesign(callback?: (json: any) => void)`
110
+ Manually triggers the save process. Returns the JSON design.
111
+
112
+ #### `exportHtml(callback?: (html: string) => void)`
113
+ Compiles the current design into MJML-based responsive HTML.
114
+
115
+ #### `importHTML(data: { html: string })`
116
+ Imports raw HTML (Experimental).
117
+
118
+ ---
119
+
120
+ ## Advanced Features
121
+
122
+ ### White Labeling (`branding`)
123
+ Customize the editor appearance to match your brand:
124
+ - `primaryColor`: Accent color for buttons and highlights.
125
+ - `logoUrl`: Custom logo in the editor sidebar/loading screen.
126
+ - `hidePoweredBy`: Remove HiveWrite branding.
127
+ - `customCSS`: Inject global CSS for deep styling overrides.
128
+
129
+ ### Merge Tags
130
+ Provide dynamic tags for personalization:
131
+ ```javascript
132
+ mergeTags: [
133
+ { label: 'First Name', value: '{{first_name}}' },
134
+ { label: 'Unsubscribe Link', value: '{{unsub_url}}' }
135
+ ]
136
+ ```
137
+
138
+ ---
139
+
140
+ ## License
141
+ MIT © [Pillars Developer](https://github.com/babbermaven)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hivewrite-sdk",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "description": "Email Editor SDK for React and JavaScript applications",
5
5
  "main": "index.js",
6
6
  "types": "index.d.ts",