@electroplix/components is now ready to use

COMPONENTS

Components

Components are modular building blocks for creating UI, logic, backend interactions, and data handling. They range from simple widgets — buttons and text fields — to complex data-driven modules and functional triggers. Every component is highly customizable through properties, styles, logic, and data bindings, and can be configured visually in the component editor.

Component Types

  • UI Components — Visual elements such as buttons, inputs, navigation, and layout primitives.
  • Logic Components — Control flow, conditional logic, and data processing.
  • Backend Components — Connect to your server for data, API calls, and authentication.
  • Custom and Marketing Blocks — Pre-designed sections, widgets, and promotional layouts.
  • Ecommerce Blocks — Product listings, carts, checkout, and payment flows.
  • User and Account Components — User management, dashboards, profile editing, and authentication flows.

Where Components Are Used

  • Design Editor (Dynamic Engine) — Drag and drop components onto the canvas and configure them in the property panel.
  • AI Builder — Prompt the AI to generate complete components, including logic and styles, then refine them visually.
  • API / Local — Develop custom components locally and upload them to your project library.
  • Enterprise-Wide Library — Shared libraries for maintaining design systems across teams and organizations.

Component Categories

1. Base Components

Essential building blocks for every interface — text, buttons, inputs, dropdowns, checkboxes, radio buttons, and more.

2. Advanced Components

Complex UI for data visualization and rich interactions: charts, maps, calendars, data tables, modals, and rich text editors.

3. Logic Components

Handle data flow, conditional logic, and calculations. Often invisible on the canvas but essential for app behavior — control flow, branches, and data transforms.

4. Backend Components

Connect to databases, APIs, and server-side services — including generated CRUD endpoints, Stripe, Firebase, and custom integrations.

5. Layout and Structure Components

Organize page structure with containers, grids, sections, navbars, footers, and responsive shells.

6. Data Display Components

Present data in lists, grids, cards, stats, and tables — typically wired to backend or API data sources.

7. User and Account Components

Login, signup, profile management, account settings, and user dashboards with role-aware views.

8. Marketing, Communication, and Utility Blocks

  • Blog and Article Blocks — Content layouts for blogs, news, and documentation-style pages.
  • Marketing and Promotion Blocks — Heroes, banners, CTAs, and promotional sections.
  • Commerce Blocks — Product listings, carts, checkout, and payment UI.
  • Help and Onboarding Blocks — FAQs, guided tours, tooltips, and onboarding flows.
  • Utility Blocks — Search bars, social sharing, notifications, and other helper widgets.