getting started
no breaking changes

What's new in v3.

37 components for products: money and dates, lists and tables, filters, dashboards, charts, onboarding and chat. Nothing in 2.x breaks, so there is nothing to migrate: update the tokens, and add what you need.

let an agent do it

Copy this page as Markdown, with every new component and what it is for, and paste it into your agent inside the project.

view .md
Update
2 commands

The new tokens come with init: the chart palette, the height animation of the Accordion, and fields without code ligatures. Commit first: --overwrite replaces local edits.

terminal
bash
# the new tokens: the chart palette, the collapse animation, fields without ligatures
npx @entrepta/cli@latest init --theme=entrepta --overwrite

# the 2.x components that changed; keep the ones your project has
npx @entrepta/cli@latest add button input textarea card dialog tabs toast \
  command-palette code-block sidebar filter-pill rolling-number \
  mode-toggle theme-switcher status-bar top-nav use-mode use-theme --overwrite
Primitives
7 new
AvatarprimitivesA person or a thing as an image over its initials, with a presence dot and a stacked groupIconTileprimitivesAn icon in a tinted square, for a category, an account or a status, with a corner badgeSheetprimitivesA panel from the edge to create or edit without leaving the list, that asks before losing changesPopoverprimitivesA panel anchored to a trigger, for content you work in: a calendar, a filterAccordionprimitivesSections that open in place, with a trailing value in the header and actions beside itProgressprimitivesHow far along: a bar, a bar in steps or a ring, as a progressbar with its value in wordsStepperprimitivesWhere someone is in a flow: an ordered list, the current step with the diamond
Forms
11 new
MoneyInputformsMoney typed like a cash machine or freely, pasted in any format, held in minor unitsSelectformsA value from a short list, in a form, with the field's look and the menu's rowsComboboxformsA value from a long list you can search: groups, several values, create on the spotSegmentedControlformsOne choice out of a few, all in view, on native radios with a sliding indicatorChoiceCardformsA choice that needs more than a word: cards that are labels of native radios or checkboxesSwatchPickerformsA palette color by key, never a hex: native radios, each swatch named after its hueSecretFieldformsA secret to copy once: masked, revealed on request, copied with a polite confirmationFileDropzoneformsA real file input to drop on or choose from, checking type and size, listing progressCalendarformsA month of days to pick a day or a range from, in plain dates, on react-day-pickerDatePickerformsA day, a range, a month or a year, picked from a calendar in a popoverDateNavigatorformsPrevious, the period, next and today, to walk through days, months or years
Layout
2 new
MobileNavlayoutBottom bar with four destinations and More, which opens a sheetBentoGridlayoutDashboard tiles on the 12 column grid, each one a size container, entering in order
Data
12 new
AmountdataMoney shown one way everywhere: mono, tabular, the real minus, a muted symbolMetricdataOne number with its label, how it moved and against what; loads in its own shapeDeltadataHow a value moved: an arrow, a sign and the change, colored by whether that is good newsSparklinedataThe shape of a series with no axes, wiping in once on screen, for a Metric's trendChartdataThe frame for Recharts: palette colors, a tooltip in full values, a legend from three series, the data as a tableBarListdataA ranking in rows, each label in full on a bar as long as its share; server safeContributionGriddataA year of days as weeks, levels from the brand, one Tab stop walked by the arrowsRedactdataA value hidden behind a mask of its width when the app asks, read as hidden valueListRowdataThe standard row of a list, with a leading tile, a truncating title and a trailing valueTabledataA real table that scrolls in its own box, with a sticky header and numbers on the rightDataTabledataRecords to sort, select and hide columns in, on TanStack Table, virtualized past 500 rowsFilterBuilderdataFilters built from fields, each one an applied pill, kept in the URL with serializeFilters
Chat
2 new
PromptInputchatWhere a question is written: grows, sends on Cmd Enter, stops while streaming, suggestionsChatThreadchatA conversation by role, tool results in cards, streaming that keeps your place
Feedback
2 new
AlertfeedbackA notice that stays until it is dealt with, its status in a tile and the corner glowEmptyStatefeedbackA list or a widget with nothing in it: what is missing, and the one thing to do
Motion
1 new
SpotlightCardmotionA Card with the brand glow trailing the cursor, usable from a server page
Changed
11 changes

Everything below keeps its API. It only gained.

  • Theme and mode. A switch lands in one frame, crossfaded where the browser can, instead of piece by piece.
  • Sidebar. variant="labeled" with groups, a search slot, a footer and collapsible. It keeps the current item in view, and a labeled sidebar can be text only.
  • FilterPill. With onRemove it is an applied filter, with a × named after what it removes.
  • Amount, Metric, RollingNumber. They hide behind a mask when a RedactProvider asks.
  • Button. asChild works again, and Button, Input, Textarea, StatusBar and TopNav render on the server.
  • Sheet. container renders it inside a frame of your own.
  • Tabs. An icon tab keeps its name for screen readers on a phone.
  • CodeBlock. Scrolling the page over a block works again: it only holds sideways scrolls.
  • ChromeMessage. Takes headingLevel, for an error inside a layout that has its own h1.
  • Form fields. No code ligatures, which drew some typed slashes blank.
  • The CLI. Every write resolves inside the project, symlinks included, and --version tells the truth.
Active theme: entrepta, dark mode.