ngx-skeleton-loader - npm Package Versions

[11.0.0][] - 2025-04-09

Updated

• Upgrading project to use Node.js v22.14.0
• Upgrading project to Angular v19
• Removing [ngStyle] and [ngClass] in favor of [style] and [class], respectively. These directives are expected to be removed in future Angular versions, since their behavior can be replicated using native bindings. This change also reduces the initial bundle size for applications that don’t use these directives.

[10.0.0][] - 2025-01-24

Removed

• Removing warnings in dev mode in favor of typed angular signals integration. It should not affect consumers in general, but it will be released as a major version, since this project follows the SEMVER standards

Updated

Thanks to @lekhmanrus

• Upgrading @angular/* packages to v19 - https://github.com/willmendesneto/ngx-skeleton-loader/pull/179
• Implementing Angular Signals integration - https://github.com/willmendesneto/ngx-skeleton-loader/pull/179
• Making NGX-Skeleton-Loader Standalone Compliant - Closes https://github.com/willmendesneto/ngx-skeleton-loader/issues/183

Added

• Adding PUBLISHING_HOTFIX.md file describing all the steps to cover a hotfix in older version of NGX-Skeleton-Loader module

[9.0.0][] - 2024-01-13

Updated

• Upgrading @angular/* packages to v17
• Upgrading NodeJS to v20.10.0

[8.1.0][] - 2023-09-12

Fixed

• fixing issue with optional chaining not being supported on apps using Angular CLI <=v11;

Updated

• Updated input values validation in order to remove optional chaining. Instead, the code is now using object destructuring to get config theme value;

[8.0.2][] - 2023-09-11

Fixed

• Fixing README.md docs

[8.0.1][] - 2023-08-30

Fixed

• Fixing CSS reduce motion in MacOS;

[8.0.0][] - 2023-06-20

Updated

• Updating project to support Angular v16;
• Updating NodeJS version to v18;
• Updating peerDependencies to point to latest @angular/* packages;

Removed

• Removing perf-marks dependency library;

[7.0.0][] - 2023-02-04

Added

• Adding support for extending global theme added via NgxSkeletonLoaderModule.forRoot({ theme: /* ...list of CSS atributes */} })

By default when using NgxSkeletonLoaderModule.forRoot({ theme: /* ...list of CSS atributes */} }) the application is using this value as source of truth, overriding any local theming passed to <ngx-skeleton-loader> component via [theme] input.

By using NgxSkeletonLoaderModule.forRoot({ theme: { extendsFromRoot: true, /* ...list of CSS atributes */} }) in your application, you should also be aware that:

• By default, every <ngx-skeleton-loader> component will use theme coming from NgxSkeletonLoaderModule.forRoot() as the source of truth
• If there's any CSS attribute on the component locally which overrides the CSS spec, it combines both themes, but overriding global CSS attributes in favor of local ones.

<!-- 
  // ... E.G: App is using this configuration below

  NgxSkeletonLoaderModule.forRoot({
    theme: {
      // Enabliong theme combination
      extendsFromRoot: true,
      // ... list of CSS theme attributes
      height: '30px',
    },
  }),
-->

<div class="item">
  <ngx-skeleton-loader></ngx-skeleton-loader>
  <!-- above line will produce a skeleton component using `height: 30px;`" -->
  <ngx-skeleton-loader [theme]="{background: 'blue'}"></ngx-skeleton-loader>
  <!-- above line will produce a skeleton component using `height: 30px; background: blue;`" -->
  <ngx-skeleton-loader [theme]="{height: '50px', background: 'red'}"></ngx-skeleton-loader>
  <!-- above line will produce a skeleton component using `height: 50px; background: red;`" -->
</div>

• Adding new custom-content appearance. From now on, consumers can now add their own content inside <ng-skeleton-loader></ng-skeleton-loader> component. So that, they can add some custom content, such as SVG, as an example
• Adding examples for custom-content usage

Updated

• Updagrading module to Angular v15

Fixed

• Removing build warnings

[6.0.0][] - 2022-08-18

Updated

• Adding Publishing setup using NPX
• Replacing CSS class namespace from .loader to .skeleton-loader

Breaking Change

The CSS class used as namespace was changed. Previously, it was called .loader and now is .skeleton-loader. It might cause some issues in cases of :host DOM style scoping usage. For the sake of semantic versioning, please bear in mind this scenario in case of :host usage.

[5.0.0][] - 2022-02-08

Updated

Thanks @yharaskrik

Breaking Change

Bundle distribution are now esm2020, fesm2015 and fesm2020. UMD and CommonJS versions were support were removed from Angular CLI directly. So the next version for the package will be a major version to cover these changes accordingly.

• Updating package bundle distribution
• Updating @angular/cli to v13
• Applying project changes to v13
• Updating bundlesize check to point to fesm2020