ngx-fixed-footer 3.2.1 → 4.0.0
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 +3 -2
- package/fesm2022/ngx-fixed-footer.mjs +4 -5
- package/fesm2022/ngx-fixed-footer.mjs.map +1 -1
- package/index.d.ts +41 -5
- package/package.json +3 -4
- package/lib/ngx-fixed-footer.constants.d.ts +0 -4
- package/lib/ngx-fixed-footer.directive.d.ts +0 -25
- package/lib/ngx-fixed-footer.interface.d.ts +0 -5
- package/lib/ngx-fixed-footer.provider.d.ts +0 -4
- package/public-api.d.ts +0 -4
package/README.md
CHANGED
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
|
|
15
15
|
> Angular directive that adds fixed footer without overlap
|
|
16
16
|
|
|
17
|
-
> ✓ _Angular
|
|
17
|
+
> ✓ _Angular 20 compatible_
|
|
18
18
|
|
|
19
19
|
Here's the [demo](http://celtian.github.io/ngx-fixed-footer/) or [stackblitz live preview](https://stackblitz.com/edit/ngx-fixed-footer) or [codesandbox live preview](https://codesandbox.io/s/ngx-fixed-footer-m4f21)
|
|
20
20
|
|
|
@@ -130,7 +130,8 @@ _Each directive can override global options._
|
|
|
130
130
|
|
|
131
131
|
| Angular | ngx-fixed-footer | Install |
|
|
132
132
|
| --------- | ---------------- | ----------------------------- |
|
|
133
|
-
| >=
|
|
133
|
+
| >= 20 | 4.x | `yarn add ngx-fixed-footer` |
|
|
134
|
+
| >= 18 | 3.x | `yarn add ngx-fixed-footer@3` |
|
|
134
135
|
| >= 14 | 2.x | `yarn add ngx-fixed-footer@2` |
|
|
135
136
|
| >= 12 | 1.x | `yarn add ngx-fixed-footer@1` |
|
|
136
137
|
| >= 5 < 13 | 0.x | `yarn add ngx-fixed-footer@0` |
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { DOCUMENT } from '@angular/common';
|
|
2
1
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { InjectionToken, inject, ElementRef, Renderer2, signal, input, computed, effect, Directive } from '@angular/core';
|
|
2
|
+
import { InjectionToken, inject, DOCUMENT, ElementRef, Renderer2, signal, input, computed, effect, Directive } from '@angular/core';
|
|
4
3
|
|
|
5
4
|
const DEFAULT_CSS_ATTRIBUTE = 'padding';
|
|
6
5
|
const DEFAULT_CONTAINER_SELECTOR = '[role="main"]';
|
|
@@ -107,10 +106,10 @@ class NgxFixedFooterDirective {
|
|
|
107
106
|
get html() {
|
|
108
107
|
return this.el.nativeElement;
|
|
109
108
|
}
|
|
110
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
111
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
109
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: NgxFixedFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
110
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.0", type: NgxFixedFooterDirective, isStandalone: true, selector: "[ngxFixedFooter]", inputs: { containerSelector: { classPropertyName: "containerSelector", publicName: "containerSelector", isSignal: true, isRequired: false, transformFunction: null }, cssAttribute: { classPropertyName: "cssAttribute", publicName: "cssAttribute", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
112
111
|
}
|
|
113
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
112
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: NgxFixedFooterDirective, decorators: [{
|
|
114
113
|
type: Directive,
|
|
115
114
|
args: [{
|
|
116
115
|
selector: '[ngxFixedFooter]'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngx-fixed-footer.mjs","sources":["../../../projects/ngx-fixed-footer/src/lib/ngx-fixed-footer.constants.ts","../../../projects/ngx-fixed-footer/src/lib/ngx-fixed-footer.provider.ts","../../../projects/ngx-fixed-footer/src/lib/ngx-fixed-footer.directive.ts","../../../projects/ngx-fixed-footer/src/public-api.ts","../../../projects/ngx-fixed-footer/src/ngx-fixed-footer.ts"],"sourcesContent":["import { NgxFixedFooterOptions } from './ngx-fixed-footer.interface';\n\nexport const DEFAULT_CSS_ATTRIBUTE = 'padding';\nexport const DEFAULT_CONTAINER_SELECTOR = '[role=\"main\"]';\nexport const DEFAULT_FIXED_FOOTER_OPTIONS: NgxFixedFooterOptions = {\n containerSelector: DEFAULT_CONTAINER_SELECTOR,\n cssAttribute: DEFAULT_CSS_ATTRIBUTE\n};\n","import { InjectionToken, Provider } from '@angular/core';\nimport { DEFAULT_CONTAINER_SELECTOR, DEFAULT_CSS_ATTRIBUTE } from './ngx-fixed-footer.constants';\nimport { NgxFixedFooterOptions } from './ngx-fixed-footer.interface';\n\nexport const APP_FIXED_FOOTER_OPTIONS_TOKEN = new InjectionToken<NgxFixedFooterOptions>('[ngxFixedFooter] Options');\n\nexport const provideFixedFooter = (options: Partial<NgxFixedFooterOptions>): Provider => {\n return {\n provide: APP_FIXED_FOOTER_OPTIONS_TOKEN,\n useValue: {\n cssAttribute: options.cssAttribute || DEFAULT_CSS_ATTRIBUTE,\n containerSelector: options.containerSelector || DEFAULT_CONTAINER_SELECTOR\n }\n };\n};\n","import { DOCUMENT } from '@angular/common';\nimport {\n Directive,\n ElementRef,\n OnDestroy,\n OnInit,\n Renderer2,\n computed,\n effect,\n inject,\n input,\n signal\n} from '@angular/core';\nimport { DEFAULT_FIXED_FOOTER_OPTIONS } from './ngx-fixed-footer.constants';\nimport { NgxFixedFooterCssAttribute, NgxFixedFooterOptions } from './ngx-fixed-footer.interface';\nimport { APP_FIXED_FOOTER_OPTIONS_TOKEN } from './ngx-fixed-footer.provider';\n\n@Directive({\n selector: '[ngxFixedFooter]'\n})\nexport class NgxFixedFooterDirective implements OnDestroy, OnInit {\n private readonly document = inject(DOCUMENT);\n private readonly el = inject(ElementRef);\n private readonly render = inject(Renderer2);\n private options: NgxFixedFooterOptions =\n inject(APP_FIXED_FOOTER_OPTIONS_TOKEN, { optional: true }) || DEFAULT_FIXED_FOOTER_OPTIONS;\n private readonly hasResizeObserver = typeof ResizeObserver !== 'undefined';\n private resizeObserver?: ResizeObserver;\n\n private offsetHeight = signal<number | undefined>(undefined);\n private prevContainerSelector = signal<string | undefined>(undefined);\n\n public containerSelector = input<string>(this.options.containerSelector);\n public cssAttribute = input<NgxFixedFooterCssAttribute>(this.options.cssAttribute);\n\n private container = computed(() => {\n const selector = this.containerSelector() || this.options.containerSelector;\n return this.document.body.querySelector<HTMLElement>(selector);\n });\n\n constructor() {\n // swap selector\n effect(() => {\n if (!this.hasResizeObserver || !this.document) return;\n const containerSelector = this.containerSelector();\n const offsetHeight = this.offsetHeight();\n if (!containerSelector || typeof offsetHeight !== 'number') return;\n const cssAttribute = this.cssAttribute();\n const prevContainerSelector = this.prevContainerSelector();\n if (prevContainerSelector && prevContainerSelector !== containerSelector) {\n const prevContainer = this.document.body.querySelector<HTMLElement>(prevContainerSelector);\n if (prevContainer) {\n this.removeStyle(prevContainer, cssAttribute);\n }\n }\n const container = this.document.body.querySelector<HTMLElement>(containerSelector);\n if (container) {\n this.setStyle(container, cssAttribute, offsetHeight);\n this.prevContainerSelector.set(containerSelector);\n }\n });\n\n // swap css attribute\n effect(() => {\n if (!this.hasResizeObserver || !this.document) return;\n const container = this.container();\n const offsetHeight = this.offsetHeight();\n if (!container || typeof offsetHeight !== 'number') return;\n const cssAttribute = this.cssAttribute();\n this.removeStyle(container, cssAttribute === 'padding' ? 'margin' : 'padding');\n this.setStyle(container, cssAttribute, offsetHeight);\n });\n }\n\n public ngOnInit(): void {\n if (this.hasResizeObserver && this.document) {\n this.resizeObserver = new ResizeObserver(() => this.checkHeight());\n this.resizeObserver.observe(this.html);\n }\n }\n\n public ngOnDestroy(): void {\n const container = this.container();\n if (this.resizeObserver && this.document && container) {\n this.removeStyle(container, this.cssAttribute());\n this.resizeObserver.unobserve(this.html);\n }\n }\n\n private checkHeight(): void {\n const height = this.html.offsetHeight;\n const container = this.container();\n if (this.offsetHeight() !== height && container) {\n this.setStyle(container, this.cssAttribute(), height);\n this.offsetHeight.set(height);\n }\n }\n\n private removeStyle(container: HTMLElement, cssAttribute: NgxFixedFooterCssAttribute): void {\n if (!container) {\n throw new Error(`Cannot removeStyle to undefined container`);\n }\n this.render.setStyle(container, `${cssAttribute}-bottom`, '');\n }\n\n private setStyle(container: HTMLElement, cssAttribute: NgxFixedFooterCssAttribute, height: number): void {\n if (!container) {\n throw new Error(`Cannot setStyle to undefined container`);\n }\n this.render.setStyle(container, `${cssAttribute}-bottom`, height === 0 ? '' : `${height}px`);\n }\n\n private get html(): HTMLElement {\n return this.el.nativeElement;\n }\n}\n","/*\n * Public API Surface of ngx-fixed-footer\n */\n\nexport * from './lib/ngx-fixed-footer.constants';\nexport * from './lib/ngx-fixed-footer.directive';\nexport * from './lib/ngx-fixed-footer.interface';\nexport * from './lib/ngx-fixed-footer.provider';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngx-fixed-footer.mjs","sources":["../../../projects/ngx-fixed-footer/src/lib/ngx-fixed-footer.constants.ts","../../../projects/ngx-fixed-footer/src/lib/ngx-fixed-footer.provider.ts","../../../projects/ngx-fixed-footer/src/lib/ngx-fixed-footer.directive.ts","../../../projects/ngx-fixed-footer/src/public-api.ts","../../../projects/ngx-fixed-footer/src/ngx-fixed-footer.ts"],"sourcesContent":["import { NgxFixedFooterOptions } from './ngx-fixed-footer.interface';\n\nexport const DEFAULT_CSS_ATTRIBUTE = 'padding';\nexport const DEFAULT_CONTAINER_SELECTOR = '[role=\"main\"]';\nexport const DEFAULT_FIXED_FOOTER_OPTIONS: NgxFixedFooterOptions = {\n containerSelector: DEFAULT_CONTAINER_SELECTOR,\n cssAttribute: DEFAULT_CSS_ATTRIBUTE\n};\n","import { InjectionToken, Provider } from '@angular/core';\nimport { DEFAULT_CONTAINER_SELECTOR, DEFAULT_CSS_ATTRIBUTE } from './ngx-fixed-footer.constants';\nimport { NgxFixedFooterOptions } from './ngx-fixed-footer.interface';\n\nexport const APP_FIXED_FOOTER_OPTIONS_TOKEN = new InjectionToken<NgxFixedFooterOptions>('[ngxFixedFooter] Options');\n\nexport const provideFixedFooter = (options: Partial<NgxFixedFooterOptions>): Provider => {\n return {\n provide: APP_FIXED_FOOTER_OPTIONS_TOKEN,\n useValue: {\n cssAttribute: options.cssAttribute || DEFAULT_CSS_ATTRIBUTE,\n containerSelector: options.containerSelector || DEFAULT_CONTAINER_SELECTOR\n }\n };\n};\n","import {\n DOCUMENT,\n Directive,\n ElementRef,\n OnDestroy,\n OnInit,\n Renderer2,\n computed,\n effect,\n inject,\n input,\n signal\n} from '@angular/core';\nimport { DEFAULT_FIXED_FOOTER_OPTIONS } from './ngx-fixed-footer.constants';\nimport { NgxFixedFooterCssAttribute, NgxFixedFooterOptions } from './ngx-fixed-footer.interface';\nimport { APP_FIXED_FOOTER_OPTIONS_TOKEN } from './ngx-fixed-footer.provider';\n\n@Directive({\n selector: '[ngxFixedFooter]'\n})\nexport class NgxFixedFooterDirective implements OnDestroy, OnInit {\n private readonly document = inject(DOCUMENT);\n private readonly el = inject(ElementRef);\n private readonly render = inject(Renderer2);\n private options: NgxFixedFooterOptions =\n inject(APP_FIXED_FOOTER_OPTIONS_TOKEN, { optional: true }) || DEFAULT_FIXED_FOOTER_OPTIONS;\n private readonly hasResizeObserver = typeof ResizeObserver !== 'undefined';\n private resizeObserver?: ResizeObserver;\n\n private offsetHeight = signal<number | undefined>(undefined);\n private prevContainerSelector = signal<string | undefined>(undefined);\n\n public containerSelector = input<string>(this.options.containerSelector);\n public cssAttribute = input<NgxFixedFooterCssAttribute>(this.options.cssAttribute);\n\n private container = computed(() => {\n const selector = this.containerSelector() || this.options.containerSelector;\n return this.document.body.querySelector<HTMLElement>(selector);\n });\n\n constructor() {\n // swap selector\n effect(() => {\n if (!this.hasResizeObserver || !this.document) return;\n const containerSelector = this.containerSelector();\n const offsetHeight = this.offsetHeight();\n if (!containerSelector || typeof offsetHeight !== 'number') return;\n const cssAttribute = this.cssAttribute();\n const prevContainerSelector = this.prevContainerSelector();\n if (prevContainerSelector && prevContainerSelector !== containerSelector) {\n const prevContainer = this.document.body.querySelector<HTMLElement>(prevContainerSelector);\n if (prevContainer) {\n this.removeStyle(prevContainer, cssAttribute);\n }\n }\n const container = this.document.body.querySelector<HTMLElement>(containerSelector);\n if (container) {\n this.setStyle(container, cssAttribute, offsetHeight);\n this.prevContainerSelector.set(containerSelector);\n }\n });\n\n // swap css attribute\n effect(() => {\n if (!this.hasResizeObserver || !this.document) return;\n const container = this.container();\n const offsetHeight = this.offsetHeight();\n if (!container || typeof offsetHeight !== 'number') return;\n const cssAttribute = this.cssAttribute();\n this.removeStyle(container, cssAttribute === 'padding' ? 'margin' : 'padding');\n this.setStyle(container, cssAttribute, offsetHeight);\n });\n }\n\n public ngOnInit(): void {\n if (this.hasResizeObserver && this.document) {\n this.resizeObserver = new ResizeObserver(() => this.checkHeight());\n this.resizeObserver.observe(this.html);\n }\n }\n\n public ngOnDestroy(): void {\n const container = this.container();\n if (this.resizeObserver && this.document && container) {\n this.removeStyle(container, this.cssAttribute());\n this.resizeObserver.unobserve(this.html);\n }\n }\n\n private checkHeight(): void {\n const height = this.html.offsetHeight;\n const container = this.container();\n if (this.offsetHeight() !== height && container) {\n this.setStyle(container, this.cssAttribute(), height);\n this.offsetHeight.set(height);\n }\n }\n\n private removeStyle(container: HTMLElement, cssAttribute: NgxFixedFooterCssAttribute): void {\n if (!container) {\n throw new Error(`Cannot removeStyle to undefined container`);\n }\n this.render.setStyle(container, `${cssAttribute}-bottom`, '');\n }\n\n private setStyle(container: HTMLElement, cssAttribute: NgxFixedFooterCssAttribute, height: number): void {\n if (!container) {\n throw new Error(`Cannot setStyle to undefined container`);\n }\n this.render.setStyle(container, `${cssAttribute}-bottom`, height === 0 ? '' : `${height}px`);\n }\n\n private get html(): HTMLElement {\n return this.el.nativeElement;\n }\n}\n","/*\n * Public API Surface of ngx-fixed-footer\n */\n\nexport * from './lib/ngx-fixed-footer.constants';\nexport * from './lib/ngx-fixed-footer.directive';\nexport * from './lib/ngx-fixed-footer.interface';\nexport * from './lib/ngx-fixed-footer.provider';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/index.d.ts
CHANGED
|
@@ -1,5 +1,41 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { OnDestroy, OnInit, InjectionToken, Provider } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
type NgxFixedFooterCssAttribute = 'padding' | 'margin';
|
|
5
|
+
interface NgxFixedFooterOptions {
|
|
6
|
+
cssAttribute: NgxFixedFooterCssAttribute;
|
|
7
|
+
containerSelector: string;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
declare const DEFAULT_CSS_ATTRIBUTE = "padding";
|
|
11
|
+
declare const DEFAULT_CONTAINER_SELECTOR = "[role=\"main\"]";
|
|
12
|
+
declare const DEFAULT_FIXED_FOOTER_OPTIONS: NgxFixedFooterOptions;
|
|
13
|
+
|
|
14
|
+
declare class NgxFixedFooterDirective implements OnDestroy, OnInit {
|
|
15
|
+
private readonly document;
|
|
16
|
+
private readonly el;
|
|
17
|
+
private readonly render;
|
|
18
|
+
private options;
|
|
19
|
+
private readonly hasResizeObserver;
|
|
20
|
+
private resizeObserver?;
|
|
21
|
+
private offsetHeight;
|
|
22
|
+
private prevContainerSelector;
|
|
23
|
+
containerSelector: _angular_core.InputSignal<string>;
|
|
24
|
+
cssAttribute: _angular_core.InputSignal<NgxFixedFooterCssAttribute>;
|
|
25
|
+
private container;
|
|
26
|
+
constructor();
|
|
27
|
+
ngOnInit(): void;
|
|
28
|
+
ngOnDestroy(): void;
|
|
29
|
+
private checkHeight;
|
|
30
|
+
private removeStyle;
|
|
31
|
+
private setStyle;
|
|
32
|
+
private get html();
|
|
33
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxFixedFooterDirective, never>;
|
|
34
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgxFixedFooterDirective, "[ngxFixedFooter]", never, { "containerSelector": { "alias": "containerSelector"; "required": false; "isSignal": true; }; "cssAttribute": { "alias": "cssAttribute"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
declare const APP_FIXED_FOOTER_OPTIONS_TOKEN: InjectionToken<NgxFixedFooterOptions>;
|
|
38
|
+
declare const provideFixedFooter: (options: Partial<NgxFixedFooterOptions>) => Provider;
|
|
39
|
+
|
|
40
|
+
export { APP_FIXED_FOOTER_OPTIONS_TOKEN, DEFAULT_CONTAINER_SELECTOR, DEFAULT_CSS_ATTRIBUTE, DEFAULT_FIXED_FOOTER_OPTIONS, NgxFixedFooterDirective, provideFixedFooter };
|
|
41
|
+
export type { NgxFixedFooterCssAttribute, NgxFixedFooterOptions };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ngx-fixed-footer",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"author": {
|
|
5
5
|
"name": "Dominik Hladík",
|
|
6
6
|
"email": "dominik.hladik@seznam.cz",
|
|
@@ -10,8 +10,7 @@
|
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"description": "Angular directive that adds fixed footer without overlap",
|
|
12
12
|
"peerDependencies": {
|
|
13
|
-
"@angular/
|
|
14
|
-
"@angular/core": ">=18"
|
|
13
|
+
"@angular/core": ">=20"
|
|
15
14
|
},
|
|
16
15
|
"publishConfig": {
|
|
17
16
|
"registry": "https://registry.npmjs.org"
|
|
@@ -32,7 +31,7 @@
|
|
|
32
31
|
"overlap"
|
|
33
32
|
],
|
|
34
33
|
"engines": {
|
|
35
|
-
"node": ">=
|
|
34
|
+
"node": ">=20"
|
|
36
35
|
},
|
|
37
36
|
"module": "fesm2022/ngx-fixed-footer.mjs",
|
|
38
37
|
"typings": "index.d.ts",
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import { NgxFixedFooterOptions } from './ngx-fixed-footer.interface';
|
|
2
|
-
export declare const DEFAULT_CSS_ATTRIBUTE = "padding";
|
|
3
|
-
export declare const DEFAULT_CONTAINER_SELECTOR = "[role=\"main\"]";
|
|
4
|
-
export declare const DEFAULT_FIXED_FOOTER_OPTIONS: NgxFixedFooterOptions;
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { OnDestroy, OnInit } from '@angular/core';
|
|
2
|
-
import { NgxFixedFooterCssAttribute } from './ngx-fixed-footer.interface';
|
|
3
|
-
import * as i0 from "@angular/core";
|
|
4
|
-
export declare class NgxFixedFooterDirective implements OnDestroy, OnInit {
|
|
5
|
-
private readonly document;
|
|
6
|
-
private readonly el;
|
|
7
|
-
private readonly render;
|
|
8
|
-
private options;
|
|
9
|
-
private readonly hasResizeObserver;
|
|
10
|
-
private resizeObserver?;
|
|
11
|
-
private offsetHeight;
|
|
12
|
-
private prevContainerSelector;
|
|
13
|
-
containerSelector: import("@angular/core").InputSignal<string>;
|
|
14
|
-
cssAttribute: import("@angular/core").InputSignal<NgxFixedFooterCssAttribute>;
|
|
15
|
-
private container;
|
|
16
|
-
constructor();
|
|
17
|
-
ngOnInit(): void;
|
|
18
|
-
ngOnDestroy(): void;
|
|
19
|
-
private checkHeight;
|
|
20
|
-
private removeStyle;
|
|
21
|
-
private setStyle;
|
|
22
|
-
private get html();
|
|
23
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<NgxFixedFooterDirective, never>;
|
|
24
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<NgxFixedFooterDirective, "[ngxFixedFooter]", never, { "containerSelector": { "alias": "containerSelector"; "required": false; "isSignal": true; }; "cssAttribute": { "alias": "cssAttribute"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
25
|
-
}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import { InjectionToken, Provider } from '@angular/core';
|
|
2
|
-
import { NgxFixedFooterOptions } from './ngx-fixed-footer.interface';
|
|
3
|
-
export declare const APP_FIXED_FOOTER_OPTIONS_TOKEN: InjectionToken<NgxFixedFooterOptions>;
|
|
4
|
-
export declare const provideFixedFooter: (options: Partial<NgxFixedFooterOptions>) => Provider;
|
package/public-api.d.ts
DELETED