ngx-skeleton-loader - npm Package Versions

[2.10.1][] - 2021-07-13

Fixed

• Ensures every ARIA progressbar node has an accessible name. This is caused by missing aria-label on the <span> element.

Thanks @rkristelijn for raising the issue and the pull request!

[2.10.0][] - 2021-06-15

Added

• Adding module configuration support via forRoot() method. Now you can add configure your module via forRoot(). You can now set the default of appearance, animation, theme, loadingText, count and/or items.E.G.

@NgModule({
  // ...
  imports: [NgxSkeletonLoaderModule.forRoot({ appearance: 'circle', count: 3 )],
  // ...
})

[2.9.1][] - 2021-02-20

Fixed

• Adding appearance attribute to be checked via ngOnChanges

Updated

• Updating examples with new features

[2.9.0][] - 2021-02-19

Added

• Adding validation for @Input attributes that needs internal manipulation. After these changes:
  • if count is not a numeric value, it will use the default value as 1
  • if animation is not a valid attribute, it will use the default value as progress
  • PS: The other values alredy have a fallback, so nothing to worry here
• Adding error feedback for appearance attribute in case of wrong configuration. Now it will show a error message on the console in case of receiving a wrong value

Updated

• Adding ngOnChange to validate count input in case of changes via binding
• Updating README.md with information about appearance and theme usage.

[2.8.0][] - 2021-02-18

Fixed

• Using ngAcceptInputType_count for template checking in count input. That solves issue https://github.com/willmendesneto/ngx-skeleton-loader/issues/59. You can find more details about it in https://angular.io/guide/template-typecheck
• Fixing type issues on yarn build:ssr command

Updated

• Updating perf-marks to v1.14.1
• Adding strict mode support in module
• Updating types for theme to match with ngStyle. More details in https://angular.io/api/common/NgStyle#properties

[2.7.0][] - 2021-02-06

Added

• Adding new loadingText attribute to be used as WAI-ARIA aria-valuetext. In this case, it will render the component using "Please wait ...". Otherwise, it defaults to "Loading..."

<!-- Passing loading text to be used as WAI-ARIA `aria-valuetext` -->
<!-- In this case, it will render the component using "Please wait ..." -->
<!-- Otherwise, it defaults to "Loading..." -->
<div class="skeleton-with-specific-loading-text">
  <ngx-skeleton-loader loadingText="Please wait ..."></ngx-skeleton-loader>
</div>

Updated

• Using OnPush as changeDetection mechanism into ngx-skeleton-loader component
• Adding ability to pass false as string or boolean (coming from variable value via binding) on animation attribute in ngx-skeleton-loader component configuration. animation will receive false as string when attribute field it's not using binding. Component now can receive false (boolean), "false" (string), or any other animation type via binding.

<div class="item">
  <!-- Disables the animation -->
  <ngx-skeleton-loader animation="false"></ngx-skeleton-loader>
  <!-- Disables the animation, but receiving boolean value from binding -->
  <!-- Via binding it can receive `false` (boolean), "false" (string), or any other animation type -->
  <ngx-skeleton-loader [animation]="classAttributeWithBooleanFalseValue"></ngx-skeleton-loader>
  <!-- Uses `progress` as animation -->
  <ngx-skeleton-loader animation="progress"></ngx-skeleton-loader>
  <ngx-skeleton-loader></ngx-skeleton-loader>
  <!-- Uses `pulse` as animation -->
  <ngx-skeleton-loader animation="pulse"></ngx-skeleton-loader>
</div>

[2.6.2][] - 2020-12-08

Fixed

• Removing Lighthouse "Avoid non-composited animations" issue. Lighthouse shows warnings from ngx-skeleton-loader.scss -file (progress).

• "Avoid non-composited animations":

• "Animations which are not composited can be janky and contribute to CLS"

To solve that, instead of using CSS background-position the module is now using CSS translate3d, which improves the animation by using GPU instead of CPU. Issue fixed and performance boost added 🎉

[2.6.1][] - 2020-11-30

Fixed

• Solving forRoot() types error Generic type 'ModuleWithProviders<T>' requires 1 type argument(s). Closes https://github.com/willmendesneto/ngx-skeleton-loader/issues/51

[2.6.0][] - 2020-11-15

Added

• Adding NgxSkeletonLoaderModule.forRoot() method. Usage:

import { NgModule } from '@angular/core';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
// ... list of other app dependencies

import { AppComponent } from './app.component';
// ... list of other app components/modules

@NgModule({
  declarations: [AppComponent],
  imports: [NgxSkeletonLoaderModule.forRoot()],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

[2.5.0][] - 2020-10-10

Fixed

• Fixing bundle size command on CircleCI pipeline

Updated

• Upgrading NodeJS to v14.11.0
• Updating perf-marks package to v1.14.0
• Improving skeleton animations fps by using cubic-bezier instead of ease-in-out