https://github.com/andersonsrocha/crispify
Crispify is a powerful Tiptap-based block text editing React component.
https://github.com/andersonsrocha/crispify
ant-design library react rich-text typescript
Last synced: 2 months ago
JSON representation
Crispify is a powerful Tiptap-based block text editing React component.
- Host: GitHub
- URL: https://github.com/andersonsrocha/crispify
- Owner: andersonsrocha
- License: mit
- Created: 2024-02-09T05:06:30.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-06-18T23:02:59.000Z (about 2 years ago)
- Last Synced: 2025-10-10T23:28:29.926Z (9 months ago)
- Topics: ant-design, library, react, rich-text, typescript
- Language: TypeScript
- Homepage: https://andersonsrocha.github.io/crispify/
- Size: 3.04 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
⌨️
crispify
Crispify is a powerful [Tiptap](https://tiptap.dev/)-based block text editing React component. The component has full integration with [Ant Design](https://ant.design/) and [Tailwind](https://tailwindcss.com/), taking advantage of its native theme and components.
> \[!NOTE]
>
> This project aims to offer an editor integrated with Ant Design to meet needs regarding rich-text editing. Product development is based solely on your needs, although everyone is welcome to try it out.
[](https://www.npmjs.com/package/@cygne/crispify)
[](https://bundlephobia.com/package/@cygne/crispify)
[](https://npmtrends.com/@cygne/crispify)
[](https://github.com/semantic-release/semantic-release)
Table of contents
#### TOC
- [📦 Installation](#-installation)
- [✨ Features](#-features)
- [🚀 Empowering Features](#-empowering-features)
- [🤝 Contributing](#-contributing)
- [📝 License](#-license)
####
## 📦 Installation
To install `@cygne/crispify`, run the following command:
```bash
$ npm install --save @cygne/crispify
```
## ✨ Features
- [x] ~~Helpful placeholders.~~
- [x] ~~Drop and paste HTML and text.~~
- [x] ~~Display grid in two columns with alignment.~~
- [x] ~~Changing font size.~~
- [x] ~~Paste from clipboard, upload, and drag and drop images.~~
- [x] ~~Executing slash commands.~~
- [x] ~~Table Component.~~
- [x] ~~Add new row.~~
- [x] ~~Add new column.~~
- [x] ~~Resize rows and columns.~~
- [x] ~~Markdown.~~
- [x] ~~Open in fullscreen.~~
- [x] ~~Mention component node.~~
- [ ] Comment component node.
## 🚀 Empowering Features
> \[!NOTE]
>
> Crispify is a rich-text editing component that integrates with your application. Here's what makes it exceptional:
- 🎨 **Tailwind**: Produced with the tailwindcss library, it has very simple and concise styling. The addition of tailwind offers the opportunity for very seamless customization using the Ant Design design system.
- 🚀 **Ant Design**: The addition of the Ant Design library gives you the opportunity to experience a rich-text editor directly integrated with your application's theme, enabling very consistent production.
- ⌨️ **Tiptap**: Building on top of the Tiptap library makes it a robust and easily customizable editor.
- 🎯 **Intuitive Usage**: Written with Typescript, its typing makes it intuitive to use.
- 💡 **Extensive editing**: With a series of features such as adding a table, uploading an image, block editing, marks such as bold, italics and underlining, alignment, lists and other functions.ected to empower applications across various scales and domains.
## 🤝 Contributing
> \[!IMPORTANT]
>
> Please feel more than invited to participate in the project and offer your suggestions.
- **Shape the Future**: Have code enhancements or feature ideas? We invite you to propose [pull requests][pr-welcome-link] and contribute directly to the evolution of the project.
[![][pr-welcome-shield]][pr-welcome-link]
## 📝 License
Copyright © 2024.
This project is [MIT](./LICENSE) licensed.
[pr-welcome-link]: https://github.com/andersonsrocha/crispify/pulls
[pr-welcome-shield]: https://img.shields.io/badge/%E2%9D%A4%EF%B8%8F%20PR%20WELCOME-%E2%86%92-1677FF?labelColor=black&style=for-the-badge