Changelog
What changed in each release of Neighborhood Design System, newest first.
v5.1.0 (2026-11-10) #
Added
- AI brand skill: new Neighborhood brand skill, a proof of concept that lets Claude, GitHub Copilot and Microsoft 365 Copilot apply any of the 15 brands’ colors, fonts, spacing and button shapes to pages, slides, documents, charts and email.
- Figma: each selected brand now gets its own Components and Foundations pages, and the main components live on a shared Component Library page.
- Figma: images and logos in components are now a Media Placeholder that you can fill with an image or swap for your own component.
- Figma: new Check for updates button, a count of changes on Apply, and a note after each apply that says what changed and takes you to it.
- Figma: the file now records the last apply (release, date, brands and who applied it) in the right sidebar and on the generated pages, with a button to reopen the plugin.
- Form controls: new
--nbhd-formControl-label-letterSpacingand--nbhd-formControl-label-textTransformtokens for styling field labels.
Changed
- House of Rohl: now uses GT America Expanded for headings and GT America Extended for body text, buttons and form fields, in place of Open Sans.
- FBIN: now uses the Onest font in place of Open Sans.
- FBIN:
--nbhd-color-brand-secondaryand--nbhd-color-accent-secondarynow use FBIN Gold. - Master Lock: field labels, buttons and eyebrows now use Montserrat, labels are uppercase, and large display text is heavier.
- Documentation site: the FBIN brand page now shows the correct color token names, plus PMS and CMYK values and a neutral palette.
- Figma: the plugin starts with no brand selected in a new file, groups components into a collapsible list with All and Clear, and keeps Preview changes and Apply in view as you scroll.
- Figma: Dry run is now Preview changes, and Remove modes for brands not selected is now Also remove brands from this file, which also removes those brands’ pages.
- MCP server: AI assistants now install Neighborhood packages only from GitHub Packages, and ask you to request a token from IT Digital instead of copying packages from elsewhere on your computer.
- MCP server: markup validation now flags Neighborhood packages installed from a local file or copied folder.
- Fixed form field labels not using the
--nbhd-formControl-label-fontFamilytoken.
v5.0.0 (2026-11-03) #
Added
- Carousel: new
previous-label,next-label,pagination-label,slide-button-label,play-labelandpause-labelattributes for changing what screen readers call its buttons. - Filters: new
drawer-label,reset-label,reset-aria-label,done-label,done-aria-labelandclose-labelattributes for changing the wording of the mobile filters drawer. - New attributes for changing or translating built-in button and list names:
close-labelon Dialog,page-labelon Pagination,file-list-labelon Upload, andplay-labelandpause-labelon Video. - React: new
onNbhdChangeevent on NbhdInput, NbhdTextarea, NbhdCheckbox and NbhdRadio,onNbhdDialogOpenandonNbhdDialogCloseon NbhdDialog, andonNbhdBreadcrumbClickon NbhdBreadcrumb. - Documentation site: new AI tools (MCP), Figma plugin, React, Glossary and Troubleshooting pages under Getting Started.
- Documentation site: new Content and media and Loading and performance guidelines, and Platform setup now covers Vue, Svelte and Angular.
- Documentation site: new Textarea component page.
Changed
- Figma: the plugin is now being tried by a small group of beta testers and no longer asks for a password.
- Figma: the plugin shows which Neighborhood release it loaded, and settings meant for the design system team are under Developer options.
- Figma: component sets the plugin made keep updating after you move them to another page.
- Filters: a filter group’s
descriptionis now shown as plain text, so any HTML in it appears as written instead of being formatted. - Documentation site: each component’s CSS properties table is now built from the design tokens and shows the token and value behind each property.
- Documentation site: the Versions page now shows the current release, the preview site and a table of older versions with their packages and release dates.
- MCP server: component details now include the token and description for each CSS property, matching the docs site.
- MCP server: v4 to v5 upgrade guidance covers more renamed attributes, such as the old hero carousel settings and Autosuggest
message, which is nowheading. - Updated dependencies.
v5.0.0-rc.2 (2026-10-29) #
Added
- Figma: new Neighborhood for Figma plugin, a proof of concept that brings Neighborhood’s tokens, styles and core components into a Figma file for the brands you choose.
- Surfaces: new
--nbhd-context-color-text-subtleand--nbhd-context-color-text-accenttokens for low-emphasis and brand-colored text that adjusts to the surface. - Card: new
--nbhd-card-title-textTransformtoken for changing the case of card titles. - MCP server: Shopify setup instructions now point to the ready-made Shopify sections and include a single command that copies a brand’s files and fonts into a theme.
Changed
- Brands: brand stylesheets no longer include the unbranded tokens separately, so each brand file is smaller and self-contained.
- Documentation site: examples and guides now use the current color tokens, such as
--nbhd-color-text-primary. - Fixed Carousel going to the wrong slide from
slideTo()whenloopis on.
Removed
- Brands: the
core.cssbrand stylesheets are gone; if your site loads the brand fonts itself, use the brand’s token file from@fbin-web/neighborhood-tokens/dist/brands/instead. - Tokens: the older color tokens
--nbhd-content-*,--nbhd-background-*,--nbhd-border-primary,--nbhd-border-subtle,--nbhd-form-*,--nbhd-feedback-*,--nbhd-status-*,--nbhd-brand-primary,--nbhd-accent-primaryand--nbhd-link-primaryare removed; use the--nbhd-color-*tokens instead, such as--nbhd-color-text-primary.
v5.0.0-rc.1 (2026-10-27) #
Added
- Brands: new draft themes for Aqualisa, August, Emtek, Fypon, Moen Flo, Solar Innovations, Therma-Tru, Waste King and Yale, each with a brand stylesheet, a Neighborhood CSS entry and a brand page.
- Radio Group: new component that groups Radio options under one label, with one Tab stop, arrow-key selection, help and error text, and form support.
- Visually Hidden: new component that hides content on screen but keeps it available to screen readers.
- Form fields: Input, Textarea, Checkbox, Radio, Select, Range and Upload now work inside a native
<form>: they submit under theirname, reset with the form and block submission whenrequiredor otherwise invalid. - Form fields: new
checkValidity(),reportValidity()andsetCustomValidity()methods, plusvalidityandvalidationMessage, like the browser’s own fields. - Checkbox and Radio: new
help-text,error-textandinvalidattributes, with matchinghelpanderrorslots. - Select: new
requiredandaria-labelattributes, and typing a letter jumps to a matching option. - Upload: new
requiredandrequired-labelattributes. - Accordion Item, Autosuggest, Filters and Pagination Search: new
heading-levelattribute for matching built-in headings to the page outline. - Autosuggest, Filters and Pagination Search: result counts are announced to screen readers when they update, with new attributes such as
results-announcementfor changing the wording. - Search: new
autosuggestattribute that links the field to an Autosuggest, so the down arrow moves into the suggestions and Escape returns to the field. - Search: new
landmark-label,clear-labelandsubmit-labelattributes for naming the search area and its buttons. - Button: new
aria-current,aria-expanded,aria-haspopup,aria-pressedandaria-disabledattributes, passed through to the inner button. - Link: new
aria-currentattribute, andactivelinks are now announced as the current page. - Link and CTA: links with
externalnow tell screen reader users they open in a new tab; the newexternal-labelattribute changes that text. - CTA: new
aria-labelattribute for telling repeated CTAs apart. - Pagination: new
label,previous-aria-labelandnext-aria-labelattributes, and Pagination Search getslabel. - Content Block: new
tagattribute for rendering as asectionorarticle. - Video: captions and descriptions can be added with
<track>elements insidenbhd-video. - Tokens: new
--nbhd-size-target-mintoken for the smallest click area, and new tokens such as--nbhd-humongotron-mediaOverlay-minOpacityand--nbhd-finish-active-borderWidth. - Documentation site: brand pages now show a Draft or Ready status.
- Documentation site: the Accessibility page now lists what each component handles and what each site is responsible for, and Extending Components has a new section on using components in forms.
- Storybook: the new brands are available in the brand switcher, and each story now shows accessibility issues as errors in the test panel.
- MCP server: import instructions now cover the new brands.
Changed
- Moen: updated branding with an orange link color, new grays, a violet focus outline, Denim Bold and a lighter display text weight.
- Colors: text, link, form field and focus colors in every brand theme and the unbranded theme now meet WCAG AA contrast, which darkens some colors and focus outlines for CFG, FBIN, House of Rohl and Master Lock.
- Focus: every interactive part now shows a focus outline when reached by keyboard, including in Windows High Contrast.
- Dialog: focus moves into the dialog when it opens and returns to what opened it when it closes, and the rest of the page can’t be reached while it’s open.
- Dialog: long content now scrolls inside the dialog instead of overflowing the screen.
- Form fields: labels, help text and error text are now connected to every field without setting an
id, and required fields show a marker. - Input, Textarea, Checkbox, Radio, Radio Group, Select and Range: an invalid field with no
error-textnow shows “This field has an error.” - Form fields: values are sent with the form directly, so remove any hidden inputs that copied them or they will be sent twice.
- Select: Tab now closes the list, and reaching the
maxMultiplelimit is announced to screen readers. - Pagination and Pagination Search: the current page stays focusable, and Previous and Next stay in place, disabled, on the first and last page.
- Pagination and Breadcrumb: now render labeled navigation landmarks; Breadcrumb marks the last item as the current page.
- Navbar:
aria-labelno longer defaults to “Navigation”; set one, such as “Main”, only when a page has more than one navigation. - Search: the default
aria-labelis now “Search” instead of “Search Input”. - Card and Product Card: clickable cards are now named by their visible title, so their headings stay headings for screen reader users.
- Accordion Item: each header is now wrapped in a heading, so screen reader users can jump between sections.
- Button: disabled buttons now fade their colors instead of the whole button, so a focused
aria-disabledbutton keeps a clear focus outline. - Button: icon-only buttons without an
aria-labelnow log a console warning during development. - Image: images without an
altattribute now log a console warning during development; setalt=""for decorative images. - Spinner: now announces “Loading”, or its label and text, to screen readers.
- Upload: help and error text are now read with the Browse button.
- Video: autoplaying MP4 and Widen video can always be paused, and embedded video uses its
alttext as the player title. - Featured cards and Humongotron: the image overlay is darker so text stays readable on light images, and the Humongotron overlay can no longer be set below a minimum on large screens.
- Humongotron: the scroll indicator now pulses once instead of repeating.
- Finish: the selected finish now has a thicker border, so it doesn’t rely on color alone.
- Carousel and Search: pagination dots and the clear and submit buttons now have a click area of at least 24 by 24 pixels.
- Product Card: badges that don’t fit on one line now wrap instead of being cut off.
- List and Neighborhood CSS: lists without bullets are still announced as lists in Safari with VoiceOver.
- Documentation site: the hidden skip and screen reader text now appears when it receives focus.
v5.0.0-beta.6 (2026-10-23) #
Added
- Tokens: new semantic tokens for space, size, shadow, motion, opacity, z-index and breakpoints, such as
--nbhd-space-6,--nbhd-size-icon-md,--nbhd-shadow-md,--nbhd-motion-duration-normal,--nbhd-opacity-disabled,--nbhd-z-100and--nbhd-breakpoint-md. - Tokens: new semantic colors
--nbhd-color-overlay,--nbhd-color-surface-highlight,--nbhd-color-control-track-activeand--nbhd-color-control-track-inactive. - Neighborhood CSS: new color utilities for overlay, surface highlight and control track colors, and the eyebrow and action text styles now include letter spacing.
- Carousel: autoplaying carousels now show a play/pause button next to the pagination, even when the pagination is hidden.
- Carousel: new
play()andpause()methods and a newnbhd-autoplay-changeevent for controlling and following autoplay. - Carousel: new
shell,pagination-rowandautoplay-control-iconparts for styling. - Image: new
responsivePresetoption for setting image sizes per breakpoint. - Documentation site: new Motion, Opacity and Focus pages under Foundations.
- Documentation site: the Colors page and each brand page now list the semantic colors and text styles as they look for that brand.
Changed
- Tokens: components now use the semantic tokens, so brand themes can change spacing, sizes, shadows, motion and layering in one place.
- Fixed buttons, links, badges and form fields using a plain sans-serif font instead of the brand font for CFG, FBIN, House of Rohl and Master Lock.
- Adjusted sizes to the new size scale: Select fields are now at least 44px tall, the Humongotron scroll indicator is 44px, and the Filters drawer buttons are 44px.
- Upload: the drop zone, icon and thumbnails are smaller for Moen.
- Humongotron, Jumbotron, Minitron and Hero Split: images are now automatically requested at the right size for each breakpoint when using Widen.
- Image: preset sizes now apply to Widen URLs that already include settings, and cropped images stay aligned with
image-focuswhen scaled. - Image: an image quality set in the Widen URL is now kept unless
cdn.qualityis set. - Carousel: autoplay pauses while the pointer is over the slides, stops when keyboard focus enters the carousel, and starts paused for visitors who prefer reduced motion.
- Carousel: without
loop, the previous and next buttons are disabled at the first and last slide. - Carousel: navigation, pagination and the play/pause button are hidden when every slide fits in view.
- Fixed the Minitron shadow being cut off inside a Carousel; it now wraps the slide area and follows the active slide when showing one slide at a time.
- Card List: no longer writes warnings to the browser console about unsupported content.
- Fixed the Spinner track being hard to see on inverse surfaces; the new
--nbhd-spinner-track-opacitytoken sets how strong it is. - Fixed Dialog, Minitron, Navbar and Upload not updating when slotted content is added after the page loads.
Removed
- Tokens:
--nbhd-base-transition-quickly,--nbhd-base-transition-slowlyand--nbhd-base-transition-slower; use--nbhd-motion-duration-fast,--nbhd-motion-duration-normaland--nbhd-motion-duration-slowinstead. - Brands: the brand font files no longer set
--nbhd-fontFamily,--nbhd-fontFamily-headingor the--nbhd-fontStack-*variables; use the text style tokens, such as--nbhd-typography-body-fontFamily, instead.
v5.0.0-beta.5 (2026-10-22) #
Added
- Select: new
help-text,error-textandinvalidoptions, plushelpanderrorslots, for showing help and error messages below the field. - Select: the
nbhd-changeevent now includes the selected value, and a standardchangeevent fires alongside it. - Upload: new
label,help-text,error-text,invalid,instructions,browse-labelandbrowse-variantoptions for setting the field text and button. - Upload: new
accept,max-files,max-file-sizeandnameoptions for limiting which files can be added. - Upload: new
nbhd-files-rejectedandnbhd-file-removedevents, and a way to clear the selection after a form submits. - Button: new
aria-descriptionoption for adding extra context for screen readers. - Storybook: a new Playground toolbar option to show the full playground frame, a Minimal frame with only the surface and width, or no frame at all.
Changed
- Upload: redesigned for v5; it now fills its container instead of stopping at 350px, and its colors follow the surface it sits on.
- Upload: renamed its CSS variables to the v5 style, for example
--nbhd-upload-border-radiusis now--nbhd-upload-dropzone-borderRadius. - Upload: slots now have names (
label,icon,instructions,help,errorandrequirements) in place of the old unnamed slots. - Upload: screen readers now announce the field label, help or error text, and the allowed file types.
- Select: screen readers now announce help and error text.
- Product Card: fixed badges so they sit over the top corner of the product image without being cut off.
- Product Card: fixed the card changing height when hovering a finish.
- Humongotron: fixed content alignment on desktop so text stays inside the page container, and capped the text width for easier reading.
- Documentation site: removed the preview width buttons from component previews.
Removed
- Upload: the
dataoption andUploadElementtype; use the new text and button options instead. - Upload: the
files-selectedevent; usenbhd-files-selectedinstead.
v5.0.0-beta.4 (2026-10-21) #
Added
- Documentation site: a new Neighborhood documentation site with Getting Started, Guidelines, Foundations, Components and Brands sections, site search, light and dark themes, and this changelog.
- Documentation site: new guides for quick start, platform setup, Neighborhood CSS, product teams and requests, plus guidelines for accessibility, brand theming, content and media, the content model, extending components, layout, surfaces and tokens.
- Documentation site: component pages show live Storybook previews with a story picker, a brand picker that’s remembered between pages, and preview width controls.
- Storybook: a new Storybook that shows every component in both Web Components and React, with a framework switcher, a brand picker and how-to guides.
- MCP server: new
validate_markuptool that checks Neighborhood markup for mistakes and leftovers from v4, such as removed components, old attribute values, unknown slots and old event names. - MCP server: new
get_migration_guidetool that walks through upgrades from v2, v3 and v4.
Changed
- MCP server: component details, generated code and Bloomreach content types now follow the v5 component API, including slots,
surfaceandnbhd-*events. - MCP server: the hosted endpoint now requires an access token; ask the design system team for one.
Removed
- The previous documentation site, replaced by the new documentation site.
v5.0.0-beta.3 (2026-10-06) #
Changed
- Spinner: refreshed styling and options.
- Simplified how component types are exported and imported.
v5.0.0-beta.2 (2026-10-01) #
Changed
- Updated component data, and all components now export their types.
- Neighborhood CSS now uses design tokens.
- Cleaned up brand tokens, including Moen and House of Rohl surface colors.
- Image: the React component now exposes all Image props.
- Pagination and Pagination Search: fixed page change and sort callbacks not firing.
- Select: deprecated the
OptionDatatype. - Select: the
selection-changedevent is nownbhd-selection-changed, and theonChangeproperty is nowonNbhdChange.
Removed
- Flex:
reversedprop; usereverseinstead. - Alignment values
left,rightandmiddle; usestart,endandcenterinstead. - Image:
bp-sm,bp-mdandbp-lg. - React: the old event props
onAutosuggestClick,onProductCardClick,onSelectionChangedandonValueChanged, andonChangeon NbhdSelect; useonNbhdAutosuggestClick,onNbhdProductCardClick,onNbhdSelectionChanged,onNbhdValueChangedandonNbhdChangeinstead.
v5.0.0-beta.1 (2026-09-24) #
Changed
- Updated the documentation for every component.
- Updated types.
- Storybook now opens with no brand applied by default.
- Types are renamed from
*Dataand*Elementto*Contentand*Props, such asCardDatatoCardContent. - CTA: variants are now limited to
primary,secondaryandtertiary. - Range: the
value-changedevent is nownbhd-value-changed.
Removed
- Results Filter, replaced by Filters.
- Text: the
defaultvariant; usebodyinstead. - Container: the
breakpointattribute.
v5.0.0-alpha.12 (2026-09-21) #
Changed
- Results Filter renamed to Filters.
- Filters:
datais nowfilters,results-titleis nowheading,resultsis nowtotal-results,filter-items-shownis nowmax-visible-optionsandcount-accentis nowcount-style. - Filters:
remove-label,show-more-labelandshow-less-labelare nowclear-filters-label,expand-labelandcollapse-label. - Filters: the
filter-changeevent is nownbhd-filter-change, and itsfacetKeyandfacetTitledetails are nowfilterGroupKeyandfilterGroupTitle. - Pagination:
current,totalandvisible-rangeare nowcurrent-page,total-pagesandmax-visible-pages, and thepage-changedevent is nownbhd-page-changed. - Pagination Search:
term,message,sortandresultsare nowsearch-term,heading,selected-sortandtotal-results, and thesort-changedevent is nownbhd-sort-changed. - Pagination Search: the
search-title,search-message,search-term,search-countandsort-optionsparts are nowsummary,summary-heading,summary-term,summary-resultsandsort. - Autosuggest:
categoriesis nowsuggestions,termis nowsearch-termandmessageis nowheading. - Autosuggest:
max-categoriesandmax-category-itemsare nowmax-suggestion-listsandmax-suggestion-items. - Autosuggest: the
search-message,product-card,listandcategory-itemparts are nowheading,product,suggestion-listandsuggestion-item, and theautosuggest-see-moreevent is nownbhd-autosuggest-see-more. - Search:
focusedis nowautofocus, and thesearch-inputandsearch-submitevents are nownbhd-search-inputandnbhd-search-submit. - Search: added an accessible label to the input.
- Dialog:
no-headeris nowhide-header. - Dialog: improved keyboard focus handling.
v5.0.0-alpha.11 (2026-09-15) #
Changed
- Navigation Bar renamed to Navbar.
- Refreshed for v5 (design tokens and styling): Carousel Item, Accordion and Accordion Item.
- Navbar: the
navslot is nowlinks,compactandfull-widthare nowlayout, andnav-alignmentandcontent-alignmentare nowalignment. - Navbar:
logo-accentis nowlogo-separator, andhide-on-mobileis nowmobile-hidden. - Navbar: the
nav-title,nav-description,logo-container,nav-container,nav-itemsandnav-ctaparts are nowtitle,content,logo-group,links-group,linksandcta-wrapper. - Carousel:
nav-variantis nownavigation-variant, withprimary,secondaryandghostvalues, andnav-positionis nownavigation-position. - Carousel: the
nav,button-prev,button-nextandcarousel-nav-iconparts are nownavigation,navigation-prev,navigation-nextandcarousel-navigation-icon. - Carousel: the hero carousels’
navigationandpaginationare replaced byhide-navigationandhide-pagination, which are inverted, so arrows and dots show by default. - Carousel: the hero carousels’
nav-style,pagination-styleandautoplay-interval(in seconds) are nownavigation-variant,pagination-variantandautoplay(in milliseconds).
Removed
- Minitron Carousel, Jumbotron Carousel and Humongotron Carousel. Use Carousel instead.
- Navbar: the
dataandnavproperties and thenav-linkpart; use slots instead.
v5.0.0-alpha.10 (2026-09-10) #
Changed
- Refreshed for v5 (design tokens and styling): Breadcrumb and Video.
- Horizontal alignment now uses
startandendin place ofleftandright. - Humongotron:
opacityis nowoverlay-opacity,containandcompactare nowlayout, andscroll-arrowis nowscroll-indicator. - Humongotron: the
visualpart is nowmedia, the media slot’s part is nowmedia-slot, and thescroll-arrowpart is nowscroll-indicator. - Humongotron: updated the media overlay.
- Jumbotron and Minitron:
reversedis nowreverse. - Jumbotron: the
visualpart is nowmedia, and the media slot’s part is nowmedia-slot. - Minitron: now updates when its media changes.
- List:
no-divideris nowdivider, which is inverted, so dividers are off by default. - Video Player: the
visual,videoandbase-containerparts are nowmedia,media-slotandcontainer.
Removed
- Humongotron, Jumbotron and Minitron:
data,h1andcarousel; settag="h1"on the slotted text instead. - Humongotron and Jumbotron:
constrain-logo. - Minitron:
media-only, which is now automatic. - Video Player:
data; put the video in themediaslot instead.
v5.0.0-alpha.9 (2026-09-03) #
Changed
- Refreshed for v5 (design tokens and styling): Headline Content, Content Block and Container.
- Hero Split:
reversedis nowreverse,borderis nowframedandtop-alignedis nowcontent-alignment="start". - Hero Split:
no-shadowis nowshadow, which is inverted, so the shadow is off by default. - Hero Split: the four
media-radius-*attributes are nowmedia-radiusandmedia-radius-pattern. - Hero Split: the
visualpart is nowmedia, and the media slot’s part is nowmedia-slot. - Flex: new
reverseattribute, which replacesreversed. - Vertical alignment now uses
centerin place ofmiddle.
Removed
- Headline Content:
data,full-widthandh1. - Hero Split:
dataandh1; settag="h1"on the slotted text instead.
v5.0.0-alpha.8 (2026-09-01) #
Added
- Media overlay tokens for darkening images and video behind text.
- Card List now supports Product Card.
Changed
- Image: Widen image handling is now separate from the core Image component, and Widen images now need
provider="widen". - Image:
positionis nowimage-focus, andimg-classis nowcss-class. - Card:
no-zoomis nowzoom, which is inverted, so zoom is off by default. - Card:
orientationis nowaspect-ratio,overlayis nowlayout="featured",reversedis nowreverseandclickableActionis nowaction. - Card: clickable cards now have an accessible label.
- Card List:
header-alignmentis nowintro-alignment,list-alignmentis nowgrid-alignment,footeris nowcta-placement="footer"andheader-themedis nowsurface-scope="intro". - Card List: cards now go directly inside the list instead of in the
cardsslot. - Card List: the
header-container,headerandbase-containerparts are nowintro-wrapperandintro-container,introandgrid-container. - Product Card:
modelis nowidentifier, and thediscontinuedandvariantoptions are replaced by thebadgesandproductproperties. - Product Card: the
model,finish,media-secondaryandmedia-finish-imageslots and parts are nowidentifier,product-option,media-alternateandmedia-option-image. - Finish:
modelis nowidentifier,variantis nowproduct, and thefinish-hoverandfinish-hover-outevents are nownbhd-finish-hoverandnbhd-finish-hover-out. - Badge:
variantis replaced bycss-class.
Removed
- Card List:
prefabprops, thedataproperty and theheaderattribute. - Card List: per-card attributes such as
shadow,orientation,clickableandno-zoom; set them on each card instead. - Card:
size,condensedand theclick-overlaypart; setsizeon Card List instead. - Product Card: the
status,status-variantandexclusiveslots; usebadgesinstead. - Image:
no-widenandanimated.
v5.0.0-alpha.7 (2026-08-20) #
Added
- Borders foundation documentation.
- Text: new
bodyandsupportingvariants, which replacedefaultandnote.
Changed
- Form components (Input, Textarea, Select, Range, Radio and Checkbox) now use design tokens.
- Link now uses design tokens.
- Updated the default color tokens for each context.
surfaceprop acceptsnoneagain.
v5.0.0-alpha.6 (2026-08-07) #
Added
- Storybook playground for previewing components on different surfaces and widths.
Changed
- Reworked color and surface tokens into a semantic layer.
surfacevalues are nowprimary,secondary,inverseandinverse-secondary, replacingprimary-light,secondary-light,primary-darkandsecondary-dark.- Text: updated styling.
- Button and CTA: updated styling,
primaryis now the default variant, and there’s a newplainvariant.
Removed
- Button and CTA: the
defaultvariant; useprimaryinstead. - CTA: the
icon-onlyattribute. - Text:
alignmentanditalicprops. surfaceprop:noneoption. (Restored in v5.0.0-alpha.7.)- The default brand token set.
v5.0.0-alpha.5 (2026-07-31) #
Added
- Border width and radius tokens.
Changed
- Text, Button and CTA now use design tokens.
- Button and CTA: the
iconvariant is now theicon-onlyattribute. - Primitive tokens renamed to base tokens, and all token names are now namespaced.
- Tokens: spacing tokens such as
--nbhd-space-4are now--nbhd-base-space-4. - Documentation: Size renamed to Sizing.
Removed
- Tokens: the
--nbhd-radius-*tokens; use--nbhd-border-radius-*instead. - Text: the
notevariant.
v5.0.0-alpha.4 (2026-07-29) #
Added
- First pass at the revised Moen branding.
Changed
- Flex, Container, Link, Breadcrumb, List, Image, Video, Badge, Finish and Spinner now use design tokens.
- Updated container size tokens:
--nbhd-maxInlineSizeand--nbhd-minInlineSizeare now--nbhd-size-container-maxand--nbhd-size-container-min. - Updated how branding documentation is presented.
Removed
autovalue from spacing tokens.
v5.0.0-alpha.3 (2026-07-22) #
Changed
- Tokens: the
--nbhd-fontSize-*tokens are replaced by text style tokens, such as--nbhd-typography-body-fontSize. - Button and CTA:
--nbhd-actionPrimary-*is now--nbhd-action-primary-*.
v5.0.0-alpha.2 (2026-07-13) #
Changed
- Updated design tokens, including font sizes.
Removed
- Moen Plus brand.
v5.0.0-alpha.1 (2026-07-01) #
Added
- Design tokens now drive all component styling, with automated checks to catch mistakes.
Changed
- Updated Moen spacing.
- Foundations: Elevation renamed to Z-Index, and Border Radius renamed to Radius.
- The
backgroundattribute is nowsurfaceon every component that had it, andcontent-backgroundis nowcontent-surfaceon Card List, Jumbotron, Minitron and the hero carousels. - Tokens:
--nbhd-borderRadius-*is now--nbhd-radius-*.
Removed
- The
darkandthemeattributes; components now follow the surface they sit on.
v4.4.0 (2026-06-17) #
Added
- Content Block component.
Changed
- Headline Content: deprecated the
fullwidthprop.
v4.3.0 (2026-05-26) #
Changed
- Cleaned up Image, Card and Card List styles.
- Card: fixed the layout not updating when the orientation changes.
- Video: supports more video types.
- MCP: updated server scripts.
v4.2.0 (2026-05-08) #
Changed
- Updated Moen branding.
- Search: fixed focus.
- Product Card: cleaned up styling.
v4.1.0 (2026-04-30) #
Changed
- Cleaned up Dialog.
- Updated Moen branding.
v3.11.4 (2026-04-28) #
Changed
- Input: fixed the
autocompleteprop.
v3.11.3 (2026-04-14) #
Added
- Results Filter: more styling options.
v3.11.2 (2026-04-14) #
Changed
- Results Filter: fixed scrolling on small screens.
v4.0.0 (2026-03-31) #
Changed
- Stable release.
v4.0.0-beta.8 (2026-03-27) #
Changed
- Theming props now use
background. - Cleaned up documentation.
v4.0.0-beta.7 (2026-03-17) #
Changed
- Deprecated Minitron Carousel, Jumbotron Carousel and Humongotron Carousel. Use Carousel instead.
Removed
prefabprop from all components.
v4.0.0-beta.6 (2026-03-16) #
Added
- Carousel Item component.
v4.0.0-beta.5 (2026-03-13) #
Added
- Carousel component.
v4.0.0-beta.4 (2026-02-23) #
Changed
- Updated documentation.
v3.11.1 (2026-02-16) #
Changed
- Autosuggest: updated the events it sends.
v4.0.0-beta.3 (2026-02-13) #
Added
- Accordion Item component.
Changed
- Cleaned up Accordion.
- Updated dependencies.
v3.11.0 (2026-02-10) #
Added
- Events on Link, Autosuggest and Product Card.
v3.10.0 (2026-02-04) #
Changed
- Results Filter: fixed keyboard tab focus.
v4.0.0-beta.2 (2026-01-28) #
Changed
- Cleaned up Range, Radio and Select styling.
v4.0.0-beta.1 (2026-01-07) #
Changed
- Cleaned up Checkbox, Textarea and Breadcrumb styling.
- Updated dependencies.
v4.0.0-alpha.5 (2025-11-19) #
Added
- More global default colors in the tokens.
Changed
- Cleaned up Input styling.
- Updated Master Lock branding.
v4.0.0-alpha.4 (2025-11-10) #
Changed
- Fixed package build dependencies.
v4.0.0-alpha.3 (2025-11-10) #
Added
- CSS framework package.
- Tokens package for foundation settings.
- Upload component.
Changed
- Restructured theming styles.
- Button and CTA: Underlined variant renamed to Tertiary.
themeprop renamed todark, and it only applies when the component is inside another component using the dark theme.
v4.0.0-alpha.2 (2025-10-27) #
Added
- FBIN brand styling.
v4.0.0-alpha.1 (2025-10-22) #
Added
- Brands package for brand-specific styling of components.
v3.9.0 (2025-10-07) #
Changed
- Results Filter: hides a facet when it has only one option that matches every result.
v3.8.0 (2025-09-17) #
Changed
- Updated component fallback styles.
v3.7.0 (2025-09-09) #
Changed
- Product Card: shows the matching product variant when hovering a finish.
- Finish filter option now shows an image.
v3.6.0 (2025-09-02) #
Changed
- Text: updated styling and variants.
- Updated Larson branding.
v3.5.1 (2025-08-25) #
Changed
- Image: fixed Widen URLs that already include parameters.
Removed
- Search: maximum width limit.
- Autosuggest: built-in Container.
v3.5.0 (2025-08-22) #
Added
- Search: input focus.
Changed
- Updated base element styling.
- Updated Storybook to v9.
v3.4.1 (2025-08-18) #
Changed
- Autosuggest: no longer needs a form, and its event was renamed.
- Autosuggest: no longer renders when it has no data.
v3.4.0 (2025-08-07) #
Changed
- Results Filter: cleaned up the layout.
v3.4.0-beta.12 (2025-08-06) #
Added
- Pagination Search: label for the sort selection.
Changed
- Facet Filter renamed to Results Filter.
- Results Filter: updated filter option logic.
v3.4.0-beta.11 (2025-07-24) #
Changed
- Auto Suggestion renamed to Autosuggest.
- Facet renamed to List.
- Updated Autosuggest and List styling.
- Badge: updated status colors.
v3.4.0-beta.10 (2025-07-21) #
Changed
- Improved how Facet Filter and Auto Suggestion work.
v3.4.0-beta.9 (2025-07-17) #
Added
- Finish component.
- Search component.
Changed
- Updated Product Card and Facet Filter styling.
v3.4.0-beta.8 (2025-07-14) #
Changed
- Improved Product Card and Facet Filter styling and behavior.
v3.4.0-beta.7 (2025-07-10) #
Changed
- Improved Product Card styling and behavior.
- Updated Auto Suggest layout.
v3.4.0-beta.6 (2025-06-27) #
Added
- Facet Filter component.
Changed
- Updated Pagination Search Bar.
- Updated Select.
v3.4.0-beta.5 (2025-06-23) #
Changed
- Updated Autosuggest layout.
v3.4.0-beta.4 (2025-06-18) #
Changed
- Updated Autosuggest and Product Card layout.
- Text: updated styling and props.
v3.4.0-beta.3 (2025-06-18) #
Changed
- Autosuggest: fixed a layout bug.
v3.4.0-beta.2 (2025-06-18) #
Added
- Autosuggest component.
- Facet component.
v3.4.0-beta.1 (2025-06-18) #
Added
- Product Card component.
- Spinner component.
v3.3.0 (2025-05-08) #
Changed
- Updated dependencies, including React.
v3.2.0 (2025-05-05) #
Added
- Button: unstyled variant.
Removed
- Humongotron: autoplay control.
v3.1.0 (2025-04-28) #
Added
- Video: pause and play button when autoplay is on.
Changed
- Card: renders as a button when it is clickable and has a click action.
v3.0.0 (2025-03-06) #
Changed
- Stable release.
v3.0.0-rc.3 (2025-02-19) #
Changed
- Card List: fixed CTA theming.
- Navigation Bar: fixed styling when sticky.
- Video Player: fixed layout with standard video.
v3.0.0-rc.2 (2025-02-14) #
Changed
- Updated dependencies.
v3.0.0-rc.1 (2025-02-14) #
Changed
- Navigation Bar: fixed a slot bug.
- Card: fixed a bug when clickable.
Removed
- Legacy component references.
v3.0.0-beta.8 (2025-02-12) #
Changed
- Updated carousel component props.
v3.0.0-beta.7 (2025-02-12) #
Added
- Humongotron Carousel component.
v3.0.0-beta.6 (2025-02-10) #
Added
- Minitron Carousel and Jumbotron Carousel components.
Changed
- Cleaned up Minitron and Jumbotron.
Removed
- Humongotron: carousel.
v3.0.0-beta.5 (2025-01-15) #
Added
- First pass at Larson branding.
v3.0.0-beta.4 (2025-01-14) #
Added
- Prefab options on Hero Split, Video Player and Navigation Bar.
v3.0.0-beta.3 (2025-01-07) #
Added
- Prefab options on Headline Content and Card List.
v3.0.0-beta.2 (2024-12-17) #
Added
- Text component.
Changed
- Updated CTA and Button theming.
Removed
- Eyebrow, Title, Subtitle, Content and Note, merged into Text.
v3.0.0-beta.1 (2024-11-19) #
Added
- Examples on foundation pages.
Changed
- Styleguide renamed to documentation.
v2.5.0-beta.2 (2024-10-08) #
Added
- Input, Range, Checkbox, Radio, Select, Breadcrumbs, Dialog, Accordion and Label components.
- Note:
borderprop. - Button, Link and CTA: prefix and suffix slots.
v2.5.0-beta.1 (2024-09-26) #
Added
- Button and Minitron Item components.
- All components in Storybook.
Changed
- Restructured component files, and combined Elements and Components.
- Anchor renamed to Link.
v2.4.0 (2024-09-13) #
Changed
- Updated font references.
v2.3.1 (2024-08-29) #
Added
- Navigation Bar:
zIndexstyling option.
v2.3.0 (2024-08-28) #
Changed
- Humongotron and Jumbotron: updated logo sizing.
v2.2.0 (2024-08-28) #
Added
- Navigation Bar component.
v2.1.0 (2024-08-26) #
Changed
- Title: font size changes at the large breakpoint.
v2.0.0 (2024-08-22) #
Changed
- Card List: card title is now optional.
v2.0.0-rc.5 (2024-08-08) #
Changed
- Updated House of Rohl styling.
- Updated dependencies.
v2.0.0-rc.4 (2024-07-31) #
Changed
- Styles now use logical properties, so layouts adapt to text direction.
- Updated dependencies.
v2.0.0-rc.3 (2024-07-25) #
Changed
- Fixed SVG icons not showing in Safari.
- Container: fixed padding in Safari.
v2.0.0-rc.2 (2024-07-24) #
Changed
- Video: supports Widen for each brand.
v2.0.0-rc.1 (2024-07-24) #
Changed
- Updated dependencies.
v2.0.0-beta.5 (2024-07-15) #
Changed
- Video: allows URLs that are not from Widen.
- Video Player: fixed audio playing while muted.
v2.0.0-beta.4 (2024-07-11) #
Changed
- Minitron: fixed content alignment.
- Updated styles ahead of Sass deprecating mixed declarations.
- Updated dependencies.
v2.0.0-beta.3 (2024-07-10) #
Added
- Master Lock branding.
- Badge: fallback background color.
- Shopify recipes for Card List, Jumbotron, Minitron and Video Player.
- This changelog.
Changed
- Restructured brand styling files.
- Card List: updated the main CTA when shown in the footer.
- Minitron: details are now centered vertically.
- CTA: updated hover styling.
- Updated Storybook.
v2.0.0-beta.2 (2024-07-03) #
Added
- House of Rohl branding.
v2.0.0-beta.1 (2024-07-02) #
Changed
- Jumbotron and Humongotron: fixed a logo bug.
v2.0.0-alpha.4 (2024-06-25) #
Added
- Shopify recipes.
Changed
- Updated type references for the React components.
v2.0.0-alpha.3 (2024-06-20) #
Changed
- Updated custom font references and font sizes.
- Updated packages.
v2.0.0-alpha.2 (2024-06-12) #
Added
- New Neighborhood styleguide.
- Storybook.
Changed
- Cleaned up references and types.
v2.0.0-alpha.1 (2024-05-22) #
Added
- Core components: Card List, Headline Content, Hero Split, Humongotron, Jumbotron, Minitron and Video Player.
- Humongotron as its own component, separate from Jumbotron.
- React versions of the components.
- Demos with React, Vite and Next.js.