Inicio>Recursos para la creación de sitios web>Otros recursos
Descargar

Proeditor

El mejor marco y componentes de la interfaz de usuario del editor final



Inglés · 简体中文 · Changelog. Informe de error · Función de solicitud

Tabla de contenido

Tocarse

  • ? Instalación
    • Compilar con next.js
  • ? Uso
  • Características
    • Características de empoderamiento de proeditor
    • Arquitectura del marco
  • ? Escaparate
  • ? Compatibilidad del navegador
  • ⌨️ Desarrollo local
  • ? Que contribuye
  • ? ️ Ecosistema

? Instalación

Importante

Este paquete es solo ESM.

Para instalar @ant-design/pro-editor , ejecute el siguiente comando: 

$ pnpm install @ant-design/pro-editor

Compilar con next.js

Nota

Por el trabajo correcto con Next.js SSR, agregue transpilePackages: ['@ant-design/pro-editor'] a next.config.js . Por ejemplo: 

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

? Uso 

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

Características

Nota

Las bibliotecas de componentes frontales han revolucionado el desarrollo, aumentando la eficiencia por órdenes de magnitud y la elevación de la experiencia del usuario. Sin embargo, tan maduros como las bibliotecas como Ant Design (Antd) y los procomponentes, uno podría preguntarse si queda espacio para la innovación.


Características de empoderamiento de proeditor

Nota

Imaginamos Proeditor como la biblioteca fundamental para editar componentes, similar a Antd, lo que permite a los desarrolladores crear fácilmente componentes interactivos complejos con una experiencia de usuario inherentemente superior. Esta es la justificación detrás del ProEditor .

Nuestros principios para el proeditor:

  • ? ️ Edición intuitiva : admite interacciones naturales de usuario como múltiples selecciones, deselección y atajos de teclado, asegurando una experiencia de edición suave.
  • Refinado por defecto : mejora los componentes de diseño de hormigas para ofrecer una experiencia de usuario superior con más pulido y refinamiento.
  • ? Flexibilidad abierta : proporciona capacidades de nivel atómico, que ofrece una amplia gama de componentes, ganchos y funciones de utilidad para una amplia personalización y flexibilidad.

Soluciones de componentes de marco de interfaz de usuario y componentes frontend en el campo del editor:

Consejo

Proeditor se concentra en expandir los límites de lo factible y aumentar la variedad de herramientas disponibles para los desarrolladores para la construcción de aplicaciones web sofisticadas, interactivas y centradas en el usuario. Por ejemplo:

  • ? DraggablePanel : permite paneles residables y móviles, mejorando la interactividad de la interfaz de usuario.
  • ColumnList : ofrece una lista ordenable fácil de usar que es manejable a través de definiciones de columnas, simplificando interacciones complejas de la lista.
  • ? FreeCanvas : proporciona un lienzo amplio similar a aplicaciones como Sketch o Figma, lo que brinda a los usuarios un vasto espacio para el diseño creativo.
  • ? IconPicker : una herramienta de selección de iconos que es compatible con IconFont, lo que hace que sea más fácil integrar una amplia gama de iconos en el diseño.
  • Colaboración en línea : incorpora capacidades de usuarios múltiples utilizando tecnologías como YJS y Zustand Store, permitiendo la edición e interacción colaborativa en tiempo real.

Arquitectura del marco

Proeditor está estructurado para facilitar estos principios de manera efectiva.


? Escaparate

Exhibamos algunos de los componentes de la firma de Proeditor:

Draggablepanel Lista de columnas
Para paneles residables y móviles Una lista ordenable fácil de usar basada en definiciones de columna
Freecanvas Iconpicker
Un lienzo con zoomable ilimitado similar al bosquejo o figma Una herramienta de selección de iconos compatible con IconFont
Colaboración en línea
Capacidades de usuarios múltiples envueltos en la tienda YJS y Zustand.

? Compatibilidad del navegador

Nota

  • Navegadores modernos e Internet Explorer 11 (con polyfills)
  • Electrón

O clonarlo para el desarrollo local: 

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

? Que contribuye

Importante

Únase a nuestro ecosistema colaborativo. Sus contribuciones son los latidos de nuestro proyecto. Así es como puede ser una parte integral de nuestra comunidad vibrante:

  • Integrar e innovar : Incorpore Ant Design Pro, UMI y Proeditor en sus proyectos. Su uso y comentarios del mundo real son invaluables para nosotros.
  • Voz en tus ideas : ¿Encontrar un problema técnico? ¿Tienes una consulta? Tus perspectivas son importantes. Compártelos enviando problemas y ayúdanos a mejorar la experiencia del usuario.
  • Forma el futuro : ¿tienen mejoras de código o ideas de características? Lo invitamos a proponer solicitudes de extracción y contribuir directamente a la evolución de nuestra base de código.

Cada contribución, grande o pequeña, se celebra. Únase a nosotros en nuestra misión de refinar y elevar el mundo de los componentes de UI empresariales de código abierto. ?





? ️ Ecosistema

  • PROPONENTES : diseñado para la aplicación de nivel empresarial, use el diseño de hormigas como un Pro!.
  • Proeeditor : el mejor marco y componentes de UI del editor Ultimate.
  • Proflow : una base de marco del editor de flujo en React -Flow.
  • PROCHAT - Biblioteca de componentes para construir rápidamente interfaces de chat LLM.

Licencia

Copyright © 2023 - Presente AFX & Ant Digital.
Este proyecto tiene licencia MIT.

Expandir
Información adicional
  • Versión v1.3.0
  • Tipo Otros recursos
  • Fecha de actualización 2025-08-08
  • tamaño 547.41KB
  • Proviene de Github
Aplicaciones relacionadas
Recomendado para ti
Información relacionada Todo