Introduction

EnterUI is the component system for building consistent product interfaces. The primary package serves React and Next.js product work across forms, tables, shell navigation, admin pages, dashboards, settings, workflow, and analytics. A separate SolidJS renderer serves Solid apps that need the same visual contract without React runtime dependencies.

FroggDesign is the visual language behind consistent product interfaces. It owns the token model and theme variables. EnterUI owns the renderer APIs, component CSS, .eui-* classes, accessibility wrappers, and docs.

#Positioning

EnterUI is designed around one practical promise: beautiful by default, flexible by design.

• Defaults should be production-ready without heavy local styling.
• Components are class-based and CSS-variable-first.
• Public exports are treated as package contracts.
• APIs are additive by default; breaking changes require explicit release planning.
• Tailwind can be used through className, but it is never required.
• Complex behavior uses focused accessibility primitives where that is the right tradeoff.

#Package Model

#Component Scope

EnterUI currently documents 190 canonical component pages. Public alias exports such as Drawer, DateInput, PinInput, TokenInput, Dropzone, Timeline, KeyValueList, Divider, AttachmentList, ObjectDetail, and StepperProgress are documented on their underlying component pages instead of separate alias pages.

The component surface includes:

• Core controls and typography.
• Form, validation, masking, URL, currency, date, recurrence, and schedule inputs.
• Menus, overlays, command surfaces, and focus-managed interactions.
• Tables, grids, saved views, sorting, density, column visibility, bulk editing, and filtering.
• SaaS shell primitives such as WorkspaceSwitcher and AppSwitcher.
• Workflow components such as ActivityTimeline, ReleaseStepper, AgendaList, KanbanBoard, and TransferList.
• Lightweight SVG analytics such as LineChart, AreaChart, StackedBarChart, Heatmap, TrendIndicator, and ComparisonMetric.

#Design Direction

EnterUI follows the FroggDesign rule: less green, more precision. Neutral charcoal, slate, and white surfaces carry the interface. Green is reserved for small success, selected, or brand signals. Components should feel calm and useful in dense product workflows.

#When To Use EnterUI

Use EnterUI when you need a component system that feels like a mature product library, supports React, Next.js, and SolidJS renderer paths, remains portable across styling stacks, and can be themed through stable CSS variables.