ng-auto-animate 0.0.2 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,18 +1,27 @@
1
1
  # ng-auto-animate
2
2
 
3
- An Angular Directive to use FormKit's [auto-animate](https://auto-animate.formkit.com) library, within Angular projects.
3
+ An Angular Directive to use FormKit's [`auto-animate`](https://auto-animate.formkit.com) library, within Angular projects.
4
4
 
5
5
  ### Highlights:
6
6
  - ✅ Standalone Directive, for Angular v14 and above. Tested on Node 18.x, but should work on previous versions.
7
- - ✅ Custom `InjectionToken` for configuring global settings.
8
- - 🚫 Currently, does not support [plugins](https://auto-animate.formkit.com/#plugins). WIP: See [#5](https://github.com/ajitzero/ng-auto-animate/issues/5).
7
+ - ✅ Custom `InjectionToken` for configuring global settings and plugins.
9
8
 
10
9
  ### Why a new wrapper library?
11
- A publishable library for Angular needs `ng-packr` and Angular CLI for proper scaffolding and finalized formatting. Migrating the repository structure for `auto-animate` is a non-trivial ask, and would need an unbiased build system like [Nx](https://nx.dev) (which I am using here) or some other similar tool.
10
+ A publishable library for Angular needs [`ng-packagr`](https://github.com/ng-packagr/ng-packagr) and Angular CLI for proper scaffolding and finalized formatting. Migrating the repository structure for `auto-animate` is a non-trivial ask, and would need an unbiased build system like [Nx](https://nx.dev) (which I am using here) or some other similar tool.
12
11
 
13
- [Justin Schroeder](https://github.com/justin-schroeder), the creator of `auto-animate`, has been supportive towards [contributions](https://github.com/formkit/auto-animate/pull/38) for Angular intergation, but he himself [does not work with Angular](https://github.com/formkit/auto-animate/issues/72#issuecomment-1222732238) and is unable to actively work towards this. I too would not be able to do much in his shoes, especially when it requires replacing all build actions, scripts and the project structure, all just to support one framework.
12
+ [Justin Schroeder](https://github.com/justin-schroeder), the creator of [`auto-animate`](https://auto-animate.formkit.com), has been supportive towards [contributions](https://github.com/formkit/auto-animate/pull/38) for Angular integration, but he [does not work with Angular](https://github.com/formkit/auto-animate/issues/72#issuecomment-1222732238) and is unable to work towards this actively. I, too, would not be able to do much in his shoes, especially when it requires replacing all build actions, scripts and the project structure, all to support a single framework.
14
13
 
15
- If there is a simpler solution, I would be willing to submit a PR with my changes here into the original project.
14
+ If there is a simpler solution, I would be willing to submit a PR with my changes here to the original project, especially the support fot global options/plugin via an `InjectionToken`.
15
+
16
+ ### Installation
17
+ 1. Install the peer dependency.
18
+ ```bash
19
+ npm i @formkit/auto-animate
20
+ ```
21
+ 1. Install this package.
22
+ ```bash
23
+ npm i ng-auto-animate
24
+ ```
16
25
 
17
26
  ### Usage
18
27
  1. Default usage:
@@ -67,10 +76,18 @@ If there is a simpler solution, I would be willing to submit a PR with my change
67
76
  </p>
68
77
  </article>
69
78
  ```
79
+ 1. Pass a custom plugin
80
+ > See example here in the [demo app](https://github.com/ajitzero/ng-auto-animate/blob/db96f472e479b21167853c644483a90b18c2b513/apps/demo/src/app/app.component.ts#L68).
81
+ ```ts
82
+ customPlugin: AutoAnimationPlugin = (...) => {...};
83
+ ```
84
+ ```html
85
+ <article [auto-animate]="customPlugin">...</article>
86
+ ```
70
87
 
71
88
  ### Missing support for something?
72
89
 
73
- Go through existing issues if your problem is already being tracked, otherwise [raise an issue!](https://github.com/ajitzero/ng-auto-animate/issues/new)
90
+ Go through existing issues if your problem is already being tracked; otherwise, [raise an issue!](https://github.com/ajitzero/ng-auto-animate/issues/new/choose)
74
91
 
75
92
  ### License
76
93
 
@@ -1,7 +1,8 @@
1
1
  import { Directive, ElementRef, InjectionToken, Input, inject } from '@angular/core';
2
2
  import autoAnimate from '@formkit/auto-animate';
3
3
  import * as i0 from "@angular/core";
4
- export const GLOBAL_AUTO_ANIMATE_OPTIONS = new InjectionToken('Global AutoAnimate Options', {
4
+ const isPlugin = (config) => typeof config === 'function';
5
+ export const GLOBAL_AUTO_ANIMATE_OPTIONS = new InjectionToken('Global AutoAnimate Options or Plugin', {
5
6
  factory: () => ({}),
6
7
  });
7
8
  class NgAutoAnimateDirective {
@@ -11,10 +12,25 @@ class NgAutoAnimateDirective {
11
12
  this._options = {};
12
13
  }
13
14
  set explicitOptions(_options) {
14
- this._options = {
15
- ...this.globalOptions,
16
- ...(typeof _options === 'string' ? {} : _options),
17
- };
15
+ if (typeof _options === 'string') {
16
+ // Default case, when no options or plugin is passed
17
+ this._options = this.globalOptions;
18
+ }
19
+ else {
20
+ // When either some options or a plugin is passed
21
+ if (isPlugin(this.globalOptions) || isPlugin(_options)) {
22
+ // A plugin must replace any previously set options or plugin.
23
+ // A plugin must be replaced by options or another plugin.
24
+ this._options = _options;
25
+ }
26
+ else {
27
+ // When plugins are not involved
28
+ this._options = {
29
+ ...this.globalOptions,
30
+ ..._options,
31
+ };
32
+ }
33
+ }
18
34
  }
19
35
  get options() {
20
36
  return this._options;
@@ -36,4 +52,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.6", ngImpor
36
52
  type: Input,
37
53
  args: ['auto-animate']
38
54
  }] } });
39
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctYXV0by1hbmltYXRlLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvbmctYXV0by1hbmltYXRlL3NyYy9saWIvbmctYXV0by1hbmltYXRlLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQWlCLFNBQVMsRUFBRSxVQUFVLEVBQUUsY0FBYyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDcEcsT0FBTyxXQUFtQyxNQUFNLHVCQUF1QixDQUFDOztBQUV4RSxNQUFNLENBQUMsTUFBTSwyQkFBMkIsR0FBRyxJQUFJLGNBQWMsQ0FDM0QsNEJBQTRCLEVBQUU7SUFDOUIsT0FBTyxFQUFFLEdBQUcsRUFBRSxDQUFDLENBQUMsRUFBRSxDQUFDO0NBQ3BCLENBQUMsQ0FBQztBQUVILE1BSWEsc0JBQXNCO0lBSm5DO1FBS1UsT0FBRSxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsQ0FBQztRQUN4QixrQkFBYSxHQUFHLE1BQU0sQ0FBQywyQkFBMkIsQ0FBQyxDQUFDO1FBWXBELGFBQVEsR0FBZ0MsRUFBRSxDQUFDO0tBS3BEO0lBZkMsSUFDSSxlQUFlLENBQUMsUUFBOEM7UUFDaEUsSUFBSSxDQUFDLFFBQVEsR0FBRztZQUNkLEdBQUcsSUFBSSxDQUFDLGFBQWE7WUFDckIsR0FBRyxDQUFDLE9BQU8sUUFBUSxLQUFLLFFBQVEsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUM7U0FDbEQsQ0FBQztJQUNKLENBQUM7SUFDRCxJQUFJLE9BQU87UUFDVCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQztJQUdELGVBQWU7UUFDYixXQUFXLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLEVBQUUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ25ELENBQUM7OEdBbEJVLHNCQUFzQjtrR0FBdEIsc0JBQXNCOztTQUF0QixzQkFBc0I7MkZBQXRCLHNCQUFzQjtrQkFKbEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZ0JBQWdCO29CQUMxQixVQUFVLEVBQUUsSUFBSTtpQkFDakI7OEJBTUssZUFBZTtzQkFEbEIsS0FBSzt1QkFBQyxjQUFjIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQWZ0ZXJWaWV3SW5pdCwgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbmplY3Rpb25Ub2tlbiwgSW5wdXQsIGluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IGF1dG9BbmltYXRlLCB7IEF1dG9BbmltYXRlT3B0aW9ucyB9IGZyb20gJ0Bmb3Jta2l0L2F1dG8tYW5pbWF0ZSc7XG5cbmV4cG9ydCBjb25zdCBHTE9CQUxfQVVUT19BTklNQVRFX09QVElPTlMgPSBuZXcgSW5qZWN0aW9uVG9rZW48UGFydGlhbDxBdXRvQW5pbWF0ZU9wdGlvbnM+PihcbiAgJ0dsb2JhbCBBdXRvQW5pbWF0ZSBPcHRpb25zJywge1xuICBmYWN0b3J5OiAoKSA9PiAoe30pLFxufSk7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1thdXRvLWFuaW1hdGVdJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbn0pXG5leHBvcnQgY2xhc3MgTmdBdXRvQW5pbWF0ZURpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuICBwcml2YXRlIGVsID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuICBwcml2YXRlIGdsb2JhbE9wdGlvbnMgPSBpbmplY3QoR0xPQkFMX0FVVE9fQU5JTUFURV9PUFRJT05TKTtcblxuICBASW5wdXQoJ2F1dG8tYW5pbWF0ZScpXG4gIHNldCBleHBsaWNpdE9wdGlvbnMoX29wdGlvbnM6IFBhcnRpYWw8QXV0b0FuaW1hdGVPcHRpb25zPiB8IHN0cmluZykge1xuICAgIHRoaXMuX29wdGlvbnMgPSB7XG4gICAgICAuLi50aGlzLmdsb2JhbE9wdGlvbnMsXG4gICAgICAuLi4odHlwZW9mIF9vcHRpb25zID09PSAnc3RyaW5nJyA/IHt9IDogX29wdGlvbnMpLFxuICAgIH07XG4gIH1cbiAgZ2V0IG9wdGlvbnMoKSB7XG4gICAgcmV0dXJuIHRoaXMuX29wdGlvbnM7XG4gIH1cbiAgcHJpdmF0ZSBfb3B0aW9uczogUGFydGlhbDxBdXRvQW5pbWF0ZU9wdGlvbnM+ID0ge307XG5cbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgIGF1dG9BbmltYXRlKHRoaXMuZWwubmF0aXZlRWxlbWVudCwgdGhpcy5vcHRpb25zKTtcbiAgfVxufVxuIl19
55
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctYXV0by1hbmltYXRlLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvbmctYXV0by1hbmltYXRlL3NyYy9saWIvbmctYXV0by1hbmltYXRlLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQWlCLFNBQVMsRUFBRSxVQUFVLEVBQUUsY0FBYyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDcEcsT0FBTyxXQUF3RCxNQUFNLHVCQUF1QixDQUFDOztBQUU3RixNQUFNLFFBQVEsR0FBRyxDQUFDLE1BQXlELEVBQUUsRUFBRSxDQUM3RSxPQUFPLE1BQU0sS0FBSyxVQUFVLENBQUM7QUFFL0IsTUFBTSxDQUFDLE1BQU0sMkJBQTJCLEdBQUcsSUFBSSxjQUFjLENBQzNELHNDQUFzQyxFQUFFO0lBQ3hDLE9BQU8sRUFBRSxHQUFHLEVBQUUsQ0FBQyxDQUFDLEVBQUUsQ0FBQztDQUNwQixDQUFDLENBQUM7QUFFSCxNQUlhLHNCQUFzQjtJQUpuQztRQUtVLE9BQUUsR0FBRyxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUM7UUFDeEIsa0JBQWEsR0FBRyxNQUFNLENBQUMsMkJBQTJCLENBQUMsQ0FBQztRQXlCcEQsYUFBUSxHQUFzRCxFQUFFLENBQUM7S0FLMUU7SUE1QkMsSUFDSSxlQUFlLENBQUMsUUFBb0U7UUFDdEYsSUFBSSxPQUFPLFFBQVEsS0FBSyxRQUFRLEVBQUU7WUFDaEMsb0RBQW9EO1lBQ3BELElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQztTQUNwQzthQUFNO1lBQ0wsaURBQWlEO1lBQ2pELElBQUksUUFBUSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxRQUFRLENBQUMsUUFBUSxDQUFDLEVBQUU7Z0JBQ3RELDhEQUE4RDtnQkFDOUQsMERBQTBEO2dCQUMxRCxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQzthQUMxQjtpQkFBTTtnQkFDTCxnQ0FBZ0M7Z0JBQ2hDLElBQUksQ0FBQyxRQUFRLEdBQUc7b0JBQ2QsR0FBRyxJQUFJLENBQUMsYUFBYTtvQkFDckIsR0FBRyxRQUFRO2lCQUNaLENBQUM7YUFDSDtTQUNGO0lBQ0gsQ0FBQztJQUNELElBQUksT0FBTztRQUNULE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUN2QixDQUFDO0lBR0QsZUFBZTtRQUNiLFdBQVcsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDbkQsQ0FBQzs4R0EvQlUsc0JBQXNCO2tHQUF0QixzQkFBc0I7O1NBQXRCLHNCQUFzQjsyRkFBdEIsc0JBQXNCO2tCQUpsQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxnQkFBZ0I7b0JBQzFCLFVBQVUsRUFBRSxJQUFJO2lCQUNqQjs4QkFNSyxlQUFlO3NCQURsQixLQUFLO3VCQUFDLGNBQWMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBZnRlclZpZXdJbml0LCBEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIEluamVjdGlvblRva2VuLCBJbnB1dCwgaW5qZWN0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgYXV0b0FuaW1hdGUsIHsgQXV0b0FuaW1hdGVPcHRpb25zLCBBdXRvQW5pbWF0aW9uUGx1Z2luIH0gZnJvbSAnQGZvcm1raXQvYXV0by1hbmltYXRlJztcblxuY29uc3QgaXNQbHVnaW4gPSAoY29uZmlnOiBQYXJ0aWFsPEF1dG9BbmltYXRlT3B0aW9ucz4gfCBBdXRvQW5pbWF0aW9uUGx1Z2luKSA9PlxuICB0eXBlb2YgY29uZmlnID09PSAnZnVuY3Rpb24nO1xuXG5leHBvcnQgY29uc3QgR0xPQkFMX0FVVE9fQU5JTUFURV9PUFRJT05TID0gbmV3IEluamVjdGlvblRva2VuPFBhcnRpYWw8QXV0b0FuaW1hdGVPcHRpb25zPiB8IEF1dG9BbmltYXRpb25QbHVnaW4+KFxuICAnR2xvYmFsIEF1dG9BbmltYXRlIE9wdGlvbnMgb3IgUGx1Z2luJywge1xuICBmYWN0b3J5OiAoKSA9PiAoe30pLFxufSk7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1thdXRvLWFuaW1hdGVdJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbn0pXG5leHBvcnQgY2xhc3MgTmdBdXRvQW5pbWF0ZURpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuICBwcml2YXRlIGVsID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuICBwcml2YXRlIGdsb2JhbE9wdGlvbnMgPSBpbmplY3QoR0xPQkFMX0FVVE9fQU5JTUFURV9PUFRJT05TKTtcblxuICBASW5wdXQoJ2F1dG8tYW5pbWF0ZScpXG4gIHNldCBleHBsaWNpdE9wdGlvbnMoX29wdGlvbnM6IFBhcnRpYWw8QXV0b0FuaW1hdGVPcHRpb25zPiB8IEF1dG9BbmltYXRpb25QbHVnaW4gfCBzdHJpbmcpIHtcbiAgICBpZiAodHlwZW9mIF9vcHRpb25zID09PSAnc3RyaW5nJykge1xuICAgICAgLy8gRGVmYXVsdCBjYXNlLCB3aGVuIG5vIG9wdGlvbnMgb3IgcGx1Z2luIGlzIHBhc3NlZFxuICAgICAgdGhpcy5fb3B0aW9ucyA9IHRoaXMuZ2xvYmFsT3B0aW9ucztcbiAgICB9IGVsc2Uge1xuICAgICAgLy8gV2hlbiBlaXRoZXIgc29tZSBvcHRpb25zIG9yIGEgcGx1Z2luIGlzIHBhc3NlZFxuICAgICAgaWYgKGlzUGx1Z2luKHRoaXMuZ2xvYmFsT3B0aW9ucykgfHwgaXNQbHVnaW4oX29wdGlvbnMpKSB7XG4gICAgICAgIC8vIEEgcGx1Z2luIG11c3QgcmVwbGFjZSBhbnkgcHJldmlvdXNseSBzZXQgb3B0aW9ucyBvciBwbHVnaW4uXG4gICAgICAgIC8vIEEgcGx1Z2luIG11c3QgYmUgcmVwbGFjZWQgYnkgb3B0aW9ucyBvciBhbm90aGVyIHBsdWdpbi5cbiAgICAgICAgdGhpcy5fb3B0aW9ucyA9IF9vcHRpb25zO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgLy8gV2hlbiBwbHVnaW5zIGFyZSBub3QgaW52b2x2ZWRcbiAgICAgICAgdGhpcy5fb3B0aW9ucyA9IHtcbiAgICAgICAgICAuLi50aGlzLmdsb2JhbE9wdGlvbnMsXG4gICAgICAgICAgLi4uX29wdGlvbnMsXG4gICAgICAgIH07XG4gICAgICB9XG4gICAgfVxuICB9XG4gIGdldCBvcHRpb25zKCkge1xuICAgIHJldHVybiB0aGlzLl9vcHRpb25zO1xuICB9XG4gIHByaXZhdGUgX29wdGlvbnM6IFBhcnRpYWw8QXV0b0FuaW1hdGVPcHRpb25zPiB8IEF1dG9BbmltYXRpb25QbHVnaW4gPSB7fTtcblxuICBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgYXV0b0FuaW1hdGUodGhpcy5lbC5uYXRpdmVFbGVtZW50LCB0aGlzLm9wdGlvbnMpO1xuICB9XG59XG4iXX0=
@@ -2,7 +2,8 @@ import * as i0 from '@angular/core';
2
2
  import { InjectionToken, inject, ElementRef, Directive, Input } from '@angular/core';
3
3
  import autoAnimate from '@formkit/auto-animate';
4
4
 
5
- const GLOBAL_AUTO_ANIMATE_OPTIONS = new InjectionToken('Global AutoAnimate Options', {
5
+ const isPlugin = (config) => typeof config === 'function';
6
+ const GLOBAL_AUTO_ANIMATE_OPTIONS = new InjectionToken('Global AutoAnimate Options or Plugin', {
6
7
  factory: () => ({}),
7
8
  });
8
9
  class NgAutoAnimateDirective {
@@ -12,10 +13,25 @@ class NgAutoAnimateDirective {
12
13
  this._options = {};
13
14
  }
14
15
  set explicitOptions(_options) {
15
- this._options = {
16
- ...this.globalOptions,
17
- ...(typeof _options === 'string' ? {} : _options),
18
- };
16
+ if (typeof _options === 'string') {
17
+ // Default case, when no options or plugin is passed
18
+ this._options = this.globalOptions;
19
+ }
20
+ else {
21
+ // When either some options or a plugin is passed
22
+ if (isPlugin(this.globalOptions) || isPlugin(_options)) {
23
+ // A plugin must replace any previously set options or plugin.
24
+ // A plugin must be replaced by options or another plugin.
25
+ this._options = _options;
26
+ }
27
+ else {
28
+ // When plugins are not involved
29
+ this._options = {
30
+ ...this.globalOptions,
31
+ ..._options,
32
+ };
33
+ }
34
+ }
19
35
  }
20
36
  get options() {
21
37
  return this._options;
@@ -1 +1 @@
1
- {"version":3,"file":"ng-auto-animate.mjs","sources":["../../../../libs/ng-auto-animate/src/lib/ng-auto-animate.directive.ts","../../../../libs/ng-auto-animate/src/ng-auto-animate.ts"],"sourcesContent":["import { AfterViewInit, Directive, ElementRef, InjectionToken, Input, inject } from '@angular/core';\nimport autoAnimate, { AutoAnimateOptions } from '@formkit/auto-animate';\n\nexport const GLOBAL_AUTO_ANIMATE_OPTIONS = new InjectionToken<Partial<AutoAnimateOptions>>(\n 'Global AutoAnimate Options', {\n factory: () => ({}),\n});\n\n@Directive({\n selector: '[auto-animate]',\n standalone: true,\n})\nexport class NgAutoAnimateDirective implements AfterViewInit {\n private el = inject(ElementRef);\n private globalOptions = inject(GLOBAL_AUTO_ANIMATE_OPTIONS);\n\n @Input('auto-animate')\n set explicitOptions(_options: Partial<AutoAnimateOptions> | string) {\n this._options = {\n ...this.globalOptions,\n ...(typeof _options === 'string' ? {} : _options),\n };\n }\n get options() {\n return this._options;\n }\n private _options: Partial<AutoAnimateOptions> = {};\n\n ngAfterViewInit(): void {\n autoAnimate(this.el.nativeElement, this.options);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAGa,2BAA2B,GAAG,IAAI,cAAc,CAC3D,4BAA4B,EAAE;AAC9B,IAAA,OAAO,EAAE,OAAO,EAAE,CAAC;AACpB,CAAA,EAAE;AAEH,MAIa,sBAAsB,CAAA;AAJnC,IAAA,WAAA,GAAA;AAKU,QAAA,IAAA,CAAA,EAAE,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;AACxB,QAAA,IAAA,CAAA,aAAa,GAAG,MAAM,CAAC,2BAA2B,CAAC,CAAC;QAYpD,IAAQ,CAAA,QAAA,GAAgC,EAAE,CAAC;AAKpD,KAAA;IAfC,IACI,eAAe,CAAC,QAA8C,EAAA;QAChE,IAAI,CAAC,QAAQ,GAAG;YACd,GAAG,IAAI,CAAC,aAAa;AACrB,YAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,GAAG,EAAE,GAAG,QAAQ,CAAC;SAClD,CAAC;KACH;AACD,IAAA,IAAI,OAAO,GAAA;QACT,OAAO,IAAI,CAAC,QAAQ,CAAC;KACtB;IAGD,eAAe,GAAA;QACb,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;KAClD;8GAlBU,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,eAAA,EAAA,CAAA,cAAA,EAAA,iBAAA,CAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAJlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA,CAAA;8BAMK,eAAe,EAAA,CAAA;sBADlB,KAAK;uBAAC,cAAc,CAAA;;;AChBvB;;AAEG;;;;"}
1
+ {"version":3,"file":"ng-auto-animate.mjs","sources":["../../../../libs/ng-auto-animate/src/lib/ng-auto-animate.directive.ts","../../../../libs/ng-auto-animate/src/ng-auto-animate.ts"],"sourcesContent":["import { AfterViewInit, Directive, ElementRef, InjectionToken, Input, inject } from '@angular/core';\nimport autoAnimate, { AutoAnimateOptions, AutoAnimationPlugin } from '@formkit/auto-animate';\n\nconst isPlugin = (config: Partial<AutoAnimateOptions> | AutoAnimationPlugin) =>\n typeof config === 'function';\n\nexport const GLOBAL_AUTO_ANIMATE_OPTIONS = new InjectionToken<Partial<AutoAnimateOptions> | AutoAnimationPlugin>(\n 'Global AutoAnimate Options or Plugin', {\n factory: () => ({}),\n});\n\n@Directive({\n selector: '[auto-animate]',\n standalone: true,\n})\nexport class NgAutoAnimateDirective implements AfterViewInit {\n private el = inject(ElementRef);\n private globalOptions = inject(GLOBAL_AUTO_ANIMATE_OPTIONS);\n\n @Input('auto-animate')\n set explicitOptions(_options: Partial<AutoAnimateOptions> | AutoAnimationPlugin | string) {\n if (typeof _options === 'string') {\n // Default case, when no options or plugin is passed\n this._options = this.globalOptions;\n } else {\n // When either some options or a plugin is passed\n if (isPlugin(this.globalOptions) || isPlugin(_options)) {\n // A plugin must replace any previously set options or plugin.\n // A plugin must be replaced by options or another plugin.\n this._options = _options;\n } else {\n // When plugins are not involved\n this._options = {\n ...this.globalOptions,\n ..._options,\n };\n }\n }\n }\n get options() {\n return this._options;\n }\n private _options: Partial<AutoAnimateOptions> | AutoAnimationPlugin = {};\n\n ngAfterViewInit(): void {\n autoAnimate(this.el.nativeElement, this.options);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAGA,MAAM,QAAQ,GAAG,CAAC,MAAyD,KACzE,OAAO,MAAM,KAAK,UAAU,CAAC;MAElB,2BAA2B,GAAG,IAAI,cAAc,CAC3D,sCAAsC,EAAE;AACxC,IAAA,OAAO,EAAE,OAAO,EAAE,CAAC;AACpB,CAAA,EAAE;AAEH,MAIa,sBAAsB,CAAA;AAJnC,IAAA,WAAA,GAAA;AAKU,QAAA,IAAA,CAAA,EAAE,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;AACxB,QAAA,IAAA,CAAA,aAAa,GAAG,MAAM,CAAC,2BAA2B,CAAC,CAAC;QAyBpD,IAAQ,CAAA,QAAA,GAAsD,EAAE,CAAC;AAK1E,KAAA;IA5BC,IACI,eAAe,CAAC,QAAoE,EAAA;AACtF,QAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;;AAEhC,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC;AACpC,SAAA;AAAM,aAAA;;YAEL,IAAI,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,EAAE;;;AAGtD,gBAAA,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAC1B,aAAA;AAAM,iBAAA;;gBAEL,IAAI,CAAC,QAAQ,GAAG;oBACd,GAAG,IAAI,CAAC,aAAa;AACrB,oBAAA,GAAG,QAAQ;iBACZ,CAAC;AACH,aAAA;AACF,SAAA;KACF;AACD,IAAA,IAAI,OAAO,GAAA;QACT,OAAO,IAAI,CAAC,QAAQ,CAAC;KACtB;IAGD,eAAe,GAAA;QACb,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;KAClD;8GA/BU,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,eAAA,EAAA,CAAA,cAAA,EAAA,iBAAA,CAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAJlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA,CAAA;8BAMK,eAAe,EAAA,CAAA;sBADlB,KAAK;uBAAC,cAAc,CAAA;;;ACnBvB;;AAEG;;;;"}
@@ -1,12 +1,12 @@
1
1
  import { AfterViewInit, InjectionToken } from '@angular/core';
2
- import { AutoAnimateOptions } from '@formkit/auto-animate';
2
+ import { AutoAnimateOptions, AutoAnimationPlugin } from '@formkit/auto-animate';
3
3
  import * as i0 from "@angular/core";
4
- export declare const GLOBAL_AUTO_ANIMATE_OPTIONS: InjectionToken<Partial<AutoAnimateOptions>>;
4
+ export declare const GLOBAL_AUTO_ANIMATE_OPTIONS: InjectionToken<Partial<AutoAnimateOptions> | AutoAnimationPlugin>;
5
5
  export declare class NgAutoAnimateDirective implements AfterViewInit {
6
6
  private el;
7
7
  private globalOptions;
8
- set explicitOptions(_options: Partial<AutoAnimateOptions> | string);
9
- get options(): Partial<AutoAnimateOptions>;
8
+ set explicitOptions(_options: Partial<AutoAnimateOptions> | AutoAnimationPlugin | string);
9
+ get options(): Partial<AutoAnimateOptions> | AutoAnimationPlugin;
10
10
  private _options;
11
11
  ngAfterViewInit(): void;
12
12
  static ɵfac: i0.ɵɵFactoryDeclaration<NgAutoAnimateDirective, never>;
package/package.json CHANGED
@@ -1,6 +1,10 @@
1
1
  {
2
2
  "name": "ng-auto-animate",
3
- "version": "0.0.2",
3
+ "version": "0.1.1",
4
+ "description": "Add motion to your apps with a single line of code. An Angular Directive to use FormKit's auto-animate library.",
5
+ "repository": "https://github.com/ajitzero/ng-auto-animate.git",
6
+ "author": "Ajit Panigrahi <hello@ajitpanigrahi.com>",
7
+ "license": "MIT",
4
8
  "peerDependencies": {
5
9
  "@angular/common": "^16.0.0",
6
10
  "@angular/core": "^16.0.0",