Rollup release 2.5.1

In addition to three new prototype components focused on interactivity. This release contains a number of integration-focused refinements that reduce accidental whitespace between components, particularly when placing full-bleed containers with background image (like vf-hero) before other containers.

Read below for details on the changes in each component.

As always, you can join the conversation on Slack.

This releases 2.5.1 to the CDN

https://assets.emblstatic.net/vf/v2.5.1/css/styles.css
https://assets.emblstatic.net/vf/v2.5.1/scripts/scripts.js

As a reminder, the rollup CSS and JS are compilations of many independently versioned components and is likely to contain changes that may disrupt the look of your site. We advise testing. Even better is to build your own CSS rollup from the npm sources, you can find a guide here.

New components

vf-bookmark 1.0.0-alpha.1 npm git diff

• Creates an initial version of vf-bookmark.
• https://github.com/visual-framework/vf-core/discussions/1654

vf-progress-indicator 1.0.0-alpha.3 npm git diff

• Basic implementation of vf-progress-indicator
• Tracking discussion

vf-dropdown 1.0.0-alpha.3 npm git diff

• Basic implementation of vf-dropdown component
• Tracking issue

Refinements

vf-button 2.0.0-alpha.2 npm git diff

• Adds experimental angular support. See README.md for more.

vf-card-container 3.2.0 npm git diff

• Halves vertical spacing between vf-section-header and vf-cards.
• Refines container vertical by using --page-grid-gap).
• Adds 4 column card support for when cards have no imagery.

vf-hero 3.3.1 npm git diff

• Reduces vf-hero bottom margin.
• Makes vf-hero bottom margin "smarter" by no applying when the following element uses vf-u-fullwidth or vf-navigation. In these cases vf-stack is sufficient.

vf-news-container 1.1.0 npm git diff

• Standardizes the featured news variant as 4 columns.

vf-search 3.0.0-alpha.1 npm git diff

• Refine spacing when more than 1 inline vf-form__item.

vf-stack 2.1.2 npm git diff

• vf-stack no longer applies between a vf-hero and vf-u-fullbleed.
• Gives more margin-top to vf-u-fullbleed after most items.

vf-summary 1.6.0 npm git diff

• Removes support for styling of vf-summary inside of vf-box. (this is no longer encouraged)
• Adds support for conditional display of vf-summary__text.

Deprecations

vf-box 2.4.0 npm git diff

• Deprecates vf-box. Most use cases should now use the vf-card component. A new layout-specific vf-box may be made in the future.

vf-link-list 1.5.0 npm git diff

This deprecates vf-link-list as many components are either widely unused or only seldom used — for the components that aren't yet used much we also have major revisions coming and we wish to discourage use of components that are about to be overhauled.

• Links List Default: use vf-list + vf-heading
• Links List no heading: use vf-list
• Links List Tight: use vf-list (we may add a vf-list--tight variant subject to demand)
• Links List Very Easy: see above
• Links List Easy: to be overhauled as vf-navigation--on-page
• Links List Has Images: use vf-summary--has-image or vf-flag--middle

Additionally there has been a confusion between when to use vf-list and vf-link-list that we're want to address.

https://github.com/visual-framework/vf-core/issues/1649

vf-header 1.1.0 npm git diff

• vf-header was an early concept on how we might accommodate multi-layers of branding ... but:
  • It was never successfully used in production
  • Is out of date technically and visually
  • Has questionable IA/UX merritt in the current context
• Therefore it is being deprecated.
  • No migration guidance is supplied as it is not used in production.
  • It is also being removed from the default rollup Sass/CSS.
• https://github.com/visual-framework/vf-core/pull/1656

vf-activity-group 1.0.0-alpha.12 npm git diff

• Deprecated as the component never saw wide adoption and neither the technical tooling nor use case was ever proven.
• https://github.com/visual-framework/vf-core/pull/1650

vf-activity-list 1.0.0-alpha.11 npm git diff

• Deprecated as the component never saw wide adoption and neither the technical tooling nor use case was ever proven.
• https://github.com/visual-framework/vf-core/pull/1650

Bug fixes and accessibility

vf-card 2.6.0 npm git diff

• Resolves an accessibility issue with contrast for the striped card subheading variant.
• https://github.com/visual-framework/vf-core/issues/1657

vf-section-header 1.5.2 npm git diff

• Accessibility: When section header is a link, it should still be wrapped an h2
• https://github.com/visual-framework/vf-core/issues/1683
• Whitespace control

vf-banner 1.9.1 npm git diff

• --inline variant Nunjucks template file cleanup.

embl-content-hub-loader 1.1.1 npm git diff

• Avoid a null variable issue when contentHub returns no results.

embl-notifications 1.1.1 npm git diff

• Adds vf-u-margin__top--400 to handle cases of nested output where vf-stack may not reach.
• Remove use of long deprecated vf-banner--phase variant and replace with vf-banner--alert vf-banner--info.

vf-card-container 3.1.3 npm git diff

• Fix README formatting.