Laioutr UI

B2B

The B2B package provides components and page templates for complex B2B e-commerce scenarios including employee management, order approvals, offers, budgets, and purchasing workflows.
The B2B package is currently under development. The components and templates described below represent the planned scope. Individual components will appear in this section as they become available.

Overview

The B2B package is designed for complex business-to-business e-commerce scenarios. It extends the core Laioutr UI with components and page templates optimized for structured purchasing workflows, account-based experiences, and multi-user organizations.

Where the core Laioutr UI covers general e-commerce patterns (product listings, cart, checkout), the B2B package adds the specialized patterns that B2B buyers and sales teams expect — from employee dashboards and approval flows to offer negotiation and budget tracking.

What to Expect

Account & Employee Management

Components for managing company accounts with multiple employees, roles, and permissions. This includes employee lists, invitation flows, role editors, and permission overviews — enabling self-service administration for B2B customers.

Order Approval Workflows

Templates for the full approval lifecycle: submitting carts for review, multi-step approval chains, approval dashboards with pending/approved/declined states, line item editing within approvals, and activity histories.

Offer Management

Components for creating, viewing, and negotiating offers (quotes). Includes offer detail views, offer-to-order conversion, document previews, and status tracking — supporting the back-and-forth negotiation process typical in B2B sales.

Budget & Cost Center Management

Dashboard components for defining and monitoring budgets with period-based limits (monthly, quarterly, yearly). Cost center assignment UI and spending overviews help organizations maintain financial control over purchasing.

Product Lists & Reordering

Enhanced list management components beyond standard wishlists — designed for B2B reorder scenarios, shared team lists, and quick-order workflows. Includes bulk add-to-cart, CSV import, and list sharing between employees.

Sales Representative Tools

Dedicated tools for sales representatives to manage their customer portfolio: customer overviews, order histories, sales statistics, activity logs, and fast-order interfaces for placing orders on behalf of customers.

Streamlined ordering components for experienced B2B buyers who know exactly what they need. Quick product search by SKU or customer product number, table-based ordering views, and bulk quantity entry.

Design Principles

All B2B components follow the same design system as the core Laioutr UI — using the same tokens, theming, and accessibility standards. They are built to be:

  • Composable — Use them as standalone components or combine them into full page templates via Laioutr Studio.
  • Themeable — All components respect the project's design tokens and can be styled to match any brand.
  • Data-agnostic — Components work with Laioutr's canonical types and can be connected to any backend via the orchestr layer.