Changelog

After a long and deliberate alpha, spartan/ui is now 1.0 . What started as 30 primitives has grown into a stable, production-ready library of accessible Angular components - built on signals, ready for zoneless, and compatible with server-side rendering out of the box.

Here's a quick overview of what 1.0 means:

• Production-ready and stable - a committed, semver-versioned API you can build on.
• Built for modern Angular - signals throughout, zoneless-ready, and SSR compatible.
• More than 55 components - nearly double the initial 30, including Data Table, Sidebar, Calendar, and Date Picker.
• Blocks - ready-made layouts for authentication, sidebars, and steppers.

Production-ready and stable

spartan/ui spent a long time in alpha so we could refine its APIs in the open. With 1.0 those APIs are stable: we follow semantic versioning, so you can depend on spartan/ui/brain and upgrade with confidence. The copy-in spartan/ui/helm layer stays yours to own and customize - exactly as before.

Built for modern Angular

Every primitive is built on Angular signals and standalone components. spartan is zoneless-ready and server-side-rendering compatible out of the box, so it fits cleanly into today's Angular applications without extra setup. You get maintained accessibility - ARIA, keyboard navigation, and focus management - through spartan/ui/brain , with full styling control through spartan/ui/helm .

More than 55 components

The initial alpha shipped with 30 primitives. 1.0 ships with more than 55, including many of the most requested additions:

• Data Table
• Sidebar
• Calendar
• Date Picker
• Carousel
• Autocomplete
• Pagination
• Breadcrumb

Browse the full set on the components page .

Blocks

Blocks are ready-made, fully responsive layouts built from spartan components. 1.0 includes authentication pages, sidebar layouts, and multi-step steppers you can drop into your app and customize. Explore them on the blocks page .

Getting started

New to spartan? There's never been a better time to start.

Support spartan

spartan is MIT-licensed and built in the open. If it saves you time, consider sponsoring its development - sponsorships fund ongoing maintenance, new components, and keeping spartan free for the whole Angular community.

spartan/ui is an open-source collection of an initial 30 UI primitives designed to streamline your development process and empower your Angular projects with enhanced efficiency and accessibility.

Why spartan/ui?

Creating seamless, captivating, and accessible user interfaces is hard. Through spartan/ui/brain , our goal is to make this process more straightforward and efficient. We offer a versatile collection of unstyled UI building blocks that can be easily tailored to match your project's distinct visual and functional preferences.

Additionally, with spartan/ui/helm , we provide pre-designed styles that not only look great from the start but also let you to retain full control over their code, appearance, and overall experience.

spartan/ui/brain

Each spartan/ui/brain represents a headless and accessible implementation of an UI primitive. This can be a standalone Angular Component, a Directive applied to existing HTML elements, or a hybrid combining both for more intricate UI elements.

This brain-first approach empowers developers to build UI components with enhanced accessibility and modularity, offering flexibility in crafting custom interfaces that cater to diverse project requirements.

spartan/ui/helm

On top of these brain components we put our helmet. Our helmet adds SPARTAN-like swagger to our UI.

Unlike it's brain counterparts, spartan/ui/helm primitives are not libraries. Instead, just like with shadcn, they are recipes, which code you can copy directly into your own project.

Powered by @spartan-ng/nx

To make this as easy as possible, spartan/ui comes equipped with an Nx plugin that allows you to effortlessly integrate our components into your Nx workspace. With a single command, you can add any of the 30 spartan/ui primitives to your projects.

But that's not all – the Nx plugin's capabilities extend beyond just adding components. You can also leverage it to incorporate one of 12 custom themes into your Nx applications, letting you truly own the visual appearance of your projects.

The initial 30

The initial 30 components we launch today are:

• Accordion
• Alert
• Alert Dialog
• Aspect Ratio
• Avatar
• Badge
• Button
• Card
• Collapsible
• Combobox
• Command
• Context Menu
• Dialog
• Dropdown Menu
• Input
• Icon
• Label
• Menubar
• Popover
• Progress
• Radio Group
• Scroll Area
• Separator
• Sheet
• Skeleton
• Switch
• Tabs
• Textarea (covered by hlmInput directive)
• Toggle
• Typography

Getting Started

Excited to try any of these? What are you waiting for? Head over to the installation page and start your spartan journey!