angular-aspect-ratio-container 19.0.5 → 20.0.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 +13 -13
- package/fesm2022/angular-aspect-ratio-container.mjs +5 -5
- package/fesm2022/angular-aspect-ratio-container.mjs.map +1 -1
- package/index.d.ts +25 -1
- package/package.json +2 -2
- package/lib/aspect-ratio-container/index.d.ts +0 -1
- package/lib/aspect-ratio-container/ng-aspect-ratio.directive.d.ts +0 -21
- package/lib/aspect-ratio-container/sizing-mode.d.ts +0 -1
package/README.md
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
# Angular Aspect Ratio Container
|
|
2
|
-
|
|
3
|
-
Library to fix the aspect ratio of a container.
|
|
4
|
-
|
|
5
|
-
## Example
|
|
6
|
-
|
|
7
|
-
```html
|
|
8
|
-
<div class="wrapper" style="width: 100vw; height: 100vh">
|
|
9
|
-
<div [ngAspectRatio]="16 / 9" style="background-color: lightblue">Hello</div>
|
|
10
|
-
</div>
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-

|
|
1
|
+
# Angular Aspect Ratio Container
|
|
2
|
+
|
|
3
|
+
Library to fix the aspect ratio of a container.
|
|
4
|
+
|
|
5
|
+
## Example
|
|
6
|
+
|
|
7
|
+
```html
|
|
8
|
+
<div class="wrapper" style="width: 100vw; height: 100vh">
|
|
9
|
+
<div [ngAspectRatio]="16 / 9" style="background-color: lightblue">Hello</div>
|
|
10
|
+
</div>
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+

|
|
@@ -5,8 +5,8 @@ class NgAspectRatioDirective {
|
|
|
5
5
|
renderer = inject(Renderer2);
|
|
6
6
|
hostElem = inject(ElementRef);
|
|
7
7
|
observer;
|
|
8
|
-
ngAspectRatio = input.required();
|
|
9
|
-
sizingMode = input('match-parent');
|
|
8
|
+
ngAspectRatio = input.required(...(ngDevMode ? [{ debugName: "ngAspectRatio" }] : []));
|
|
9
|
+
sizingMode = input('match-parent', ...(ngDevMode ? [{ debugName: "sizingMode" }] : []));
|
|
10
10
|
containerWidthChanged = output();
|
|
11
11
|
containerHeightChanged = output();
|
|
12
12
|
targetRatio = this.ngAspectRatio;
|
|
@@ -67,10 +67,10 @@ class NgAspectRatioDirective {
|
|
|
67
67
|
this.containerHeightChanged.emit(height);
|
|
68
68
|
this.renderer.setStyle(this.hostElem.nativeElement, 'height', `${height}px`);
|
|
69
69
|
}
|
|
70
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
71
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
70
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: NgAspectRatioDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
71
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.6", type: NgAspectRatioDirective, isStandalone: true, selector: "[ngAspectRatio]", inputs: { ngAspectRatio: { classPropertyName: "ngAspectRatio", publicName: "ngAspectRatio", isSignal: true, isRequired: true, transformFunction: null }, sizingMode: { classPropertyName: "sizingMode", publicName: "sizingMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { containerWidthChanged: "containerWidthChanged", containerHeightChanged: "containerHeightChanged" }, ngImport: i0 });
|
|
72
72
|
}
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: NgAspectRatioDirective, decorators: [{
|
|
74
74
|
type: Directive,
|
|
75
75
|
args: [{
|
|
76
76
|
selector: '[ngAspectRatio]'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"angular-aspect-ratio-container.mjs","sources":["../../../../libs/angular-aspect-ratio-container/src/lib/aspect-ratio-container/ng-aspect-ratio.directive.ts","../../../../libs/angular-aspect-ratio-container/src/angular-aspect-ratio-container.ts"],"sourcesContent":["import { ElementRef, AfterViewInit, Renderer2, OnDestroy, Directive, input, inject, output } from '@angular/core';\r\nimport { SizingMode } from './sizing-mode';\r\n\r\n@Directive({\r\n selector: '[ngAspectRatio]'\r\n})\r\nexport class NgAspectRatioDirective implements AfterViewInit, OnDestroy {\r\n private readonly renderer = inject(Renderer2);\r\n private readonly hostElem = inject(ElementRef);\r\n private readonly observer: ResizeObserver;\r\n\r\n ngAspectRatio = input.required<number>();\r\n sizingMode = input<SizingMode>('match-parent');\r\n\r\n containerWidthChanged = output<number>();\r\n containerHeightChanged = output<number>();\r\n\r\n private readonly targetRatio = this.ngAspectRatio;\r\n\r\n constructor() {\r\n this.observer = new ResizeObserver(() => {\r\n this.calculateAndSetAspect();\r\n });\r\n }\r\n\r\n ngAfterViewInit() {\r\n this.observer.observe(this.hostElem.nativeElement.parentElement);\r\n }\r\n\r\n ngOnDestroy() {\r\n this.observer.disconnect();\r\n }\r\n\r\n public calculateAndSetAspect(): void {\r\n this.renderer.removeStyle(this.hostElem.nativeElement, 'width');\r\n this.renderer.removeStyle(this.hostElem.nativeElement, 'height');\r\n\r\n let targetWidth: number;\r\n let targetHeight: number;\r\n\r\n if (this.sizingMode() === 'match-parent') {\r\n const hostWidth = this.hostElem.nativeElement.parentElement.offsetWidth;\r\n const hostHeight = this.hostElem.nativeElement.parentElement.offsetHeight;\r\n const hostAspectRatio = hostWidth / hostHeight;\r\n\r\n if (hostAspectRatio >= this.targetRatio()) {\r\n // use full height as base\r\n targetHeight = hostHeight;\r\n targetWidth = targetHeight * this.targetRatio();\r\n } else {\r\n // use full width as base\r\n targetWidth = hostWidth;\r\n targetHeight = targetWidth * (1 / this.targetRatio());\r\n }\r\n } else {\r\n // Add +1 to the dimensions because decimals get rounded\r\n const contentWidth = this.hostElem.nativeElement.offsetWidth + 1;\r\n const contentHeight = this.hostElem.nativeElement.offsetHeight + 1;\r\n\r\n const currentRatio = contentWidth / contentHeight;\r\n if (currentRatio >= this.targetRatio()) {\r\n targetWidth = contentWidth;\r\n targetHeight = targetWidth * (1 / this.targetRatio());\r\n } else {\r\n targetHeight = contentHeight;\r\n targetWidth = targetHeight * this.targetRatio();\r\n }\r\n }\r\n // Set calculated dimensions\r\n this.setAcInnerWidth(targetWidth);\r\n this.setAcInnerHeight(targetHeight);\r\n }\r\n\r\n private setAcInnerWidth(width: number) {\r\n this.containerWidthChanged.emit(width);\r\n this.renderer.setStyle(this.hostElem.nativeElement, 'width', `${width}px`);\r\n }\r\n\r\n private setAcInnerHeight(height: number) {\r\n this.containerHeightChanged.emit(height);\r\n this.renderer.setStyle(this.hostElem.nativeElement, 'height', `${height}px`);\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"angular-aspect-ratio-container.mjs","sources":["../tmp-esm2022/lib/aspect-ratio-container/ng-aspect-ratio.directive.js","../tmp-esm2022/angular-aspect-ratio-container.js"],"sourcesContent":["import { ElementRef, Renderer2, Directive, input, inject, output } from '@angular/core';\nimport * as i0 from \"@angular/core\";\nexport class NgAspectRatioDirective {\n renderer = inject(Renderer2);\n hostElem = inject(ElementRef);\n observer;\n ngAspectRatio = input.required(...(ngDevMode ? [{ debugName: \"ngAspectRatio\" }] : []));\n sizingMode = input('match-parent', ...(ngDevMode ? [{ debugName: \"sizingMode\" }] : []));\n containerWidthChanged = output();\n containerHeightChanged = output();\n targetRatio = this.ngAspectRatio;\n constructor() {\n this.observer = new ResizeObserver(() => {\n this.calculateAndSetAspect();\n });\n }\n ngAfterViewInit() {\n this.observer.observe(this.hostElem.nativeElement.parentElement);\n }\n ngOnDestroy() {\n this.observer.disconnect();\n }\n calculateAndSetAspect() {\n this.renderer.removeStyle(this.hostElem.nativeElement, 'width');\n this.renderer.removeStyle(this.hostElem.nativeElement, 'height');\n let targetWidth;\n let targetHeight;\n if (this.sizingMode() === 'match-parent') {\n const hostWidth = this.hostElem.nativeElement.parentElement.offsetWidth;\n const hostHeight = this.hostElem.nativeElement.parentElement.offsetHeight;\n const hostAspectRatio = hostWidth / hostHeight;\n if (hostAspectRatio >= this.targetRatio()) {\n // use full height as base\n targetHeight = hostHeight;\n targetWidth = targetHeight * this.targetRatio();\n }\n else {\n // use full width as base\n targetWidth = hostWidth;\n targetHeight = targetWidth * (1 / this.targetRatio());\n }\n }\n else {\n // Add +1 to the dimensions because decimals get rounded\n const contentWidth = this.hostElem.nativeElement.offsetWidth + 1;\n const contentHeight = this.hostElem.nativeElement.offsetHeight + 1;\n const currentRatio = contentWidth / contentHeight;\n if (currentRatio >= this.targetRatio()) {\n targetWidth = contentWidth;\n targetHeight = targetWidth * (1 / this.targetRatio());\n }\n else {\n targetHeight = contentHeight;\n targetWidth = targetHeight * this.targetRatio();\n }\n }\n // Set calculated dimensions\n this.setAcInnerWidth(targetWidth);\n this.setAcInnerHeight(targetHeight);\n }\n setAcInnerWidth(width) {\n this.containerWidthChanged.emit(width);\n this.renderer.setStyle(this.hostElem.nativeElement, 'width', `${width}px`);\n }\n setAcInnerHeight(height) {\n this.containerHeightChanged.emit(height);\n this.renderer.setStyle(this.hostElem.nativeElement, 'height', `${height}px`);\n }\n static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: \"12.0.0\", version: \"20.1.6\", ngImport: i0, type: NgAspectRatioDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });\n static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: \"17.1.0\", version: \"20.1.6\", type: NgAspectRatioDirective, isStandalone: true, selector: \"[ngAspectRatio]\", inputs: { ngAspectRatio: { classPropertyName: \"ngAspectRatio\", publicName: \"ngAspectRatio\", isSignal: true, isRequired: true, transformFunction: null }, sizingMode: { classPropertyName: \"sizingMode\", publicName: \"sizingMode\", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { containerWidthChanged: \"containerWidthChanged\", containerHeightChanged: \"containerHeightChanged\" }, ngImport: i0 });\n}\ni0.ɵɵngDeclareClassMetadata({ minVersion: \"12.0.0\", version: \"20.1.6\", ngImport: i0, type: NgAspectRatioDirective, decorators: [{\n type: Directive,\n args: [{\n selector: '[ngAspectRatio]'\n }]\n }], ctorParameters: () => [] });\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctYXNwZWN0LXJhdGlvLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYW5ndWxhci1hc3BlY3QtcmF0aW8tY29udGFpbmVyL3NyYy9saWIvYXNwZWN0LXJhdGlvLWNvbnRhaW5lci9uZy1hc3BlY3QtcmF0aW8uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQWlCLFNBQVMsRUFBYSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBTWxILE1BQU0sT0FBTyxzQkFBc0I7SUFDaEIsUUFBUSxHQUFHLE1BQU0sQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUM3QixRQUFRLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQzlCLFFBQVEsQ0FBaUI7SUFFMUMsYUFBYSxHQUFHLEtBQUssQ0FBQyxRQUFRLHdEQUFVLENBQUM7SUFDekMsVUFBVSxHQUFHLEtBQUssQ0FBYSxjQUFjLHNEQUFDLENBQUM7SUFFL0MscUJBQXFCLEdBQUcsTUFBTSxFQUFVLENBQUM7SUFDekMsc0JBQXNCLEdBQUcsTUFBTSxFQUFVLENBQUM7SUFFekIsV0FBVyxHQUFHLElBQUksQ0FBQyxhQUFhLENBQUM7SUFFbEQ7UUFDRSxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksY0FBYyxDQUFDLEdBQUcsRUFBRTtZQUN0QyxJQUFJLENBQUMscUJBQXFCLEVBQUUsQ0FBQztRQUMvQixDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxlQUFlO1FBQ2IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLENBQUM7SUFDbkUsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsUUFBUSxDQUFDLFVBQVUsRUFBRSxDQUFDO0lBQzdCLENBQUM7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b3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBFbGVtZW50UmVmLCBBZnRlclZpZXdJbml0LCBSZW5kZXJlcjIsIE9uRGVzdHJveSwgRGlyZWN0aXZlLCBpbnB1dCwgaW5qZWN0LCBvdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNpemluZ01vZGUgfSBmcm9tICcuL3NpemluZy1tb2RlJztcblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW25nQXNwZWN0UmF0aW9dJ1xufSlcbmV4cG9ydCBjbGFzcyBOZ0FzcGVjdFJhdGlvRGlyZWN0aXZlIGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCwgT25EZXN0cm95IHtcbiAgcHJpdmF0ZSByZWFkb25seSByZW5kZXJlciA9IGluamVjdChSZW5kZXJlcjIpO1xuICBwcml2YXRlIHJlYWRvbmx5IGhvc3RFbGVtID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuICBwcml2YXRlIHJlYWRvbmx5IG9ic2VydmVyOiBSZXNpemVPYnNlcnZlcjtcblxuICBuZ0FzcGVjdFJhdGlvID0gaW5wdXQucmVxdWlyZWQ8bnVtYmVyPigpO1xuICBzaXppbmdNb2RlID0gaW5wdXQ8U2l6aW5nTW9kZT4oJ21hdGNoLXBhcmVudCcpO1xuXG4gIGNvbnRhaW5lcldpZHRoQ2hhbmdlZCA9IG91dHB1dDxudW1iZXI+KCk7XG4gIGNvbnRhaW5lckhlaWdodENoYW5nZWQgPSBvdXRwdXQ8bnVtYmVyPigpO1xuXG4gIHByaXZhdGUgcmVhZG9ubHkgdGFyZ2V0UmF0aW8gPSB0aGlzLm5nQXNwZWN0UmF0aW87XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgdGhpcy5vYnNlcnZlciA9IG5ldyBSZXNpemVPYnNlcnZlcigoKSA9PiB7XG4gICAgICB0aGlzLmNhbGN1bGF0ZUFuZFNldEFzcGVjdCgpO1xuICAgIH0pO1xuICB9XG5cbiAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgIHRoaXMub2JzZXJ2ZXIub2JzZXJ2ZSh0aGlzLmhvc3RFbGVtLm5hdGl2ZUVsZW1lbnQucGFyZW50RWxlbWVudCk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICB0aGlzLm9ic2VydmVyLmRpc2Nvbm5lY3QoKTtcbiAgfVxuXG4gIHB1YmxpYyBjYWxjdWxhdGVBbmRTZXRBc3BlY3QoKTogdm9pZCB7XG4gICAgdGhpcy5yZW5kZXJlci5yZW1vdmVTdHlsZSh0aGlzLmhvc3RFbGVtLm5hdGl2ZUVsZW1lbnQsICd3aWR0aCcpO1xuICAgIHRoaXMucmVuZGVyZXIucmVtb3ZlU3R5bGUodGhpcy5ob3N0RWxlbS5uYXRpdmVFbGVtZW50LCAnaGVpZ2h0Jyk7XG5cbiAgICBsZXQgdGFyZ2V0V2lkdGg6IG51bWJlcjtcbiAgICBsZXQgdGFyZ2V0SGVpZ2h0OiBudW1iZXI7XG5cbiAgICBpZiAodGhpcy5zaXppbmdNb2RlKCkgPT09ICdtYXRjaC1wYXJlbnQnKSB7XG4gICAgICBjb25zdCBob3N0V2lkdGggPSB0aGlzLmhvc3RFbGVtLm5hdGl2ZUVsZW1lbnQucGFyZW50RWxlbWVudC5vZmZzZXRXaWR0aDtcbiAgICAgIGNvbnN0IGhvc3RIZWlnaHQgPSB0aGlzLmhvc3RFbGVtLm5hdGl2ZUVsZW1lbnQucGFyZW50RWxlbWVudC5vZmZzZXRIZWlnaHQ7XG4gICAgICBjb25zdCBob3N0QXNwZWN0UmF0aW8gPSBob3N0V2lkdGggLyBob3N0SGVpZ2h0O1xuXG4gICAgICBpZiAoaG9zdEFzcGVjdFJhdGlvID49IHRoaXMudGFyZ2V0UmF0aW8oKSkge1xuICAgICAgICAvLyB1c2UgZnVsbCBoZWlnaHQgYXMgYmFzZVxuICAgICAgICB0YXJnZXRIZWlnaHQgPSBob3N0SGVpZ2h0O1xuICAgICAgICB0YXJnZXRXaWR0aCA9IHRhcmdldEhlaWdodCAqIHRoaXMudGFyZ2V0UmF0aW8oKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIC8vIHVzZSBmdWxsIHdpZHRoIGFzIGJhc2VcbiAgICAgICAgdGFyZ2V0V2lkdGggPSBob3N0V2lkdGg7XG4gICAgICAgIHRhcmdldEhlaWdodCA9IHRhcmdldFdpZHRoICogKDEgLyB0aGlzLnRhcmdldFJhdGlvKCkpO1xuICAgICAgfVxuICAgIH0gZWxzZSB7XG4gICAgICAvLyBBZGQgKzEgdG8gdGhlIGRpbWVuc2lvbnMgYmVjYXVzZSBkZWNpbWFscyBnZXQgcm91bmRlZFxuICAgICAgY29uc3QgY29udGVudFdpZHRoID0gdGhpcy5ob3N0RWxlbS5uYXRpdmVFbGVtZW50Lm9mZnNldFdpZHRoICsgMTtcbiAgICAgIGNvbnN0IGNvbnRlbnRIZWlnaHQgPSB0aGlzLmhvc3RFbGVtLm5hdGl2ZUVsZW1lbnQub2Zmc2V0SGVpZ2h0ICsgMTtcblxuICAgICAgY29uc3QgY3VycmVudFJhdGlvID0gY29udGVudFdpZHRoIC8gY29udGVudEhlaWdodDtcbiAgICAgIGlmIChjdXJyZW50UmF0aW8gPj0gdGhpcy50YXJnZXRSYXRpbygpKSB7XG4gICAgICAgIHRhcmdldFdpZHRoID0gY29udGVudFdpZHRoO1xuICAgICAgICB0YXJnZXRIZWlnaHQgPSB0YXJnZXRXaWR0aCAqICgxIC8gdGhpcy50YXJnZXRSYXRpbygpKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRhcmdldEhlaWdodCA9IGNvbnRlbnRIZWlnaHQ7XG4gICAgICAgIHRhcmdldFdpZHRoID0gdGFyZ2V0SGVpZ2h0ICogdGhpcy50YXJnZXRSYXRpbygpO1xuICAgICAgfVxuICAgIH1cbiAgICAvLyBTZXQgY2FsY3VsYXRlZCBkaW1lbnNpb25zXG4gICAgdGhpcy5zZXRBY0lubmVyV2lkdGgodGFyZ2V0V2lkdGgpO1xuICAgIHRoaXMuc2V0QWNJbm5lckhlaWdodCh0YXJnZXRIZWlnaHQpO1xuICB9XG5cbiAgcHJpdmF0ZSBzZXRBY0lubmVyV2lkdGgod2lkdGg6IG51bWJlcikge1xuICAgIHRoaXMuY29udGFpbmVyV2lkdGhDaGFuZ2VkLmVtaXQod2lkdGgpO1xuICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5ob3N0RWxlbS5uYXRpdmVFbGVtZW50LCAnd2lkdGgnLCBgJHt3aWR0aH1weGApO1xuICB9XG5cbiAgcHJpdmF0ZSBzZXRBY0lubmVySGVpZ2h0KGhlaWdodDogbnVtYmVyKSB7XG4gICAgdGhpcy5jb250YWluZXJIZWlnaHRDaGFuZ2VkLmVtaXQoaGVpZ2h0KTtcbiAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKHRoaXMuaG9zdEVsZW0ubmF0aXZlRWxlbWVudCwgJ2hlaWdodCcsIGAke2hlaWdodH1weGApO1xuICB9XG59XG4iXX0=","/**\n * Generated bundle index. Do not edit.\n */\nexport * from './index';\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5ndWxhci1hc3BlY3QtcmF0aW8tY29udGFpbmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vbGlicy9hbmd1bGFyLWFzcGVjdC1yYXRpby1jb250YWluZXIvc3JjL2FuZ3VsYXItYXNwZWN0LXJhdGlvLWNvbnRhaW5lci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsU0FBUyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2luZGV4JztcbiJdfQ=="],"names":[],"mappings":"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"}
|
package/index.d.ts
CHANGED
|
@@ -1 +1,25 @@
|
|
|
1
|
-
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { AfterViewInit, OnDestroy } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
type SizingMode = 'fit-content' | 'match-parent';
|
|
5
|
+
|
|
6
|
+
declare class NgAspectRatioDirective implements AfterViewInit, OnDestroy {
|
|
7
|
+
private readonly renderer;
|
|
8
|
+
private readonly hostElem;
|
|
9
|
+
private readonly observer;
|
|
10
|
+
ngAspectRatio: _angular_core.InputSignal<number>;
|
|
11
|
+
sizingMode: _angular_core.InputSignal<SizingMode>;
|
|
12
|
+
containerWidthChanged: _angular_core.OutputEmitterRef<number>;
|
|
13
|
+
containerHeightChanged: _angular_core.OutputEmitterRef<number>;
|
|
14
|
+
private readonly targetRatio;
|
|
15
|
+
constructor();
|
|
16
|
+
ngAfterViewInit(): void;
|
|
17
|
+
ngOnDestroy(): void;
|
|
18
|
+
calculateAndSetAspect(): void;
|
|
19
|
+
private setAcInnerWidth;
|
|
20
|
+
private setAcInnerHeight;
|
|
21
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgAspectRatioDirective, never>;
|
|
22
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgAspectRatioDirective, "[ngAspectRatio]", never, { "ngAspectRatio": { "alias": "ngAspectRatio"; "required": true; "isSignal": true; }; "sizingMode": { "alias": "sizingMode"; "required": false; "isSignal": true; }; }, { "containerWidthChanged": "containerWidthChanged"; "containerHeightChanged": "containerHeightChanged"; }, never, never, true, never>;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
export { NgAspectRatioDirective };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "angular-aspect-ratio-container",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "20.0.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"directory": "libs/angular-aspect-ratio-container"
|
|
9
9
|
},
|
|
10
10
|
"peerDependencies": {
|
|
11
|
-
"@angular/core": "^
|
|
11
|
+
"@angular/core": "^20.0.0"
|
|
12
12
|
},
|
|
13
13
|
"sideEffects": false,
|
|
14
14
|
"module": "fesm2022/angular-aspect-ratio-container.mjs",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { NgAspectRatioDirective } from './ng-aspect-ratio.directive';
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { AfterViewInit, OnDestroy } from '@angular/core';
|
|
2
|
-
import { SizingMode } from './sizing-mode';
|
|
3
|
-
import * as i0 from "@angular/core";
|
|
4
|
-
export declare class NgAspectRatioDirective implements AfterViewInit, OnDestroy {
|
|
5
|
-
private readonly renderer;
|
|
6
|
-
private readonly hostElem;
|
|
7
|
-
private readonly observer;
|
|
8
|
-
ngAspectRatio: import("@angular/core").InputSignal<number>;
|
|
9
|
-
sizingMode: import("@angular/core").InputSignal<SizingMode>;
|
|
10
|
-
containerWidthChanged: import("@angular/core").OutputEmitterRef<number>;
|
|
11
|
-
containerHeightChanged: import("@angular/core").OutputEmitterRef<number>;
|
|
12
|
-
private readonly targetRatio;
|
|
13
|
-
constructor();
|
|
14
|
-
ngAfterViewInit(): void;
|
|
15
|
-
ngOnDestroy(): void;
|
|
16
|
-
calculateAndSetAspect(): void;
|
|
17
|
-
private setAcInnerWidth;
|
|
18
|
-
private setAcInnerHeight;
|
|
19
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<NgAspectRatioDirective, never>;
|
|
20
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<NgAspectRatioDirective, "[ngAspectRatio]", never, { "ngAspectRatio": { "alias": "ngAspectRatio"; "required": true; "isSignal": true; }; "sizingMode": { "alias": "sizingMode"; "required": false; "isSignal": true; }; }, { "containerWidthChanged": "containerWidthChanged"; "containerHeightChanged": "containerHeightChanged"; }, never, never, true, never>;
|
|
21
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export type SizingMode = 'fit-content' | 'match-parent';
|