Unduh pro editor - Unduh Kode Sumber pro editor

Proeditor

Kerangka dan komponen UI UTLITED EDITOR

Bahasa Inggris · 简体中文 · Changelog. Laporkan Bug · Fitur Permintaan

Daftar isi

? Instalasi

Penting

Paket ini hanya ESM.

Untuk menginstal @ant-design/pro-editor , jalankan perintah berikut:

$ pnpm install @ant-design/pro-editor

Kompilasi dengan Next.js

Catatan

Dengan bekerja dengan benar dengan SSR Next.js, tambahkan transpilePackages: ['@ant-design/pro-editor'] ke next.config.js . Misalnya:

 const nextConfig = {
  transpilePackages : [ '@ant-design/pro-editor' , 'leva' , 'zustand' ] ,
} ;

? Penggunaan

 import { SmileOutlined } from '@ant-design/icons' ;
import { ActionIcon } from '@ant-design/pro-editor' ;

export default ( ) => (
  < ActionIcon
    title = { 'Function button description' }
    icon = { < SmileOutlined /> }
    onClick = { ( ) => {
      alert ( 'Trigger action' ) ;
    } }
  />
) ;

Fitur

Catatan

Perpustakaan komponen front-end telah merevolusi pengembangan, meningkatkan efisiensi atas perintah besarnya dan meningkatkan pengalaman pengguna. Namun, yang matang seperti perpustakaan seperti Ant Design (ANTD) dan prokomponen, orang mungkin bertanya -tanya apakah ada ruang yang tersisa untuk inovasi.

Memberdayakan fitur ProEditor

Catatan

Kami membayangkan ProEditor sebagai perpustakaan dasar untuk mengedit komponen, mirip dengan ANTD, memungkinkan pengembang untuk dengan mudah membuat komponen interaktif yang kompleks dengan pengalaman pengguna yang secara inheren unggul. Ini adalah alasan di balik ProEditor .

Prinsip kami untuk Proeditor:

? ️ Pengeditan intuitif : Mendukung interaksi pengguna alami seperti multi-seleksi, pemilihan, dan pintasan keyboard, memastikan pengalaman pengeditan yang lancar.
Disempurnakan dengan default : Meningkatkan komponen desain semut untuk memberikan pengalaman pengguna yang unggul dengan lebih banyak polesan dan penyempurnaan.
? Open Fleksibilitas : Memberikan kemampuan tingkat atom, menawarkan berbagai komponen, kait, dan fungsi utilitas untuk kustomisasi dan fleksibilitas yang luas.

UI Framework dan Frontend Component Solutions di bidang Editor:

Tip

Proeditor berkonsentrasi pada memperluas batas yang layak dan menambah berbagai alat yang tersedia untuk pengembang untuk pembangunan aplikasi web yang canggih, interaktif, dan berpusat pada pengguna. Misalnya:

? DraggablePanel : Memungkinkan panel yang dapat diputar ulang dan bergerak, meningkatkan interaktivitas antarmuka pengguna.
Daftar Kolom : Menawarkan daftar sortir yang dapat diurutkan dengan pengguna yang dapat dikelola melalui definisi kolom, menyederhanakan interaksi daftar kompleks.
? Freecanvas : Menyediakan kanvas yang dapat diperbesar yang mirip dengan aplikasi seperti Sketch atau Figma, memberi pengguna ruang yang luas untuk desain kreatif.
? IconPicker : Alat pemilihan ikon yang kompatibel dengan Iconfont, membuatnya lebih mudah untuk mengintegrasikan berbagai ikon ke dalam desain.
Kolaborasi Online : Menggabungkan kemampuan multi-pengguna menggunakan teknologi seperti YJS dan Zustand Store, memungkinkan pengeditan dan interaksi kolaboratif waktu nyata.

Arsitektur Kerangka

Proeditor disusun untuk memfasilitasi prinsip -prinsip ini secara efektif.

? Memamerkan

Mari kita tunjukkan beberapa komponen tanda tangan ProEditor:

DraggablePanel	Daftar Kolom
Untuk panel yang dapat diputar ulang dan dapat dipindahkan	Daftar sortir yang ramah pengguna berdasarkan definisi kolom

Freecanvas	IconPicker
Kanvas yang dapat diperbesar tanpa batas yang mirip dengan sketsa atau figma	Alat pemilihan ikon yang kompatibel dengan Iconfont

Kolaborasi online
Kemampuan multi-pengguna yang dibungkus dengan toko YJS dan Zustand.

? Kompatibilitas browser

Catatan

Browser Modern dan Internet Explorer 11 (dengan Polyfills)
Elektron

Atau mengkloningnya untuk pengembangan lokal:

$ git clone https://github.com/ant-design/pro-editor.git
$ cd pro-editor
$ pnpm install
$ pnpm dev

? Berkontribusi

Penting

Bergabunglah dengan ekosistem kolaboratif kami. Kontribusi Anda adalah detak jantung dari proyek kami. Inilah cara Anda dapat menjadi bagian integral dari komunitas kami yang bersemangat:

Integrasi dan Inovasi : Menggabungkan Ant Design Pro, UMI, dan Proeditor ke dalam proyek Anda. Penggunaan dan umpan balik dunia nyata Anda sangat berharga bagi kami.
Voice Your Insights : temui kesalahan? Punya pertanyaan? Perspektif Anda penting. Bagikan dengan mengirimkan masalah dan bantu kami meningkatkan pengalaman pengguna.
Bentuk Masa Depan : Punya peningkatan kode atau ide fitur? Kami mengundang Anda untuk mengusulkan permintaan tarik dan berkontribusi langsung ke evolusi basis kode kami.

Setiap kontribusi, besar atau kecil, dirayakan. Bergabunglah dengan kami dalam misi kami untuk memperbaiki dan mengangkat dunia komponen UI perusahaan open-source. ?

? ️ Ekosistem

Prokomponen - Dirancang untuk aplikasi tingkat perusahaan, gunakan desain semut seperti pro!.
ProEditor - Kerangka dan Komponen UI Editor Utama.
Proflow - Basis kerangka kerja editor aliran pada reaksi -aliran.
Prochat - Pustaka Komponen untuk dengan cepat membangun antarmuka obrolan LLM.