Edra
Fully controllable and best rich text editor for Svelte Developers
Overview:
ShadEditor is a rich text editor designed for Svelte with ShadCN UI, utilizing tiptap for seamless text editing. It provides a ready-to-use editor with features like rich text formatting, color pickers, tables, images, videos, code blocks, and more. The package is recommended to be installed using the CLI for easy setup and flexibility.
Features:
- Rich Text Editing: Utilize markdown shortcuts for quick formatting.
- Color Pickers: Choose text color or highlight with ease.
- Tables: Create, edit, and manage tables effortlessly.
- Images and Videos: Easily add and customize visuals into your content.
- Code Blocks: Syntax highlighting with support for multiple languages.
- Blockquotes and Links: Enhance your text with blockquotes and links.
- Lists and Search: Manage lists and perform text search within the editor.
- Drag and Drop: Rearrange content with auto joiner feature.
Summary:
ShadEditor is a feature-rich text editor for Svelte, simplifying the process of integrating a tiptap editor with ShadCN UI. With an array of formatting options, color pickers, media support, and more, ShadEditor provides a comprehensive solution for text editing needs. By following the recommended installation process using the CLI, users can quickly set up the editor for their projects while retaining flexibility for customization.
- Svelte
Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.
- Vite
Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects
- Tailwind
Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.
- Bits UI
Bits UI is a headless component library for Svelte that provides unstyled, accessible UI primitives. It powers shadcn-svelte and offers a foundation for building custom component libraries with full accessibility support in the Svelte ecosystem.
- Shadcn UI
Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
- Eslint
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.