0.13.1 Changelog


This build introduces breaking change. Please read below.

Breaking Changes

1 Change

Bugs

3 Bug Fixes

Released

Sep 13, 2018

Sketch template

Light Theme
Dark Theme

Highlights

  • Internationalized titles for accessibility
    Note: version 0.13.1 has been unpublished from npm. Use v0.13.1-patch.1 to avoid a breaking change with this feature.

    In order to improve accessibility of its components, Clarity added a default English title to all icons or non-text interactive elements internal to its components. In order to internationalize them we rely on a ClrCommonStrings service that you can declare for your entire app, which will override our default titles with the ones you provide:

    
    @Injectable()
    export class MyCommonStringsService implements ClrCommonStrings {
      constructor(@Inject(LOCALE_ID) locale: string, server: MyServer) {
        server.fetchTexts(locale).subscribe(texts => {
          // Assign the strings to the correct properties to implement ClrCommonStrings
          this.open = texts.genericOpenText;
          ...
        });
      }
    }
    
    
    @NgModule({
      imports: [...],
      declarations: [...],
      providers: [{ provide: ClrCommonStrings, useClass: MyCommonStringsService }]
    })
    export class AppModule {}
    

    The list of strings available to configure can be found by simply looking at the declaration of the ClrCommonStrings interface, which includes a description for each of them. Here is the current list as of this release:

    
    abstract class ClrCommonStrings {
      /**
       * Open button
       */
      open?: string;
      /**
       * Close button
       */
      close?: string;
      /**
       * Show button
       */
      show?: string;
      /**
       * Hide button
       */
      hide?: string;
      /**
       * Expandable components: expand caret
       */
      expand?: string;
      /**
       * Expandable components: collapse caret
       */
      collapse?: string;
      /**
       * Overflow menus: ellipsis button
       */
      more?: string;
      /**
       * Selectable components: checkbox or radio
       */
      select?: string;
      /**
       * Selectable components: checkbox to select all
       */
      selectAll?: string;
      /**
       * Pagination: previous button
       */
      previous?: string;
      /**
       * Pagination: next button
       */
      next?: string;
      /**
       * Pagination: go to current
       */
      current?: string;
      /**
       * Alert levels: info
       */
      info?: string;
      /**
       * Alert levels: success
       */
      success?: string;
      /**
       * Alert levels: warning
       */
      warning?: string;
      /**
       * Alert levels: danger
       */
      danger?: string;
      /**
       * Datagrid: row actions
       */
      rowActions?: string;
      /**
       * Datagrid: pick columns
       */
      pickColumns?: string;
    }
    

Bug Fixes

  • Reduced the number of outputs emitted by [(clrDgSelected)] to avoid redundant outputs. (#2632).
  • Handled a change in Angular CLI v6.2 and above when using ng add @clr/angular. (#2650).
  • Fixed radio indexes in a datagrid to not double increment. (#2645).