A React component to make transcribing audio and video easier and faster.

🚀 This is a fully modernized fork of the original @bbc/react-transcript-editor package with the latest dependencies and React 18/19 compatibility.

• ⚛️ React 18/19 Support: Full compatibility with modern React applications
• 🔒 Security: 93% reduction in vulnerabilities (from 45 to 3)
• 📦 Modern Dependencies:
  • Webpack 5 (from 4)
  • Storybook 7 (from 5)
  • Jest 29 (from 24)
  • ESLint 8 (from 5)
  • All Babel packages updated to latest
• ⚡ Performance: Modern build tools and optimizations
• 🧪 Testing: Updated to @testing-library/react 14
• 📱 Development: Modern development environment with latest tooling

# Install from GitHub (Recommended) npm install pmacom/react-transcript-editor # Or using yarn yarn add pmacom/react-transcript-editor # Or using pnpm pnpm add pmacom/react-transcript-editor

No more dependency conflicts! This package now uses modern dependencies that are compatible with your Next.js and other modern React applications.

# Install the original BBC package npm install @bbc/react-transcript-editor

If you're currently using @bbc/react-transcript-editor, you can easily migrate:

npm uninstall @bbc/react-transcript-editor npm install pmacom/react-transcript-editor

No code changes required - the API remains exactly the same!

• React: 18.2.0 (dev dependencies)
• Webpack: 5.101.0 (from 4.47.0)
• Storybook: 7.6.20 (from 5.2.2)
• Jest: 29.7.0 (from 24.9.0)
• ESLint: 8.57.0 (from 5.16.0)
• Babel: All packages updated to 7.23.9
• Testing Library: 14.3.1 (from 12.1.5)

• Webpack 5: Modern bundling with better performance
• CSS Modules: Improved styling system
• Modern Loaders: Updated to latest versions
• Tree Shaking: Better bundle optimization

• Storybook 7: Modern component development environment
• Jest 29: Faster, more reliable testing
• ESLint 8: Better code quality and modern rules
• pnpm: Faster, more efficient package management

import { TranscriptEditor } from 'react-transcript-editor'; function MyComponent() { return ( <TranscriptEditor transcriptData={yourTranscriptData} mediaUrl={yourMediaUrl} // ... other props /> ); }

# Install dependencies pnpm install # Start Storybook pnpm start # Run tests pnpm test # Build components pnpm run build:component

MIT - Same as the original package