Skip to content

Changelog

  • add badge variants
  • split page structure guide into layout and page-composition sections
  • lead component pages with a representative preview
  • add sortable column headers
  • merge PageContent into Page and support full-bleed page content

redesign Pagination as a compact button-based pagination

Section titled “redesign Pagination as a compact button-based pagination”

PaginationLink and PaginationEllipsis are removed. PaginationPrevious and PaginationNext are now icon-only buttons (no href, no text label). Use PaginationLabel to show page position instead of numbered PaginationLink items.

  • redesign Pagination as a compact button-based pagination

require PageHeader and PageContent inside AppLayoutMain

Section titled “require PageHeader and PageContent inside AppLayoutMain”

AppLayoutMain no longer pads its content; render a PageHeader and a PageContent as its direct children and put the page’s content inside PageContent.

  • complete PageHeader sub-component JSDoc
  • add PageHeader live preview
  • add PageHeader, PageContent, and TabsNav components
  • require PageHeader and PageContent inside AppLayoutMain
  • keep TabsNav scroll position across unrelated re-renders
  • add Filter composition trees and tighten prose
  • add Filter component

Drawer now uses Base UI and the matching API consistent with other components.

Icon was renamed upstream: CircleEuroSignIcon -> CircleEuroIcon

Drawer no longer renders a swipe handle unless showSwipeHandle is set.

DropdownMenuPortal is no longer exported from @falcon/ui-kit.

DialogOverlay and DialogPortal are no longer exported

Toaster no longer accepts dir=“rtl”.

  • add prop descriptions to published package docs
  • improve Accordion documentation
  • improve Alert documentation
  • improve AlertDialog documentation
  • improve AppHeader documentation
  • improve AppLayout documentation
  • improve Badge documentation
  • improve Breadcrumb documentation
  • improve ButtonGroup documentation
  • improve Button documentation
  • improve Calendar documentation
  • improve Card documentation
  • improve Checkbox documentation
  • improve Collapsible documentation
  • improve Combobox documentation
  • improve Dialog documentation
  • improve Drawer documentation
  • improve DropdownMenu documentation
  • improve Empty documentation
  • improve FalconProvider documentation
  • improve Field documentation
  • improve HoverCard documentation
  • improve InputGroup documentation
  • improve Input documentation
  • improve Item documentation
  • improve Label documentation
  • improve NativeSelect documentation
  • improve Pagination documentation
  • improve Popover documentation
  • improve RadioGroup documentation
  • improve Select documentation
  • improve Separator documentation
  • improve Sheet documentation
  • improve Sidebar documentation
  • improve Spinner documentation
  • improve Switch documentation
  • improve Table documentation
  • improve Tabs documentation
  • improve Textarea documentation
  • improve Toaster documentation
  • improve Tooltip documentation
  • improve Page structure documentation
  • align Drawer interactions
  • remove DropdownMenuPortal export
  • support indeterminate Checkbox state
  • simplify Dialog composition
  • get rid of vaul dependency
  • update lucide-react to 1.28.0
  • inherit Button text color
  • correct Combobox controls and layout
  • preserve valid FieldError children
  • use InputGroup radius tokens
  • set Item list semantics
  • remove RTL Toaster support
  • forward ref from InputGroupAddon
  • focus InputGroup textarea from addons
  • expose PaginationEllipsis label
  • only allow vertical resizing in Textarea
  • preserve collapsed Sidebar accessible names
  • leave google fonts imports in the final CSS
  • render live previews in the Falcon font
  • adopt Figtree as the sans font family
  • suppress tooltips in expanded mode via Tooltip disabled
  • make code samples contain entire modules with imports
  • refine sidebar and app header styling, move breadcrumb overflow scrolling into Breadcrumb
  • multiple tooltip bug
  • set default icon stroke width to 2
  • add 72px (section) to the spacing utility scale

switch SidebarMenuButton and SidebarMenuSubButton to render prop

Section titled “switch SidebarMenuButton and SidebarMenuSubButton to render prop”

SidebarMenuButton and SidebarMenuSubButton no longer accept asChild. Pass the element shell to render and the label as children: <SidebarMenuButton render={<a href="/x" />}>Label</SidebarMenuButton>.

  • improve documentation
  • switch SidebarMenuButton and SidebarMenuSubButton to render prop
  • make style docs clearer
  • add FalconProvider
  • use neutral-200 for input border
  • update documentation about styles

drop Icon wrapper and re-export lucide icons directly

Section titled “drop Icon wrapper and re-export lucide icons directly”
  • Icon, iconNames, IconName, and IconSize are removed. Import icon components directly from @falcon/ui-kit — every lucide-react export ending with Icon is now re-exported from the package (e.g. import { BellIcon } from "@falcon/ui-kit").
  • The custom ag-field icon is now exported as FieldIcon instead of AgField.
  • SidebarCollapsedFlyout, SidebarCollapsedFlyoutItem, SidebarNavLabel, SidebarNavExpandIcon, useSidebarFlyout, and sidebarMenuButtonVariants are removed from the public API.
  • drop Icon wrapper and re-export lucide icons directly
  • publish documentation inside the package
  • sync design tokens from Figma
  • add AppHeader, AppLayout, and Sidebar components
  • import tokens
  • compile tokens from a DTCG JSON file
  • add AI-first governance documentation set
  • remove AGENTS.md, route consumer protocol through llms.txt
  • fold in review feedback from Daniel and Niels
  • add Icon component with Lucide + custom-icon catalog
  • consolidate Icon ADRs, finalize API, add receipt
  • add 8 Lucide icons for Maverick sidebar
  • migrate away from storybook to astro

legacy components have been moved into a separate "@falcon/ui-kit/dist/legacy" entrypoint.

  • new design system
  • add onRemove and disabled props to Chip component [BRAD-16149]
  • add interactive type to Chip [BRAD-16395]
  • pass extra props down in FlexWrapper and GridWrapper
  • update overrideBrowserslist
  • add period to list empty state without applied filters
  • add border property to EmptyState and ListEmptyState
  • add Table.EmptyState component
  • actually use a forwarded ref in ListEmptyState
  • show subtext in ListEmptyState only if onClearFilters is passed
  • add EmptyState component
  • add no-gap-pad content modifier [BRAD-14670]
  • add Table component
  • add LabelCard component [BRAD-14631]
  • add sx property to Accordion
  • use IconInternal in accordion to avoid unwanted classes
  • add Label component [BRAD-14320]
  • remove background on Pagination items
  • prevent inherited line-height from affecting Badge text alignment
  • change jd-green button color to @white
  • add Slack link to CommentsBanner
  • add Pagination component
  • add partnerLogo prop to Alert
  • remove padding property from CommentsBanner component
  • add Alert component
  • add CommentsBanner component
  • mention bradley’s WATCH_POLL environment variable
  • add Card component
  • add border, borderRadius, margin and padding style props
  • use !important for style props
  • don’t limit fontSize values in Button and Typography
  • output margin and padding helper classes in intuitive order
  • make gap overrides work propertly in GridWrapper
  • move media overrides into separate classes in style props
  • don’t override Typography default color, let it be inherited
  • don’t default to 0 column/row gap values in GridWrapper
  • add Box component as a basic building block
  • use hover feature instead of screen width to style :hover/:active
  • make sure Badge’s pseudo-elements stay hidden
  • use CSS Modules to style Accordion, ArrowLink and Chip
  • use CSS Modules to style Badge
  • add link color to Icon component
  • add optional color prop to Icon component
  • make sure Button sets default value for type if as is absent
  • allow customizing Button’s underlying element

importing arbitrary modules that are not defined in exports is not possible anymore.

setting LESS variables for theming no longer works.

mixins for vendor prefixes no longer exist

make sure button has properly working types

Section titled “make sure button has properly working types”

Button expects passing false as a value for color, minWidth and size to opt-out of a default value

  • describe usage in README.md
  • add type arg to Button’s stories
  • publish esm instead of cjs
  • allow customizing Button’s underlying element
  • specify sideEffects in package.json
  • define exports field in package.json
  • use CSS custom properties for theming
  • emit source maps for js
  • make sure button has properly working types
  • stop using mixins for vendor prefixes