Getting Started

Changelog

All notable changes can be found in this changelog.

Changes labeled BuilderKit are changes to the core library. Blocks and templates are built on the core, so these changes apply to them as well and are not listed again under their own labels.

4.0.0 (2026-10-06)
Breaking
  • All: Angular 22.2 is now required. Templates and host bindings read private class members.
  • All: The browser compatibility requirement is raised to Baseline 2026.
  • All: Class merging now uses cn instead of clsx and tailwind-merge. The bui helper is unchanged. If you import clsx, tailwind-merge or the ClassValue type directly, import from cn instead.
  • BuilderKit: The WINDOW token is now typed as Window | null and resolves to null on the server instead of a partial DOM emulation. If you inject WINDOW and dereference it during server rendering, add an explicit null check or move the access into a browser-only callback such as afterNextRender. To read the request URL during SSR, use the injected DOCUMENT's location instead.
  • BuilderKit: The sidebar button group is renamed from bui-sidebar-menu-button to bui-sidebar-button.
  • BuilderKit: The dialog and sheet roots now set data-slot instead of data-state.
  • BuilderKit: Click and animation handlers on the child directives of advanced components are now private. Use the root directive for programmatic access.
  • BuilderKit: Form fields keep their font size on small screens; --form-field-mobile-font-size opts in to the 16px iOS zoom workaround
Added
  • Agent skill for AI-driven project setup, Core updates and block usage, installable with npx skills add
  • Design guidelines document for AI agents
  • BuilderKit: Barrel export for MockServer
  • BuilderKit: Non-stretched tabs by default via MAT_TABS_CONFIG
  • BuilderKit: 32px default progress spinner size via MAT_PROGRESS_SPINNER_DEFAULT_OPTIONS
  • BuilderKit: BuiAlert advanced component with composable slot directives, appearance and tone variants and dismiss behavior
  • BuilderKit: BuiColorPicker advanced component with saturation, hue and alpha sliders, hex input, screen eyedropper, palette and recent colors
  • BuilderKit: BuiCombobox advanced component, a select only combobox with a button trigger, optional panel search, multi select, option groups and panel actions
  • BuilderKit: hasBackdrop input on BuiPopover for backdrop-less popovers with click-through outside clicks
  • BuilderKit: Nested color schemes, scheme-dark and scheme-light regions can be nested and the nearest region wins
  • BuilderKit: small and tiny sizes for form fields, matching the button scale
  • BuilderKit: Buttons can now be joined into a single control with the button-group class
  • BuilderKit: Button toggle groups can now be styled as a segmented control with the segmented class
  • BuilderKit: Buttons can now collapse to icon only, responsively, with the icon-only class
  • BuilderKit: Viewport scroller that honors CSS scroll margin on anchors and supports scrolling elements
  • BuilderKit: MockServer handles requests to the base URL itself with a / handler
  • BuilderKit: Added spread button modifier
  • BuilderKit: Popovers can match their trigger width with --popover-anchor-width
  • Blocks: 89 new blocks across alerts, activity feeds, description lists, dialogs, empty states, error pages, grid lists, onboarding, page headers, password reset forms, popovers, rail layouts, settings, sign-in forms, sign-up forms, stacked layouts, stats, steppers, tables, team management, toolbars, verification forms and sidebar navigation
  • Fuse: New admin template
  • Horizon: New help desk template, replacing the previous Horizon
Changed
  • All: Replaced physical direction classes with logical ones for better RTL support
  • All: Refined shadows and elevation across the Material component styles
  • All: Updated Lucide icons, the trash-2 icon is now named trash
  • All: Updated dependencies across all products
  • BuilderKit: LocalStorage resolves the native storage through the WINDOW token instead of the localStorage global, and stays inert when no native storage is reachable, writes are dropped and reads return null instead of throwing
  • BuilderKit: Smaller, simplified easing implementation for palette generation with identical output
  • BuilderKit: Default border radius increased to 0.5rem
  • BuilderKit: Refined filled card appearance
  • BuilderKit: Buttons keep their hover appearance while an attached menu or popover is open
  • BuilderKit: Sidebar actions keep their hover appearance while an attached menu or popover is open
  • BuilderKit: More efficient skeleton shimmer animation
  • BuilderKit: Sidebar label and icon styles inside section headers and actions are now overridable
  • BuilderKit: Multi select options show a check mark instead of a checkbox
  • BuilderKit: Refined option and option group styles, hover and active states, group spacing and dividers
  • BuilderKit: kbd border radius now derives from the theme border radius
  • BuilderKit: kbd prefixes and suffixes scale down inside tiny form fields
  • BuilderKit: Refined chip appearance, smaller chips with adjusted colors and spacing
  • BuilderKit: Chip action buttons now highlight on hover with color instead of a background
  • BuilderKit: Popover follows its anchor when the anchor resizes
  • BuilderKit: Popover content uses the menu radius by default and exposes --popover-border-radius
  • BuilderKit: Menu, select, autocomplete, datepicker and timepicker panels open and close with the popover animation
  • BuilderKit: Form field keyboard focus ring matches the other controls
  • BuilderKit: Select and submenu arrows use the chevron icon
  • BuilderKit: Dialog headers use tighter spacing and a larger title
  • BuilderKit: Sheets use a larger title
  • BuilderKit: Thin scrollbars by default where supported
  • BuilderKit: Sidenav no longer shows a scrollbar
  • BuilderKit: MockServer only handles requests whose URL starts with baseURL
  • BuilderKit: MockServer ignores trailing slashes in request URLs
  • BuilderKit: Lucide icon styles only apply to icons without a namespace
  • BuilderKit: Updated table print styles
  • Blocks: Merged profile and notification settings blocks into a single settings block
  • Blocks: Demo asset paths moved into the data arrays
  • Blocks: Replaced demo brand logos with a standard icon monogram
  • Blocks: Removed docs-only theme classes
  • Blocks: Clearer multi-select wording on the onboarding company step
  • Blocks: Moved the team management table block into the new tables blocks
  • Blocks: Moved the stats overview cards grid list block into the new stats blocks
  • Blocks: Sheet blocks use the default sheet title style
  • Blocks: Tag and status pills use a single borderless style
  • Blocks: Sidebar navigation row actions stay keyboard reachable while hidden and reveal on focus
  • Spark: Route preloading enabled via withPreloading(PreloadAllModules)
  • Spark: Hydration event replay enabled via withEventReplay()
Fixed
  • BuilderKit: Large selects rendered taller than large form fields
  • BuilderKit: Form field error state was hidden while focused
  • BuilderKit: Dialog, popover and sheet could get stuck when reopened during the close animation
  • BuilderKit: Overlays never finished closing when exit animations were disabled or removed
  • BuilderKit: Descendant animations could end overlay close tracking early
  • BuilderKit: Dialogs, sheets and popovers left a click-blocking backdrop behind when a route change destroyed them while open
  • BuilderKit: Wrong data-slot on dialog close and sheet trigger; dialog footer group class
  • BuilderKit: LocalStorage.clear() threw during server rendering due to a missing early return
  • BuilderKit: LocalStorage.length always returned 0 in the browser
  • BuilderKit: LocalStorage threw when the platform is browser but no native localStorage exists, e.g. Node 26 test environments or sandboxed iframes
  • BuilderKit: not-prose content inherited the prose font size and line height
  • BuilderKit: Missing display on the select host element
  • BuilderKit: MockServer handler for a path also answered longer paths, /users answered /users/4
  • BuilderKit: MockServer threw on relative request URLs
  • BuilderKit: LocalStorage threw when the browser denies access to storage
  • Blocks: Missing MatListItemLine imports on sidebar layout blocks
  • Blocks: Command palette options were selected on keyboard focus instead of explicit selection
  • Blocks: Price filter inputs missing type="number"
  • Blocks: Unused FormsModule and redundant MatTable imports
  • Blocks: Wrong alt text on the onboarding illustration
  • Blocks: Sidebar layout items warned about list lines used without titles
3.1.0 (2026-07-31)
Breaking
  • Add support for lazy-rendered menus. Angular Material adds an unmarked div wrapper around the menu content when using matMenuTriggerFor with matMenuContent. This wrapper can cause issues with styling and positioning of the menu. If you use div elements inside your menu content as the first child, either replace it with a span or add .not-mat-menu-wrapper class to the div element to prevent it from being wrongly targeted. This is only an issue if you have a div element inside your menu content as the first child.
Added
  • Angular v22.1 support
  • BuilderKit: Configurable border radius via Theming provider
Changed
  • All: Updated dependencies across all products
  • BuilderKit: Migrated left-right selectors to start-end/block-inline selectors for better RTL support
3.0.0 (2026-06-11)
Added
  • Angular v22 support
  • BuilderKit: Support for MatProgressSpinner in Buttons
  • BuilderKit: Support for custom loaders in Buttons
Changed
  • All: Replaced @Injectable({ providedIn: 'root' }) decorators with the new @Service() decorator
  • All: Updated dependencies across all products
2.7.0 (2026-05-08)
Breaking
  • A recent Angular CLI update introduced trustProxyHeaders option for SSR engine. If your application is using SSR and running behind a reverse proxy setup, you must correctly set this option, otherwise the application may not work properly in production environments. If you don't have a reverse proxy setup, you can safely ignore this change.
Added
  • BuilderKit: MockServer core service for creating mock APIs
  • BuilderKit: BuiSkeleton directive for skeleton loading states
  • Orbit: New landing template
Fixed
  • BuilderKit: Wrong border-radius on BuiPopover
  • Horizon: FullCalendar v7.0.0-rc.2 breaking changes
2.6.0 (2026-04-13)
Added
  • BuilderKit: Ability to anchor BuiPopover to elements other than the trigger
  • BuilderKit: Ability to update anchor and position of BuiPopover on the fly
  • BuilderKit: buiPopoverClose directive to close popovers from inside the popover content
  • BuilderKit: closeOnScroll input on BuiPopover to automatically close popovers when scrolling occurs
  • Horizon: Calendar app powered by FullCalendar
  • Horizon: "New Task" and "Task Details" dialogs
  • Horizon: Appearance tab on Settings to showcase theming capabilities of BuilderKit
Changed
  • All: Updated dependencies across all products
  • BuilderKit: Properly export BuiDialog, BuiPopover & BuiSheet directives using exportAs for better template reference support
  • BuilderKit: Less strict fallback positions on BuiPopover to prevent positional flickering
  • BuilderKit: Improved type="color" input styles
  • BuilderKit: Better null checks and protections against low chroma and hueless colors on palette generator
  • BuilderKit: Removed "tw-animate-css" library and moved its CSS animations to BuilderKit's base styles
  • Horizon: Renamed "actions-panel" to "action-panel"
  • Horizon: Replace Status filter mat-menu with BuiPopover in Audit logs
  • Horizon: Replace Customize mat-menu with BuiPopover in Audit logs
Fixed
  • BuilderKit: Removed classes from BuiPopover & BuiCollapsible triggers that cause styling issues on buttons
  • BuilderKit: Removed unnecessary, premature cleanup codes from BuiDialog, BuiPopover & BuiSheet
  • BuilderKit: BuiPopover panel dimensions are changing on re-positioning
  • BuilderKit: Theming service cannot update colors on the fly due to broken style element reference
  • BuilderKit: Wrong icon color on "primary destructive" buttons
  • BuilderKit: Low chroma and hueless colors break palette generation
  • BuilderKit: Broken "tw-animate-css" animations on Firefox due to incorrect whitespace stripping
  • Horizon: Sidebar navigation data modifications persists across reloads
2.5.0 (2026-03-27)
Breaking
  • BuilderKit: AlertDialog, Collapsible, Sheet & Sidebar components have been replaced with directives. You can keep the old components, but it's recommended to switch to the new directives for better flexibility, accessibility, and performance. Check the updated documentation for more details and examples.
Added
  • BuilderKit: Dialog directives
  • BuilderKit: Collapsible directives
  • BuilderKit: Popover directives
  • BuilderKit: Sidebar directives
  • BuilderKit: Sheet directives
  • Blocks: Dialog blocks
  • Blocks: Popover blocks
  • Blocks: Nested alert dialog block
Changed
  • BuilderKit: Updated Lucide icons
  • BuilderKit: Updated Inter font
  • Blocks: Updated blocks to use new directives
  • Spark: Use formRoot and submission on signal forms
  • Spark: Reverted (pointerdown) inputs back to (click) due to accessibility and timing issues
  • Horizon: Use "formRoot" and "submission" on signal forms
  • Horizon: Reverted (pointerdown) inputs back to (click) due to accessibility and timing issues
  • Horizon: Replaced mat-menu usage in users table customization with Popover directives
  • Updated dependencies across all products
2.4.0 (2026-02-24)
Breaking
  • A recent Angular CLI update requires adding the allowedHosts option under the security section in your angular.json configuration. Failure to do so will prevent the application from working properly in production environments. You can learn more about this in the Angular documentation.
Changed
  • BuilderKit: Explicitly set label and sub-label font sizes on mat-stepper
  • BuilderKit: Improve structure on UI components
  • BuilderKit: Updated lucide icons
  • Updated dependencies across all products
2.3.0 (2026-02-11)
Added
  • Horizon: Sign up page
  • Horizon: Forgot password page
  • Horizon: Reset password page
  • Horizon: Email update dialog for Account Settings page
Changed
  • BuilderKit: Replaced Alert Dialog (click) inputs with (pointerdown)
  • Spark: Replaced (click) inputs with (pointerdown)
  • Spark: Replaced Reactive forms on Sign In page with Signal forms
  • Horizon: Replaced (click) inputs with (pointerdown)
  • Horizon: Replaced Reactive forms on Sign In page with Signal forms
Fixed
  • Horizon: User details sheet scrolling
2.2.0 (2026-02-05)
Added
  • Sheet component
  • Blocks: Stats overview cards block
  • Blocks: Sheet blocks
Changed
  • Horizon: Replace mat-dialog with sheet component in user details
Fixed
  • BuilderKit: mat-expansion-panel is not correctly styled when used outside mat-accordion
2.1.0 (2026-01-29)
Added
  • Horizon: Initial release for Angular v21
Fixed
  • BuilderKit: Remove min-height from base styles
2.0.3 (2026-01-13)
Added
  • Alert Dialog component
  • Different style for 'filled' appearance of MatCard
  • Backdrop blur for MatDialog
  • Blocks: Alert Dialog blocks
Fixed
  • Inconsistent and wrong name for 'collapsable' component. You must now use 'collapsible' instead.
2.0.2 (2026-01-06)
Changed
  • Spark: Simplified project structure
2.0.1 (2025-12-01)
Added
  • Collapsable component
  • Sidebar component
  • Blocks: Sidebar navigation blocks
  • Blocks: Sidebar panel blocks
Changed
  • Improved Angular Aria support
2.0.0 (2025-11-23)
Changed
  • Angular v21 support
  • Blocks: Improved text overflow handling with truncate
  • Blocks: Improved formatting
1.1.0 (2025-11-04)
Added
  • Blocks: Initial release
Changed
  • BuilderKit: Simplified project structure and tooling
  • Spark: Simplified project structure and tooling
1.0.0 (2025-07-16)
Added
  • BuilderKit: Initial release for Angular v20
  • Spark: Initial release for Angular v20