docx-editor
Безплатен редактор на документи с отворен код

1. Инсталирайте пакета на адаптера React и свързаните с него зависимости

# Инсталирайте най-новата стабилна версия на React зависимости docx-editor
npm install @eigenpal/docx-editor-react

2. Импортирайте и конфигурирайте в компонента

import React, { useState } from 'react';
import { DocxEditor } from '@eigenpal/docx-editor-react';
// Импортирайте файла със стилове, за да осигурите правилната работа на лентата с инструменти и областта за редактиране
import '@eigenpal/docx-editor-react/styles.css';

function DocumentWorkspace() {
  const [docBuffer, setDocBuffer] = useState(null);

  const handleSave = (updatedBuffer) => {
    // updatedBuffer е променен оригинален двоичен файл на Word (ArrayBuffer)
    console.log('Актуализация на данните за документа:', updatedBuffer);
  };

  return (
    <div style={{ height: '80vh', border: '1px solid rgba(255,255,255,0.08)' }}>
      <DocxEditor
        documentBuffer={docBuffer}
        onSave={handleSave}
      />
    </div>
  );
}

export default DocumentWorkspace;