@elia-ori/editor 0.1.25 → 0.1.27

package/README.md

@@ -88,11 +88,11 @@ function MyEditor() {
 ```ts
 type ToolbarItem =
   | 'undo-redo'    // 復原/重做
+  | 'text'         // 內文
   | 'heading'      // 標題 (H1-H4)
   | 'list'         // 列表
   | 'blockquote'   // 引用區塊
   | 'code-block'   // 程式碼區塊
-  | 'callout'      // 提示區塊
   | 'table'        // 表格
   | 'format'       // 格式 (粗體、斜體、刪除線、code、底線)
   | 'text-color'   // 文字顏色
@@ -161,3 +161,43 @@ const handleImageUpload = async (file, onProgress) => {
   // ...
 />
 ```
+
+## TocSidebar (目錄側邊欄)
+
+若需要顯示文章目錄，使用 `EliaEditorProvider` 包裹並加入 `TocSidebar`：
+
+```tsx
+import { EliaEditorProvider, EliaEditor, TocSidebar } from '@elia-ori/editor'
+import '@elia-ori/editor/styles.css'
+
+function MyPage() {
+  return (
+    <EliaEditorProvider>
+      <div style={{ display: 'flex', gap: '1rem' }}>
+        <TocSidebar />
+        <EliaEditor onChange={handleChange} />
+      </div>
+    </EliaEditorProvider>
+  )
+}
+```
+
+### TocSidebar Props
+
+| Prop | Type | Description |
+|------|------|-------------|
+| className | string | 自訂樣式類別 |
+
+### 自訂樣式
+
+TocSidebar 使用 CSS 變數，可透過覆蓋來自訂樣式：
+
+```css
+.my-toc {
+  --toc-title-color: #1f2937;
+  --toc-link-color: #6b7280;
+  --toc-hover-color: #374151;
+  --toc-hover-bg: #f3f4f6;
+  --toc-active-color: #2563eb;
+}
+```

package/dist/index.cjs

@@ -32,7 +32,9 @@ var index_exports = {};
 __export(index_exports, {
   Callout: () => Callout,
   EliaEditor: () => EliaEditor,
-  SimpleEditor: () => EliaEditor
+  SimpleEditor: () => EliaEditor,
+  contentExtensions: () => contentExtensions,
+  generateEditorHTML: () => generateEditorHTML
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -6341,10 +6343,53 @@ function EliaEditor({
     }
   );
 }
+
+// src/utils/content-renderer.ts
+var import_core2 = require("@tiptap/core");
+var import_starter_kit2 = __toESM(require("@tiptap/starter-kit"), 1);
+var import_extension_text_align2 = require("@tiptap/extension-text-align");
+var import_extension_list2 = require("@tiptap/extension-list");
+var import_extension_highlight2 = require("@tiptap/extension-highlight");
+var import_extension_typography2 = require("@tiptap/extension-typography");
+var import_extension_superscript2 = require("@tiptap/extension-superscript");
+var import_extension_subscript2 = require("@tiptap/extension-subscript");
+var import_extension_text_style2 = require("@tiptap/extension-text-style");
+var import_extension_color2 = require("@tiptap/extension-color");
+var import_extension_table2 = require("@tiptap/extension-table");
+var import_extension_table_row2 = require("@tiptap/extension-table-row");
+var import_extension_table_header2 = require("@tiptap/extension-table-header");
+var import_extension_table_cell2 = require("@tiptap/extension-table-cell");
+var import_tiptap_extension_resize_image2 = __toESM(require("tiptap-extension-resize-image"), 1);
+var contentExtensions = [
+  import_starter_kit2.default.configure({
+    horizontalRule: false
+  }),
+  HorizontalRule,
+  import_extension_text_align2.TextAlign.configure({ types: ["heading", "paragraph"] }),
+  import_extension_list2.TaskList,
+  import_extension_list2.TaskItem.configure({ nested: true }),
+  import_extension_highlight2.Highlight.configure({ multicolor: true }),
+  import_extension_typography2.Typography,
+  import_extension_superscript2.Superscript,
+  import_extension_subscript2.Subscript,
+  import_extension_text_style2.TextStyle,
+  import_extension_color2.Color,
+  import_extension_table2.Table.configure({ resizable: true }),
+  import_extension_table_row2.TableRow,
+  import_extension_table_header2.TableHeader,
+  import_extension_table_cell2.TableCell,
+  import_tiptap_extension_resize_image2.default.configure({ allowBase64: true }),
+  Callout
+];
+function generateEditorHTML(content) {
+  return (0, import_core2.generateHTML)(content, contentExtensions);
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Callout,
   EliaEditor,
-  SimpleEditor
+  SimpleEditor,
+  contentExtensions,
+  generateEditorHTML
 });
 //# sourceMappingURL=index.cjs.map