Skip to content

v18.0.0

Compare
Choose a tag to compare
@Phil147 Phil147 released this 15 Jul 15:00
· 130 commits to main since this release

Replacement of the emphasis button

The emphasis button was not fulfilling WCAG accessibility requirements and was replaced by the new attention button variant. The emphasis button is deprecated and will be removed in the future. As different usages could lead to other solutions than using the attention button, the change is opt-in and will not be done automatically.

Library migration to standalone

The library has been migrated to the Angular standalone APIs. This change should not affect you and everything should work the same and you can import and use the modules as before. But the components and directives are now standalone and you can make use of new Angular features like host directives, import only components/directives instead of a module or find better solutions for mocking in tests.

Library migration to new control flow syntax

The templates of components use the new control flow syntax from Angular. This should have no negative effect on your application or changes needed as everything should work as before.

⚠ BREAKING CHANGES

  • iso-date-adapter: The iso date adapter was loading the requested locales from dayjs lazily by a built in feature.
    This doesn't work with the new vite based build system from Angular anymore so we remove it.
    If you did not explicitly import the necessary locales before you will have to do so with this update.

Add the respective imports into your application:

import 'dayjs/locales/de';
import 'dayjs/locales/es';

For lazy loading projects have to find a custom solution that works together with vite and rollup.

  • layout: The order of the nx-margins have been changed for specificity reasons, this can change the behaviour of current margins.

EXAMPLES:

class="nx-margin-0 nx-margin-top-xl"
before: margin top: 0, left: 0 , right: 0 , bottom: 0
now: margin: top: 64 (xl), left: 0 , right: 0 , bottom: 0

class="nx-margin-s nx-margin-top-xs nx-margin-bottom-m"
before: margin top: 16 (s), left: 16 (s), right: 16 (s), bottom: 24 (m)
now: margin: top: 12 (xs), left: 16 (s), right: 16 (s), bottom: 24 (m)

  • progress-indicator: to fulfill accessibility requirements the variant with a progress bar between steps needs an accessible label. The label can be set with the progressbarAriaLabel or progressbarAriaLabelledBy input. There is an english default but you should set this to a meaningful value for your application. Please see more details in the documentatioon.

DEPRECATIONS

  • swipebar:: The swipebar component has been deprecated and will be removed in the future. Please rely on native scroll bars.
  • button:: the emphasis button has been deprecated and will be removed in the future. Please use the attention button instead.

Documentation 📚

  • swipebar: deprecate swipebar component (88f7127)

Features ✨

  • button: add attention button and deprecate emphasis button (b043927)
  • migrate library to standalone (0a9b4ee)
  • progress-bar: set aria attributes and allow custom ranges (e7fa382)
  • update to Angular 18 (717db8b)

Bug Fixes 🐛

  • avatar: add role image in examples (1209151)
  • datefield: propagate readonly state to all directives and components (8ca1e89)
  • iso-date-adapter: remove automatic lazy loading of locales (edb6909)
  • layout: fix nx-margin-classes for better specificity (3b050dd)
  • radio-button: cannot access radiogroup before initialization error (49a6346)
  • status-icon: add inline-flex to status icon (a5cdc6a)
  • tag: keep focus after tag deleted (c8ee14e)
  • timefield: group time input fields for improved screen reader us… (3bc35e9)
  • timefield: make screen readers read all infos instead of content only (415c553)