pro editor -Download - pro editor -Quellcode herunterladen

Proeditor

Das ultimative Editor UI Framework und Komponenten

Englisch · 简体中文 · Changelog. Melden Sie Fehler an · Anfrage -Feature

Inhaltsverzeichnis

? Installation

Wichtig

Dieses Paket ist nur ESM.

Führen Sie den folgenden Befehl aus, um @ant-design/pro-editor zu installieren:

$ pnpm install @ant-design/pro-editor

Kompilieren Sie mit Next.js

Notiz

Fügen Sie transpilePackages: ['@ant-design/pro-editor'] zu next.config.js . Zum Beispiel:

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

? Verwendung

 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' ) ;
    } }
  />
) ;

Merkmale

Notiz

Front-End-Komponentenbibliotheken haben die Entwicklung revolutioniert und die Effizienz durch Größenordnungen und die Erhöhung der Benutzererfahrung gesteigert. So ausgereift auch Bibliotheken wie Ant Design (AntD) und Prokomponenten sind, man könnte sich fragen, ob noch Raum für Innovation übrig bleibt.

Ermächtigung von Merkmalen des Proditors

Notiz

Wir sehen uns Proeditor als grundlegende Bibliothek zur Bearbeitung von Komponenten vor, die mit AntD ähneln, damit Entwickler einfach komplexe interaktive Komponenten mit einer von Natur aus überlegenen Benutzererfahrung erstellen können. Dies ist die Begründung hinter dem ProEditor .

Unsere Prinzipien für den Proeditor:

Intuitiver Bearbeitung : Unterstützt natürliche Benutzerinteraktionen wie Mehrfachauswahl, Deaktivierung und Tastaturverknüpfungen, um ein reibungsloses Bearbeitungserlebnis zu gewährleisten.
Standardmäßig verfeinert : Verbessert die Komponenten der Ameise -Design, um ein überlegenes Benutzererlebnis mit mehr polnischer und Verfeinerung zu bieten.
? Offene Flexibilität : Bietet Funktionen auf Atomebene und bietet eine breite Palette von Komponenten, Haken und Versorgungsfunktionen für umfangreiche Anpassungen und Flexibilität.

UI -Framework- und Frontend -Komponentenlösungen im Feld Editor:

Tipp

Der Proeditor konzentriert sich auf die Erweiterung der Grenzen des realisierbaren und erweitert die Auswahl an Tools, die Entwicklern zur Konstruktion hoch entwickelter, interaktiver und benutzerorientierter Webanwendungen zur Verfügung stehen. Zum Beispiel:

? DraggablePanel : Ermöglicht die Interaktivität der Benutzeroberfläche mit setzbaren und beweglichen Panels.
Kolumnlist : bietet eine benutzerfreundliche sortierbare Liste an, die durch Spaltendefinitionen verwaltbar ist und komplexe Listen-Interaktionen vereinfacht.
? Freecanvas : Bietet eine zoombare Leinwand ähnlich wie bei Anwendungen wie Sketch oder Figma und bietet den Benutzern einen riesigen Raum für kreatives Design.
? IconPicker : Ein Symbolauswahl -Tool, das mit iConFont kompatibel ist und so eine breite Palette von Symbolen in das Design integrieren kann.
Online-Zusammenarbeit : Integriert Multi-User-Funktionen mit Technologien wie YJS und Zustand Store, wodurch die kollaborative Echtzeit-Bearbeitung und -interaktion ermöglicht werden.

Rahmenarchitektur

Proeditor ist strukturiert, um diese Prinzipien effektiv zu erleichtern.

? Showcase

Lassen Sie uns einige der Signaturkomponenten des Proditors vorstellen:

Draggablepanel	Kolumnliste
Für setzbare und bewegliche Panels	Eine benutzerfreundliche sortierbare Liste basierend auf Spaltendefinitionen

Freecanvas	Iconpicker
Eine grenzenlose, zoombare Leinwand, die einer Skizze oder Figma ähnelt	Ein Symbolauswahlwerkzeug, das mit iConfont kompatibel ist

Online -Zusammenarbeit
Multi-Benutzer-Funktionen, die in YJS und Zustand Store eingewickelt sind.

? Browserkompatibilität

Notiz

Moderne Browser und Internet Explorer 11 (mit Polyfills)
Elektron

Oder klonen Sie es für die lokale Entwicklung:

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

? Beitragen

Wichtig

Treten Sie unserem kollaborativen Ökosystem bei. Ihre Beiträge sind der Herzschlag unseres Projekts. So können Sie ein wesentlicher Bestandteil unserer lebendigen Community sein:

Integrieren und innovieren : Integrieren Sie Ant Design Pro, UMI und Proeditor in Ihre Projekte. Ihre reale Nutzung und Ihr Feedback sind für uns von unschätzbarem Wert.
Stimme deine Erkenntnisse : Begegnen Sie eine Panne? Eine Frage haben? Ihre Perspektiven sind wichtig. Teilen Sie sie durch, indem Sie Probleme einreichen und uns helfen, die Benutzererfahrung zu verbessern.
Form der Zukunft : Haben Sie Codeverbesserungen oder Feature -Ideen? Wir laden Sie ein, Pull -Anfragen vorzuschlagen und direkt zur Entwicklung unserer Codebasis beizutragen.

Jeder große oder kleine Beitrag wird gefeiert. Nehmen Sie an unserer Mission teil, die Welt der UI-Komponenten der Open-Source-Unternehmen zu verfeinern und zu erhöhen. ?

? ️ Ökosystem

Procomponents - Verwenden Sie für Anwendung auf Unternehmensebene Ameisendesign wie ein Pro!.
Proeditor - Der Ultimate Editor UI Framework und Komponenten.
Proflow - Eine Basis von Flow Editor Framework auf React -Flow.
Prochat - Komponentenbibliothek zum schnellen Erstellen von LLM -Chat -Schnittstellen.