Arc Rider Docs · Markdown

Introduction

Componentes React

Componentes React

Estos componentes están en <a href="https://www.npmjs.com/package/@arcrider/arcwidgets-react">@arcrider/arcwidgets-react en npm</a>, versión 0.1.0-alpha.5. Impórtalos directamente del paquete. Estilos y tipos de TypeScript se incluyen.

¿Nuevo aquí? Empieza con <a href="/docs/react/intro/setup-react">instalación y el primer widget</a>.

Widgets de negocio

  • ArcWidgetTable — <a href="/docs/react/widgets/custom-table">Table</a>
  • ArcWidgetKanban — <a href="/docs/react/widgets/custom-kanban">Kanban</a>
  • ArcWidgetCalendarWeek — <a href="/docs/react/widgets/custom-calendar-week">Calendar Week</a>
  • ArcWidgetCalendarGrid — <a href="/docs/react/widgets/custom-calendar-grid">Calendar Grid</a>
  • ArcWidgetCalendarTimeline — <a href="/docs/react/widgets/custom-calendar-timeline">Calendar Timeline</a>
  • ArcWidgetDrawing — <a href="/docs/react/widgets/custom-drawing">Drawing</a>
  • ArcWidgetUpload — <a href="/docs/react/widgets/custom-upload">Upload</a>
  • ArcWidgetSlideshow — <a href="/docs/react/widgets/custom-slideshow">Slideshow</a>

Mini widgets

  • ArcWidgetBadge — <a href="/docs/react/mini-widgets/badges">Badge</a>
  • ArcWidgetButton — <a href="/docs/react/mini-widgets/buttons">Button</a>
  • ArcWidgetDevTools — <a href="/docs/react/widgets/custom-dev-tools">DevTools</a>
  • ArcWidgetIcon — <a href="/docs/react/mini-widgets/custom-icon">Icon</a>
  • ArcWidgetInput — <a href="/docs/react/mini-widgets/input">Input</a>
  • ArcWidgetKpiBar — <a href="/docs/react/widgets/custom-kpi-bar">KPI Bar</a>
  • ArcWidgetLayout — <a href="/docs/react/widgets/custom-layout">Layout</a>
  • ArcWidgetNumpad — <a href="/docs/react/widgets/custom-numpad">Numpad</a>
  • ArcWidgetProgressBar — <a href="/docs/react/mini-widgets/progress-bar">Progress Bar</a>
  • ArcWidgetSelect — <a href="/docs/react/mini-widgets/select">Select</a>
  • ArcWidgetSignature — <a href="/docs/react/mini-widgets/signature">Signature</a>
  • ArcWidgetSlider — <a href="/docs/react/widgets/custom-slider">Slider</a>
  • ArcWidgetSteps — <a href="/docs/react/widgets/custom-steps">Steps</a>
  • ArcWidgetText — <a href="/docs/react/mini-widgets/text">Text</a>

Configuración y eventos

Cada widget tiene su propio formato data y un tipo TypeScript correspondiente. Una tabla usa table, un tablero Kanban usa swimlanes. Usa los tipos de tu versión del paquete para comprobar la configuración.

Las callback props conectan las interacciones con tu aplicación. En Kanban, por ejemplo, onItemClick y onItemDrop. El fallback genérico es onAction(type, ...args); el primer argumento es el nombre del evento, no un objeto de acción.

Las referencias React incluyen ejemplos completos, parámetros, firmas de callback y límites conocidos. El acceso a datos y el guardado los implementas con tu estado React y tu API. Las fuentes de todos los ejemplos están en el paquete bajo examples/docs/.

Licencia y actualizaciones

Los mini widgets son gratuitos en producción según las condiciones de uso. Los widgets premium puedes usarlos para desarrollo y evaluación; el uso productivo necesita una licencia de proyecto. Detalles: <a href="/docs/react/faq/react-paket-und-lizenzierung">Paquete React y licencias</a>.

La versión es una alfa. Al actualizar, comprueba tipos, nombres de callback y tus propios flujos.