docyrus-app-ui-design
Docyrus App UI Design
Build polished, accessible UI components for Docyrus React applications using a curated set of 159 pre-built components from shadcn, diceui, animate-ui, docyrus-ui, and reui libraries.
Component Library Preferences
Primary component libraries (in order of preference):
- shadcn — 43 core components (buttons, forms, dialogs, tables, charts)
- diceui — 41 advanced components (data grids, kanban, file upload, color picker)
- animate-ui — 21 animated components (sidebar, dialogs, cards, menus)
- docyrus — 51 Docyrus-specific components (awesome dialog, awesome stats, data grid, pivot grid, form fields, value renderers, editable record detail, gantt, scheduling, chat, AI agents, pricing, sharing, email composer, log activity form, schema repeater, stepper)
- reui — 2 utility components (file upload, sortable)
Total available: 158 components
Critical Design Rules
More from docyrus/agent-skills
docyrus-api-dev
Develop applications using the Docyrus API with @docyrus/api-client and @docyrus/signin libraries. Use when building apps that authenticate with Docyrus OAuth2 (PKCE, iframe, client credentials, device code), make REST API calls to Docyrus data source endpoints, construct query payloads with filters, aggregations, formulas, pivots, and child queries, integrate with external connectors (discover connectors, send requests through provider auth, run actions), manage dev-app schema and saved views via the studio endpoints (data sources, fields, enums, data views, forms, webforms, HTML/PDF/DOCX export templates, email templates), wire up tenant automations (CRUD plus typed triggers and action nodes), or send transactional email through tenant messaging accounts. Triggers on tasks involving Docyrus API integration, @docyrus/api-client usage, @docyrus/signin authentication, data source query building, Docyrus REST endpoint consumption, connector discovery, external provider requests, automation CRUD, automation triggers (record-created/modified/deleted, recurrence, app-event, webhook, emailhook, webform, button-activation, manual-activation) and action nodes (external-action, send-email, send-notification, create-record, update-records, request-approval, request-input, http-request, data-source-query, custom-query, generate-document, ai-prompt, ai-agent, execute-script), tenant email account discovery, or sending email via `/v1/messaging/email`.
474docyrus-cli-app
Use the Docyrus CLI (`docyrus`) to interact with the Docyrus platform from the terminal. Use when the user asks to authenticate, list apps, query or manage data records (`ds`), manage dev app data source schema objects (`studio`) including data sources, fields, enums, data views, forms, webforms, HTML/PDF/DOCX export templates, and email templates, manage automations and their triggers/action nodes (`automation`), list tenant email accounts and send emails (`messaging`), send API requests, switch environments, tenants, or accounts, discover tenant OpenAPI specs, or use the Bun-powered terminal UI via `docyrus tui`. Triggers on tasks involving docyrus CLI commands, terminal-based Docyrus operations, `docyrus ds list`, `docyrus studio`, `docyrus studio data-view`, `docyrus studio form`, `docyrus studio webform`, `docyrus studio html-template`, `docyrus studio email-template`, `docyrus automation`, `docyrus automation create-trigger`, `docyrus automation create-node`, `docyrus messaging accounts`, `docyrus messaging email send`, `docyrus discover`, `docyrus auth`, `docyrus env`, `docyrus tui`, or shell-based Docyrus workflows.
430docyrus-app-dev
Build React TypeScript web applications using Docyrus as a backend. Use when creating or modifying apps that authenticate with Docyrus OAuth2, fetch/mutate data via the @docyrus/api-client library, use auto-generated collections for CRUD operations, or build queries with filters, aggregations, formulas, pivots, and child queries against Docyrus data sources. Triggers on tasks involving @docyrus/api-client, @docyrus/signin, Docyrus collections, data source queries, or Docyrus-backed React app development.
87docyrus-architect
Use the Docyrus Architect MCP tools to manage data sources, fields, enums, apps, custom queries, and query data in the Docyrus platform. Use when the user asks to create, update, delete, or query data sources, fields, enum options, apps, or custom query templates via the docyrus-architect MCP server. Also use when building reports, dashboards, or performing data analysis that requires querying Docyrus data sources or running custom SQL templates with filters, aggregations, formulas, pivots, or child queries.
75docyrus-api-doctor
Run after making Docyrus API changes to catch bugs, performance issues, and code quality problems. Use when implementing or modifying code that uses Docyrus collection hooks (.list, .get, .create, .update, .delete), direct RestApiClient calls, query payloads with filters/calculations/formulas/childQueries/pivots, or TanStack Query integration with Docyrus data sources. Triggers on tasks involving Docyrus API logic, data fetching, mutations, or query payload construction.
62docyrus-app-dev-react
Build Docyrus React TypeScript web applications end-to-end, combining authentication, API access, @docyrus/app-utils runtime helpers, generated collections, TanStack Query/Form patterns, and production-grade UI implementation with preferred component libraries. Use when creating or modifying Docyrus-backed apps that use @docyrus/api-client, @docyrus/signin, @docyrus/app-utils, Docyrus collections, queries, dashboards, forms, tables, layouts, or Docyrus UI components.
34