@dotglitch/ngx-common 1.1.19 → 1.1.20
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/components/parallax-card/parallax-card.component.d.ts +57 -0
- package/esm2022/components/parallax-card/parallax-card.component.mjs +135 -0
- package/esm2022/public-api.mjs +2 -1
- package/fesm2022/dotglitch-ngx-common.mjs +133 -1
- package/fesm2022/dotglitch-ngx-common.mjs.map +1 -1
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { ElementRef, EventEmitter, TemplateRef } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
type CSSUnitString = 'px' | '%' | 'em' | 'in' | '';
|
|
4
|
+
type CSSUnit = `${number}${CSSUnitString}` | `var(--${string})`;
|
|
5
|
+
type CSSString = CSSUnit | `calc(${CSSUnit | ''}${'' | ' '}${'+' | '-' | '/' | '*'}${'' | ' '}${CSSUnit | ''})`;
|
|
6
|
+
export declare class ParallaxCardComponent {
|
|
7
|
+
private readonly element;
|
|
8
|
+
content: TemplateRef<ElementRef>;
|
|
9
|
+
background: TemplateRef<ElementRef>;
|
|
10
|
+
backContent: TemplateRef<ElementRef>;
|
|
11
|
+
backBackground: TemplateRef<ElementRef>;
|
|
12
|
+
/**
|
|
13
|
+
*
|
|
14
|
+
*/
|
|
15
|
+
loaded: EventEmitter<any>;
|
|
16
|
+
/**
|
|
17
|
+
* Width of the card
|
|
18
|
+
* @default `240px`
|
|
19
|
+
*/
|
|
20
|
+
width: CSSString;
|
|
21
|
+
/**
|
|
22
|
+
* Height of the card
|
|
23
|
+
* @default `320px`
|
|
24
|
+
*/
|
|
25
|
+
height: CSSString;
|
|
26
|
+
/**
|
|
27
|
+
* Inset padding of the parallax
|
|
28
|
+
* @default 80
|
|
29
|
+
*/
|
|
30
|
+
bgInset: number;
|
|
31
|
+
/**
|
|
32
|
+
* Duration for the flip animation in ms
|
|
33
|
+
* @default 80
|
|
34
|
+
*/
|
|
35
|
+
flipAnimationDuration: number;
|
|
36
|
+
renderCardFront: boolean;
|
|
37
|
+
renderCardBack: boolean;
|
|
38
|
+
showBackOfCard: boolean;
|
|
39
|
+
private get wrapper();
|
|
40
|
+
private get cardFront();
|
|
41
|
+
private get cardBack();
|
|
42
|
+
private get backgroundElement();
|
|
43
|
+
private get backfaceBackgroundElement();
|
|
44
|
+
private pointerX;
|
|
45
|
+
private pointerY;
|
|
46
|
+
private pointerLeave;
|
|
47
|
+
constructor(element: ElementRef);
|
|
48
|
+
ngAfterViewInit(): void;
|
|
49
|
+
onPointerMove(e: PointerEvent): void;
|
|
50
|
+
onPointerEnter(): void;
|
|
51
|
+
onPointerLeave(): void;
|
|
52
|
+
onClick(): void;
|
|
53
|
+
render: () => void;
|
|
54
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ParallaxCardComponent, never>;
|
|
55
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ParallaxCardComponent, "ngx-parallax-card", never, { "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "bgInset": { "alias": "bgInset"; "required": false; }; "flipAnimationDuration": { "alias": "flipAnimationDuration"; "required": false; }; }, { "loaded": "loaded"; }, ["content", "background", "backContent", "backBackground"], ["*"], true, never>;
|
|
56
|
+
}
|
|
57
|
+
export {};
|
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
import { NgTemplateOutlet } from '@angular/common';
|
|
2
|
+
import { Component, ContentChild, EventEmitter, Input, Output, TemplateRef } from '@angular/core';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export class ParallaxCardComponent {
|
|
5
|
+
get wrapper() { return this.element.nativeElement; }
|
|
6
|
+
get cardFront() { return this.wrapper.querySelector('.card.front'); }
|
|
7
|
+
get cardBack() { return this.wrapper.querySelector('.card.backface'); }
|
|
8
|
+
get backgroundElement() { return this.cardFront.querySelector('.card-bg'); }
|
|
9
|
+
get backfaceBackgroundElement() { return this.cardBack.querySelector('.card-bg'); }
|
|
10
|
+
constructor(element) {
|
|
11
|
+
this.element = element;
|
|
12
|
+
/**
|
|
13
|
+
*
|
|
14
|
+
*/
|
|
15
|
+
this.loaded = new EventEmitter();
|
|
16
|
+
/**
|
|
17
|
+
* Width of the card
|
|
18
|
+
* @default `240px`
|
|
19
|
+
*/
|
|
20
|
+
this.width = '240px';
|
|
21
|
+
/**
|
|
22
|
+
* Height of the card
|
|
23
|
+
* @default `320px`
|
|
24
|
+
*/
|
|
25
|
+
this.height = '320px';
|
|
26
|
+
/**
|
|
27
|
+
* Inset padding of the parallax
|
|
28
|
+
* @default 80
|
|
29
|
+
*/
|
|
30
|
+
this.bgInset = 80;
|
|
31
|
+
/**
|
|
32
|
+
* Duration for the flip animation in ms
|
|
33
|
+
* @default 80
|
|
34
|
+
*/
|
|
35
|
+
this.flipAnimationDuration = 1600;
|
|
36
|
+
this.renderCardFront = true;
|
|
37
|
+
this.renderCardBack = true;
|
|
38
|
+
this.showBackOfCard = false;
|
|
39
|
+
this.pointerX = 0;
|
|
40
|
+
this.pointerY = 0;
|
|
41
|
+
this.pointerLeave = 0;
|
|
42
|
+
this.render = () => {
|
|
43
|
+
const { width, height } = this.wrapper.getBoundingClientRect();
|
|
44
|
+
const mousePX = this.pointerX / width;
|
|
45
|
+
const mousePY = this.pointerY / height;
|
|
46
|
+
// Rotation factors
|
|
47
|
+
const rX = mousePX * this.bgInset / 1.75;
|
|
48
|
+
const rY = mousePY * -this.bgInset / 1.75;
|
|
49
|
+
// Translation factors
|
|
50
|
+
const tX = mousePX * -this.bgInset * 2;
|
|
51
|
+
const tY = mousePY * -this.bgInset * 2;
|
|
52
|
+
if (this.renderCardFront) {
|
|
53
|
+
this.backgroundElement.style.transform = `translateX(${tX}px) translateY(${tY}px)`;
|
|
54
|
+
}
|
|
55
|
+
if (this.renderCardBack) {
|
|
56
|
+
this.backfaceBackgroundElement.style.transform = `translateX(${tX}px) translateY(${tY}px)`;
|
|
57
|
+
}
|
|
58
|
+
if (this.showBackOfCard) {
|
|
59
|
+
this.cardFront.style.transform = `rotateY(180deg) rotateX(${-rY}deg)`;
|
|
60
|
+
this.cardBack.style.transform = `rotateY(${-rX}deg) rotateX(${-rY}deg)`;
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
this.cardFront.style.transform = `rotateY(${rX}deg) rotateX(${rY}deg)`;
|
|
64
|
+
this.cardBack.style.transform = `rotateY(180deg) rotateX(${-rY}deg)`;
|
|
65
|
+
}
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
ngAfterViewInit() {
|
|
69
|
+
const el = this.wrapper;
|
|
70
|
+
// Directly attach events to the wrapper
|
|
71
|
+
el.onpointermove = (e) => this.onPointerMove(e);
|
|
72
|
+
el.onpointerenter = () => this.onPointerEnter();
|
|
73
|
+
el.onpointerleave = () => this.onPointerLeave();
|
|
74
|
+
el.onclick = () => this.onClick();
|
|
75
|
+
this.loaded.emit();
|
|
76
|
+
}
|
|
77
|
+
onPointerMove(e) {
|
|
78
|
+
const { width, height, left, top } = this.wrapper.getBoundingClientRect();
|
|
79
|
+
this.pointerX = e.pageX - left - (width / 2);
|
|
80
|
+
this.pointerY = e.pageY - top - (height / 2);
|
|
81
|
+
this.render();
|
|
82
|
+
}
|
|
83
|
+
onPointerEnter() {
|
|
84
|
+
clearTimeout(this.pointerLeave);
|
|
85
|
+
}
|
|
86
|
+
onPointerLeave() {
|
|
87
|
+
this.pointerLeave = setTimeout(() => {
|
|
88
|
+
this.pointerX = 0;
|
|
89
|
+
this.pointerY = 0;
|
|
90
|
+
this.render();
|
|
91
|
+
}, 600);
|
|
92
|
+
}
|
|
93
|
+
// TODO: This can get intercepted in some states
|
|
94
|
+
onClick() {
|
|
95
|
+
this.showBackOfCard = !this.showBackOfCard;
|
|
96
|
+
this.render();
|
|
97
|
+
}
|
|
98
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ParallaxCardComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
99
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ParallaxCardComponent, isStandalone: true, selector: "ngx-parallax-card", inputs: { width: "width", height: "height", bgInset: "bgInset", flipAnimationDuration: "flipAnimationDuration" }, outputs: { loaded: "loaded" }, host: { properties: { "style.width": "width", "style.height": "height", "style.--card-bg-inset": "-bgInset+\"px\"", "style.--flip-animation-duration": "flipAnimationDuration+\"ms\"", "class.flip": "showBackOfCard" } }, queries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: TemplateRef }, { propertyName: "background", first: true, predicate: ["background"], descendants: true, read: TemplateRef }, { propertyName: "backContent", first: true, predicate: ["backContent"], descendants: true, read: TemplateRef }, { propertyName: "backBackground", first: true, predicate: ["backBackground"], descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (renderCardBack) {\n <div class=\"card backface\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"backBackground\" />\n </div>\n <div class=\"card-content\">\n <ng-template [ngTemplateOutlet]=\"backContent\" />\n </div>\n </div>\n}\n\n@if (renderCardFront) {\n <div class=\"card front\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"background\" />\n </div>\n <div class=\"card-content\">\n @if (content) {\n <ng-template [ngTemplateOutlet]=\"content\"/>\n }\n @else {\n <ng-content/>\n }\n </div>\n </div>\n}\n\n\n", styles: [":host{display:block;position:relative;cursor:pointer;--easing-function: cubic-bezier(.23, 1, .32, 1);--border-radius: 9px}.card{position:absolute;height:100%;width:100%;background-color:#333;backface-visibility:hidden;overflow:hidden;box-shadow:#0000 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px;border-radius:var(--border-radius);transition:transform var(--flip-animation-duration) var(--easing-function),box-shadow 2s var(--easing-function);transform-style:preserve-3d}.card:hover{box-shadow:#fff6 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px}.card:hover .card-content{border:2px solid #fff}.card-bg{inset:var(--card-bg-inset);position:absolute;pointer-events:none;transition:transform .6s var(--easing-function)}.card-content{position:absolute;top:0;color:#fff;height:100%;width:100%;z-index:1;border:2px solid rgba(255,255,255,0);border-radius:var(--border-radius);transition:transform .6s var(--easing-function),border-color .6s var(--easing-function)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
100
|
+
}
|
|
101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ParallaxCardComponent, decorators: [{
|
|
102
|
+
type: Component,
|
|
103
|
+
args: [{ selector: 'ngx-parallax-card', imports: [
|
|
104
|
+
NgTemplateOutlet
|
|
105
|
+
], host: {
|
|
106
|
+
'[style.width]': 'width',
|
|
107
|
+
'[style.height]': 'height',
|
|
108
|
+
'[style.--card-bg-inset]': '-bgInset+"px"',
|
|
109
|
+
'[style.--flip-animation-duration]': 'flipAnimationDuration+"ms"',
|
|
110
|
+
'[class.flip]': 'showBackOfCard'
|
|
111
|
+
}, standalone: true, template: "@if (renderCardBack) {\n <div class=\"card backface\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"backBackground\" />\n </div>\n <div class=\"card-content\">\n <ng-template [ngTemplateOutlet]=\"backContent\" />\n </div>\n </div>\n}\n\n@if (renderCardFront) {\n <div class=\"card front\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"background\" />\n </div>\n <div class=\"card-content\">\n @if (content) {\n <ng-template [ngTemplateOutlet]=\"content\"/>\n }\n @else {\n <ng-content/>\n }\n </div>\n </div>\n}\n\n\n", styles: [":host{display:block;position:relative;cursor:pointer;--easing-function: cubic-bezier(.23, 1, .32, 1);--border-radius: 9px}.card{position:absolute;height:100%;width:100%;background-color:#333;backface-visibility:hidden;overflow:hidden;box-shadow:#0000 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px;border-radius:var(--border-radius);transition:transform var(--flip-animation-duration) var(--easing-function),box-shadow 2s var(--easing-function);transform-style:preserve-3d}.card:hover{box-shadow:#fff6 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px}.card:hover .card-content{border:2px solid #fff}.card-bg{inset:var(--card-bg-inset);position:absolute;pointer-events:none;transition:transform .6s var(--easing-function)}.card-content{position:absolute;top:0;color:#fff;height:100%;width:100%;z-index:1;border:2px solid rgba(255,255,255,0);border-radius:var(--border-radius);transition:transform .6s var(--easing-function),border-color .6s var(--easing-function)}\n"] }]
|
|
112
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { content: [{
|
|
113
|
+
type: ContentChild,
|
|
114
|
+
args: ['content', { read: TemplateRef }]
|
|
115
|
+
}], background: [{
|
|
116
|
+
type: ContentChild,
|
|
117
|
+
args: ['background', { read: TemplateRef }]
|
|
118
|
+
}], backContent: [{
|
|
119
|
+
type: ContentChild,
|
|
120
|
+
args: ['backContent', { read: TemplateRef }]
|
|
121
|
+
}], backBackground: [{
|
|
122
|
+
type: ContentChild,
|
|
123
|
+
args: ['backBackground', { read: TemplateRef }]
|
|
124
|
+
}], loaded: [{
|
|
125
|
+
type: Output
|
|
126
|
+
}], width: [{
|
|
127
|
+
type: Input
|
|
128
|
+
}], height: [{
|
|
129
|
+
type: Input
|
|
130
|
+
}], bgInset: [{
|
|
131
|
+
type: Input
|
|
132
|
+
}], flipAnimationDuration: [{
|
|
133
|
+
type: Input
|
|
134
|
+
}] } });
|
|
135
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFyYWxsYXgtY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21tb24vc3JjL2NvbXBvbmVudHMvcGFyYWxsYXgtY2FyZC9wYXJhbGxheC1jYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbW1vbi9zcmMvY29tcG9uZW50cy9wYXJhbGxheC1jYXJkL3BhcmFsbGF4LWNhcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDbkQsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsV0FBVyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQXVCOUcsTUFBTSxPQUFPLHFCQUFxQjtJQXdDOUIsSUFBWSxPQUFPLEtBQUssT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLGFBQTRCLENBQUMsQ0FBQyxDQUFDO0lBQzNFLElBQVksU0FBUyxLQUFLLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFnQixDQUFDLENBQUMsQ0FBQztJQUM1RixJQUFZLFFBQVEsS0FBSyxPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLGdCQUFnQixDQUFnQixDQUFDLENBQUMsQ0FBQztJQUM5RixJQUFZLGlCQUFpQixLQUFLLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQyxhQUFhLENBQUMsVUFBVSxDQUFtQixDQUFDLENBQUMsQ0FBQztJQUN0RyxJQUFZLHlCQUF5QixLQUFLLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLENBQUMsVUFBVSxDQUFtQixDQUFDLENBQUMsQ0FBQztJQU03RyxZQUNxQixPQUFtQjtRQUFuQixZQUFPLEdBQVAsT0FBTyxDQUFZO1FBekN4Qzs7V0FFRztR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ZlEsZ0JBQWdCOzsyRkFXWCxxQkFBcUI7a0JBaEJqQyxTQUFTOytCQUNJLG1CQUFtQixXQUdwQjt3QkFDTCxnQkFBZ0I7cUJBQ25CLFFBQ0s7d0JBQ0YsZUFBZSxFQUFFLE9BQU87d0JBQ3hCLGdCQUFnQixFQUFFLFFBQVE7d0JBQzFCLHlCQUF5QixFQUFFLGVBQWU7d0JBQzFDLG1DQUFtQyxFQUFFLDRCQUE0Qjt3QkFDakUsY0FBYyxFQUFFLGdCQUFnQjtxQkFDbkMsY0FDVyxJQUFJOytFQUtnQyxPQUFPO3NCQUF0RCxZQUFZO3VCQUFDLFNBQVMsRUFBRSxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUU7Z0JBQ0ssVUFBVTtzQkFBNUQsWUFBWTt1QkFBQyxZQUFZLEVBQUUsRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFO2dCQUdHLFdBQVc7c0JBQTlELFlBQVk7dUJBQUMsYUFBYSxFQUFFLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRTtnQkFDSyxjQUFjO3NCQUFwRSxZQUFZO3VCQUFDLGdCQUFnQixFQUFFLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRTtnQkFLM0MsTUFBTTtzQkFBZixNQUFNO2dCQU1FLEtBQUs7c0JBQWIsS0FBSztnQkFLRyxNQUFNO3NCQUFkLEtBQUs7Z0JBS0csT0FBTztzQkFBZixLQUFLO2dCQUtHLHFCQUFxQjtzQkFBN0IsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nVGVtcGxhdGVPdXRsZXQgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBDb250ZW50Q2hpbGQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCwgVGVtcGxhdGVSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxudHlwZSBDU1NVbml0U3RyaW5nID0gJ3B4JyB8ICclJyB8ICdlbScgfCAnaW4nIHwgJyc7XG50eXBlIENTU1VuaXQgPSBgJHtudW1iZXJ9JHtDU1NVbml0U3RyaW5nfWAgfCBgdmFyKC0tJHtzdHJpbmd9KWA7XG50eXBlIENTU1N0cmluZyA9IENTU1VuaXQgfFxuICAgIGBjYWxjKCR7Q1NTVW5pdHwnJ30keycnfCcgJ30keycrJ3wnLSd8Jy8nfCcqJ30keycnfCcgJ30ke0NTU1VuaXR8Jyd9KWBcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICduZ3gtcGFyYWxsYXgtY2FyZCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3BhcmFsbGF4LWNhcmQuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3BhcmFsbGF4LWNhcmQuY29tcG9uZW50LnNjc3MnXSxcbiAgICBpbXBvcnRzOiBbXG4gICAgICAgIE5nVGVtcGxhdGVPdXRsZXRcbiAgICBdLFxuICAgIGhvc3Q6IHtcbiAgICAgICAgJ1tzdHlsZS53aWR0aF0nOiAnd2lkdGgnLFxuICAgICAgICAnW3N0eWxlLmhlaWdodF0nOiAnaGVpZ2h0JyxcbiAgICAgICAgJ1tzdHlsZS4tLWNhcmQtYmctaW5zZXRdJzogJy1iZ0luc2V0K1wicHhcIicsXG4gICAgICAgICdbc3R5bGUuLS1mbGlwLWFuaW1hdGlvbi1kdXJhdGlvbl0nOiAnZmxpcEFuaW1hdGlvbkR1cmF0aW9uK1wibXNcIicsXG4gICAgICAgICdbY2xhc3MuZmxpcF0nOiAnc2hvd0JhY2tPZkNhcmQnXG4gICAgfSxcbiAgICBzdGFuZGFsb25lOiB0cnVlXG59KVxuZXhwb3J0IGNsYXNzIFBhcmFsbGF4Q2FyZENvbXBvbmVudCB7XG5cbiAgICAvLyBGcm9udCBvZiBjYXJkXG4gICAgQENvbnRlbnRDaGlsZCgnY29udGVudCcsIHsgcmVhZDogVGVtcGxhdGVSZWYgfSkgY29udGVudDogVGVtcGxhdGVSZWY8RWxlbWVudFJlZj47XG4gICAgQENvbnRlbnRDaGlsZCgnYmFja2dyb3VuZCcsIHsgcmVhZDogVGVtcGxhdGVSZWYgfSkgYmFja2dyb3VuZDogVGVtcGxhdGVSZWY8RWxlbWVudFJlZj47XG5cbiAgICAvLyBCYWNrIG9mIGNhcmRcbiAgICBAQ29udGVudENoaWxkKCdiYWNrQ29udGVudCcsIHsgcmVhZDogVGVtcGxhdGVSZWYgfSkgYmFja0NvbnRlbnQ6IFRlbXBsYXRlUmVmPEVsZW1lbnRSZWY+O1xuICAgIEBDb250ZW50Q2hpbGQoJ2JhY2tCYWNrZ3JvdW5kJywgeyByZWFkOiBUZW1wbGF0ZVJlZiB9KSBiYWNrQmFja2dyb3VuZDogVGVtcGxhdGVSZWY8RWxlbWVudFJlZj47XG5cbiAgICAvKipcbiAgICAgKlxuICAgICAqL1xuICAgIEBPdXRwdXQoKSBsb2FkZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgICAvKipcbiAgICAgKiBXaWR0aCBvZiB0aGUgY2FyZFxuICAgICAqIEBkZWZhdWx0IGAyNDBweGBcbiAgICAgKi9cbiAgICBASW5wdXQoKSB3aWR0aDogIENTU1N0cmluZyA9ICcyNDBweCc7XG4gICAgLyoqXG4gICAgICogSGVpZ2h0IG9mIHRoZSBjYXJkXG4gICAgICogQGRlZmF1bHQgYDMyMHB4YFxuICAgICAqL1xuICAgIEBJbnB1dCgpIGhlaWdodDogQ1NTU3RyaW5nID0gJzMyMHB4JztcbiAgICAvKipcbiAgICAgKiBJbnNldCBwYWRkaW5nIG9mIHRoZSBwYXJhbGxheFxuICAgICAqIEBkZWZhdWx0IDgwXG4gICAgICovXG4gICAgQElucHV0KCkgYmdJbnNldDogIG51bWJlciA9IDgwO1xuICAgIC8qKlxuICAgICAqIER1cmF0aW9uIGZvciB0aGUgZmxpcCBhbmltYXRpb24gaW4gbXNcbiAgICAgKiBAZGVmYXVsdCA4MFxuICAgICAqL1xuICAgIEBJbnB1dCgpIGZsaXBBbmltYXRpb25EdXJhdGlvbjogIG51bWJlciA9IDE2MDA7XG5cbiAgICByZW5kZXJDYXJkRnJvbnQgPSB0cnVlO1xuICAgIHJlbmRlckNhcmRCYWNrID0gdHJ1ZTtcbiAgICBzaG93QmFja09mQ2FyZCA9IGZhbHNlO1xuXG4gICAgcHJpdmF0ZSBnZXQgd3JhcHBlcigpIHsgcmV0dXJuIHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50IGFzIEhUTUxFbGVtZW50OyB9XG4gICAgcHJpdmF0ZSBnZXQgY2FyZEZyb250KCkgeyByZXR1cm4gdGhpcy53cmFwcGVyLnF1ZXJ5U2VsZWN0b3IoJy5jYXJkLmZyb250JykgYXMgSFRNTEVsZW1lbnQ7IH1cbiAgICBwcml2YXRlIGdldCBjYXJkQmFjaygpIHsgcmV0dXJuIHRoaXMud3JhcHBlci5xdWVyeVNlbGVjdG9yKCcuY2FyZC5iYWNrZmFjZScpIGFzIEhUTUxFbGVtZW50OyB9XG4gICAgcHJpdmF0ZSBnZXQgYmFja2dyb3VuZEVsZW1lbnQoKSB7IHJldHVybiB0aGlzLmNhcmRGcm9udC5xdWVyeVNlbGVjdG9yKCcuY2FyZC1iZycpIGFzIEhUTUxEaXZFbGVtZW50OyB9XG4gICAgcHJpdmF0ZSBnZXQgYmFja2ZhY2VCYWNrZ3JvdW5kRWxlbWVudCgpIHsgcmV0dXJuIHRoaXMuY2FyZEJhY2sucXVlcnlTZWxlY3RvcignLmNhcmQtYmcnKSBhcyBIVE1MRGl2RWxlbWVudDsgfVxuXG4gICAgcHJpdmF0ZSBwb2ludGVyWCA9IDA7XG4gICAgcHJpdmF0ZSBwb2ludGVyWSA9IDA7XG4gICAgcHJpdmF0ZSBwb2ludGVyTGVhdmUgPSAwO1xuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByaXZhdGUgcmVhZG9ubHkgZWxlbWVudDogRWxlbWVudFJlZlxuICAgICkgeyB9XG5cbiAgICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgICAgIGNvbnN0IGVsID0gdGhpcy53cmFwcGVyO1xuXG4gICAgICAgIC8vIERpcmVjdGx5IGF0dGFjaCBldmVudHMgdG8gdGhlIHdyYXBwZXJcbiAgICAgICAgZWwub25wb2ludGVybW92ZSA9IChlKSA9PiB0aGlzLm9uUG9pbnRlck1vdmUoZSk7XG4gICAgICAgIGVsLm9ucG9pbnRlcmVudGVyID0gKCkgPT4gdGhpcy5vblBvaW50ZXJFbnRlcigpO1xuICAgICAgICBlbC5vbnBvaW50ZXJsZWF2ZSA9ICgpID0+IHRoaXMub25Qb2ludGVyTGVhdmUoKTtcbiAgICAgICAgZWwub25jbGljayA9ICgpID0+IHRoaXMub25DbGljaygpO1xuXG4gICAgICAgIHRoaXMubG9hZGVkLmVtaXQoKTtcbiAgICB9XG5cbiAgICBvblBvaW50ZXJNb3ZlKGU6IFBvaW50ZXJFdmVudCkge1xuICAgICAgICBjb25zdCB7IHdpZHRoLCBoZWlnaHQsIGxlZnQsIHRvcCB9ID0gdGhpcy53cmFwcGVyLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICAgICAgICB0aGlzLnBvaW50ZXJYID0gZS5wYWdlWCAtIGxlZnQgLSAod2lkdGggLyAyKTtcbiAgICAgICAgdGhpcy5wb2ludGVyWSA9IGUucGFnZVkgLSB0b3AgLSAoaGVpZ2h0IC8gMik7XG5cbiAgICAgICAgdGhpcy5yZW5kZXIoKTtcbiAgICB9XG5cbiAgICBvblBvaW50ZXJFbnRlcigpIHtcbiAgICAgICAgY2xlYXJUaW1lb3V0KHRoaXMucG9pbnRlckxlYXZlKTtcbiAgICB9XG5cbiAgICBvblBvaW50ZXJMZWF2ZSgpIHtcbiAgICAgICAgdGhpcy5wb2ludGVyTGVhdmUgPSBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgICAgIHRoaXMucG9pbnRlclggPSAwO1xuICAgICAgICAgICAgdGhpcy5wb2ludGVyWSA9IDA7XG4gICAgICAgICAgICB0aGlzLnJlbmRlcigpO1xuICAgICAgICB9LCA2MDApIGFzIGFueTtcbiAgICB9XG5cbiAgICAvLyBUT0RPOiBUaGlzIGNhbiBnZXQgaW50ZXJjZXB0ZWQgaW4gc29tZSBzdGF0ZXNcbiAgICBvbkNsaWNrKCkge1xuICAgICAgICB0aGlzLnNob3dCYWNrT2ZDYXJkID0gIXRoaXMuc2hvd0JhY2tPZkNhcmQ7XG4gICAgICAgIHRoaXMucmVuZGVyKClcbiAgICB9XG5cbiAgICByZW5kZXIgPSAoKSA9PiB7XG4gICAgICAgIGNvbnN0IHsgd2lkdGgsIGhlaWdodCB9ID0gdGhpcy53cmFwcGVyLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICAgICAgICBjb25zdCBtb3VzZVBYID0gdGhpcy5wb2ludGVyWCAvIHdpZHRoO1xuICAgICAgICBjb25zdCBtb3VzZVBZID0gdGhpcy5wb2ludGVyWSAvIGhlaWdodDtcblxuICAgICAgICAvLyBSb3RhdGlvbiBmYWN0b3JzXG4gICAgICAgIGNvbnN0IHJYID0gbW91c2VQWCAqIHRoaXMuYmdJbnNldCAvIDEuNzU7XG4gICAgICAgIGNvbnN0IHJZID0gbW91c2VQWSAqIC10aGlzLmJnSW5zZXQgLyAxLjc1O1xuXG4gICAgICAgIC8vIFRyYW5zbGF0aW9uIGZhY3RvcnNcbiAgICAgICAgY29uc3QgdFggPSBtb3VzZVBYICogLXRoaXMuYmdJbnNldCAqIDI7XG4gICAgICAgIGNvbnN0IHRZID0gbW91c2VQWSAqIC10aGlzLmJnSW5zZXQgKiAyO1xuXG4gICAgICAgIGlmICh0aGlzLnJlbmRlckNhcmRGcm9udCkge1xuICAgICAgICAgICAgdGhpcy5iYWNrZ3JvdW5kRWxlbWVudC5zdHlsZS50cmFuc2Zvcm0gPSBgdHJhbnNsYXRlWCgke3RYfXB4KSB0cmFuc2xhdGVZKCR7dFl9cHgpYDtcbiAgICAgICAgfVxuICAgICAgICBpZiAodGhpcy5yZW5kZXJDYXJkQmFjaykge1xuICAgICAgICAgICAgdGhpcy5iYWNrZmFjZUJhY2tncm91bmRFbGVtZW50LnN0eWxlLnRyYW5zZm9ybSA9IGB0cmFuc2xhdGVYKCR7dFh9cHgpIHRyYW5zbGF0ZVkoJHt0WX1weClgO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKHRoaXMuc2hvd0JhY2tPZkNhcmQpIHtcbiAgICAgICAgICAgIHRoaXMuY2FyZEZyb250LnN0eWxlLnRyYW5zZm9ybSA9IGByb3RhdGVZKDE4MGRlZykgcm90YXRlWCgkey1yWX1kZWcpYDtcbiAgICAgICAgICAgIHRoaXMuY2FyZEJhY2suc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVkoJHstclh9ZGVnKSByb3RhdGVYKCR7LXJZfWRlZylgO1xuICAgICAgICB9XG4gICAgICAgIGVsc2Uge1xuICAgICAgICAgICAgdGhpcy5jYXJkRnJvbnQuc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVkoJHtyWH1kZWcpIHJvdGF0ZVgoJHtyWX1kZWcpYDtcbiAgICAgICAgICAgIHRoaXMuY2FyZEJhY2suc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVkoMTgwZGVnKSByb3RhdGVYKCR7LXJZfWRlZylgO1xuICAgICAgICB9XG4gICAgfVxufVxuIiwiQGlmIChyZW5kZXJDYXJkQmFjaykge1xuICAgIDxkaXYgY2xhc3M9XCJjYXJkIGJhY2tmYWNlXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWJnXCIgc3R5bGU9XCJ0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMCkgdHJhbnNsYXRlWSgwKVwiPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImJhY2tCYWNrZ3JvdW5kXCIgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWNvbnRlbnRcIj5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSBbbmdUZW1wbGF0ZU91dGxldF09XCJiYWNrQ29udGVudFwiIC8+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxufVxuXG5AaWYgKHJlbmRlckNhcmRGcm9udCkge1xuICAgIDxkaXYgY2xhc3M9XCJjYXJkIGZyb250XCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWJnXCIgc3R5bGU9XCJ0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMCkgdHJhbnNsYXRlWSgwKVwiPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImJhY2tncm91bmRcIiAvPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNhcmQtY29udGVudFwiPlxuICAgICAgICAgICAgQGlmIChjb250ZW50KSB7XG4gICAgICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImNvbnRlbnRcIi8+XG4gICAgICAgICAgICB9XG4gICAgICAgICAgICBAZWxzZSB7XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRlbnQvPlxuICAgICAgICAgICAgfVxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbn1cblxuXG4iXX0=
|
package/esm2022/public-api.mjs
CHANGED
|
@@ -53,7 +53,8 @@ export * from './components/filemanager/filemanager.component';
|
|
|
53
53
|
// export * from './components/music-library/music-library.component';
|
|
54
54
|
export * from './components/tabulator/tabulator.component';
|
|
55
55
|
export * from './components/vscode/vscode.component';
|
|
56
|
+
export * from './components/parallax-card/parallax-card.component';
|
|
56
57
|
export * from './components/react-magic-wrapper/react-magic-wrapper.component';
|
|
57
58
|
export * from './components/types';
|
|
58
59
|
export { ConsoleLogger, LogIcon } from './utils/index';
|
|
59
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
60
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3BhY2thZ2VzL2NvbW1vbi9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVIOztHQUVHO0FBQ0gsY0FBYyxjQUFjLENBQUM7QUFDN0IsY0FBYyxlQUFlLENBQUM7QUFFOUI7O0dBRUc7QUFDSCxjQUFjLGdDQUFnQyxDQUFDO0FBQy9DLGNBQWMsNkJBQTZCLENBQUM7QUFDNUMsY0FBYyxvQ0FBb0MsQ0FBQztBQUVuRDs7R0FFRztBQUNILGNBQWMsMEJBQTBCLENBQUM7QUFDekMsY0FBYyw4QkFBOEIsQ0FBQztBQUM3QyxjQUFjLDRCQUE0QixDQUFDO0FBQzNDLGNBQWMsMkJBQTJCLENBQUM7QUFDMUMsY0FBYyx5QkFBeUIsQ0FBQztBQUV4Qzs7RUFFRTtBQUNGLGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYywyQkFBMkIsQ0FBQztBQUMxQyxjQUFjLDBCQUEwQixDQUFDO0FBQ3pDLGNBQWMsNkJBQTZCLENBQUM7QUFDNUMsY0FBYyx5QkFBeUIsQ0FBQztBQUN4QyxjQUFjLDBCQUEwQixDQUFDO0FBQ3pDLGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxvREFBb0Q7QUFFcEQ7O0VBRUU7QUFDRixjQUFjLDhDQUE4QyxDQUFDO0FBQzdELGNBQWMsNkNBQTZDLENBQUM7QUFDNUQsY0FBYyxnREFBZ0QsQ0FBQztBQUMvRCxjQUFjLGdDQUFnQyxDQUFDO0FBRS9DOztFQUVFO0FBQ0YsY0FBYyxnREFBZ0QsQ0FBQztBQUMvRCxjQUFjLCtDQUErQyxDQUFDO0FBQzlELGNBQWMsa0RBQWtELENBQUM7QUFDakUsY0FBYyxpQ0FBaUMsQ0FBQztBQUVoRDs7R0FFRztBQUNILGNBQWMsZ0RBQWdELENBQUM7QUFDL0Qsc0VBQXNFO0FBQ3RFLGNBQWMsNENBQTRDLENBQUM7QUFDM0QsY0FBYyxzQ0FBc0MsQ0FBQztBQUNyRCxjQUFjLG9EQUFvRCxDQUFDO0FBQ25FLGNBQWMsZ0VBQWdFLENBQUM7QUFDL0UsY0FBYyxvQkFBb0IsQ0FBQztBQUduQyxPQUFPLEVBQUUsYUFBYSxFQUFFLE9BQU8sRUFBRSxNQUFNLGVBQWUsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2YgcGFja2FnZVxuICovXG5cbi8qKlxuICoqIFR5cGVzXG4gKi9cbmV4cG9ydCAqIGZyb20gJy4vdHlwZXMvbWVudSc7XG5leHBvcnQgKiBmcm9tICcuL3R5cGVzL3BvcHVwJztcblxuLyoqXG4gKiogRGlyZWN0aXZlc1xuICovXG5leHBvcnQgKiBmcm9tICcuL2RpcmVjdGl2ZXMvdG9vbHRpcC5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9kaXJlY3RpdmVzL21lbnUuZGlyZWN0aXZlJztcbmV4cG9ydCAqIGZyb20gJy4vZGlyZWN0aXZlcy9pbWFnZS1jYWNoZS5kaXJlY3RpdmUnO1xuXG4vKipcbiAqKiBQaXBlc1xuICovXG5leHBvcnQgKiBmcm9tICcuL3BpcGVzL2h0bWwtYnlwYXNzLnBpcGUnO1xuZXhwb3J0ICogZnJvbSAnLi9waXBlcy9yZXNvdXJjZS1ieXBhc3MucGlwZSc7XG5leHBvcnQgKiBmcm9tICcuL3BpcGVzL3NjcmlwdC1ieXBhc3MucGlwZSc7XG5leHBvcnQgKiBmcm9tICcuL3BpcGVzL3N0eWxlLWJ5cGFzcy5waXBlJztcbmV4cG9ydCAqIGZyb20gJy4vcGlwZXMvdXJsLWJ5cGFzcy5waXBlJztcblxuLyoqXG4qKiBTZXJ2aWNlc1xuKi9cbmV4cG9ydCAqIGZyb20gJy4vc2VydmljZXMvZGVwZW5kZW5jeS5zZXJ2aWNlJztcbmV4cG9ydCAqIGZyb20gJy4vc2VydmljZXMvZGlhbG9nLnNlcnZpY2UnO1xuZXhwb3J0ICogZnJvbSAnLi9zZXJ2aWNlcy9mZXRjaC5zZXJ2aWNlJztcbmV4cG9ydCAqIGZyb20gJy4vc2VydmljZXMva2V5Ym9hcmQuc2VydmljZSc7XG5leHBvcnQgKiBmcm9tICcuL3NlcnZpY2VzL2ZpbGUuc2VydmljZSc7XG5leHBvcnQgKiBmcm9tICcuL3NlcnZpY2VzL3RoZW1lLnNlcnZpY2UnO1xuZXhwb3J0ICogZnJvbSAnLi9zZXJ2aWNlcy9uYXZpZ2F0aW9uLnNlcnZpY2UnO1xuZXhwb3J0ICogZnJvbSAnLi9zZXJ2aWNlcy9jb21tYW5kLXBhbGV0dGUuc2VydmljZSc7XG4vLyBleHBvcnQgKiBmcm9tICcuL3NlcnZpY2VzL3NlcnZpY2V3b3JrZXIuc2VydmljZSc7XG5cbi8qKlxuKiogTGF6eSBsb2FkZXIgY29tcG9uZW50ICYgc2VydmljZVxuKi9cbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9sYXp5LWxvYWRlci9sYXp5LWxvYWRlci5zZXJ2aWNlJztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9sYXp5LWxvYWRlci9sYXp5LWxvYWRlci5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2xhenktbG9hZGVyL2xhenktbG9hZGVyLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbGF6eS1sb2FkZXIvdHlwZXMnO1xuXG4vKipcbioqIER5bmFtaWMgSFRNTCAoV0lQKVxuKi9cbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9keW5hbWljLWh0bWwvZHluYW1pYy1odG1sLnNlcnZpY2UnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2R5bmFtaWMtaHRtbC9keW5hbWljLWh0bWwubW9kdWxlJztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9keW5hbWljLWh0bWwvZHluYW1pYy1odG1sLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZHluYW1pYy1odG1sL3R5cGVzJztcblxuLyoqXG4gKiogQ29tcG9uZW50c1xuICovXG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZmlsZW1hbmFnZXIvZmlsZW1hbmFnZXIuY29tcG9uZW50Jztcbi8vIGV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9tdXNpYy1saWJyYXJ5L211c2ljLWxpYnJhcnkuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy90YWJ1bGF0b3IvdGFidWxhdG9yLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvdnNjb2RlL3ZzY29kZS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3BhcmFsbGF4LWNhcmQvcGFyYWxsYXgtY2FyZC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3JlYWN0LW1hZ2ljLXdyYXBwZXIvcmVhY3QtbWFnaWMtd3JhcHBlci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3R5cGVzJztcblxuXG5leHBvcnQgeyBDb25zb2xlTG9nZ2VyLCBMb2dJY29uIH0gZnJvbSAnLi91dGlscy9pbmRleCc7XG4iXX0=
|
|
@@ -11376,6 +11376,138 @@ const InstallMonacoUMD = async (path) => {
|
|
|
11376
11376
|
});
|
|
11377
11377
|
};
|
|
11378
11378
|
|
|
11379
|
+
class ParallaxCardComponent {
|
|
11380
|
+
get wrapper() { return this.element.nativeElement; }
|
|
11381
|
+
get cardFront() { return this.wrapper.querySelector('.card.front'); }
|
|
11382
|
+
get cardBack() { return this.wrapper.querySelector('.card.backface'); }
|
|
11383
|
+
get backgroundElement() { return this.cardFront.querySelector('.card-bg'); }
|
|
11384
|
+
get backfaceBackgroundElement() { return this.cardBack.querySelector('.card-bg'); }
|
|
11385
|
+
constructor(element) {
|
|
11386
|
+
this.element = element;
|
|
11387
|
+
/**
|
|
11388
|
+
*
|
|
11389
|
+
*/
|
|
11390
|
+
this.loaded = new EventEmitter();
|
|
11391
|
+
/**
|
|
11392
|
+
* Width of the card
|
|
11393
|
+
* @default `240px`
|
|
11394
|
+
*/
|
|
11395
|
+
this.width = '240px';
|
|
11396
|
+
/**
|
|
11397
|
+
* Height of the card
|
|
11398
|
+
* @default `320px`
|
|
11399
|
+
*/
|
|
11400
|
+
this.height = '320px';
|
|
11401
|
+
/**
|
|
11402
|
+
* Inset padding of the parallax
|
|
11403
|
+
* @default 80
|
|
11404
|
+
*/
|
|
11405
|
+
this.bgInset = 80;
|
|
11406
|
+
/**
|
|
11407
|
+
* Duration for the flip animation in ms
|
|
11408
|
+
* @default 80
|
|
11409
|
+
*/
|
|
11410
|
+
this.flipAnimationDuration = 1600;
|
|
11411
|
+
this.renderCardFront = true;
|
|
11412
|
+
this.renderCardBack = true;
|
|
11413
|
+
this.showBackOfCard = false;
|
|
11414
|
+
this.pointerX = 0;
|
|
11415
|
+
this.pointerY = 0;
|
|
11416
|
+
this.pointerLeave = 0;
|
|
11417
|
+
this.render = () => {
|
|
11418
|
+
const { width, height } = this.wrapper.getBoundingClientRect();
|
|
11419
|
+
const mousePX = this.pointerX / width;
|
|
11420
|
+
const mousePY = this.pointerY / height;
|
|
11421
|
+
// Rotation factors
|
|
11422
|
+
const rX = mousePX * this.bgInset / 1.75;
|
|
11423
|
+
const rY = mousePY * -this.bgInset / 1.75;
|
|
11424
|
+
// Translation factors
|
|
11425
|
+
const tX = mousePX * -this.bgInset * 2;
|
|
11426
|
+
const tY = mousePY * -this.bgInset * 2;
|
|
11427
|
+
if (this.renderCardFront) {
|
|
11428
|
+
this.backgroundElement.style.transform = `translateX(${tX}px) translateY(${tY}px)`;
|
|
11429
|
+
}
|
|
11430
|
+
if (this.renderCardBack) {
|
|
11431
|
+
this.backfaceBackgroundElement.style.transform = `translateX(${tX}px) translateY(${tY}px)`;
|
|
11432
|
+
}
|
|
11433
|
+
if (this.showBackOfCard) {
|
|
11434
|
+
this.cardFront.style.transform = `rotateY(180deg) rotateX(${-rY}deg)`;
|
|
11435
|
+
this.cardBack.style.transform = `rotateY(${-rX}deg) rotateX(${-rY}deg)`;
|
|
11436
|
+
}
|
|
11437
|
+
else {
|
|
11438
|
+
this.cardFront.style.transform = `rotateY(${rX}deg) rotateX(${rY}deg)`;
|
|
11439
|
+
this.cardBack.style.transform = `rotateY(180deg) rotateX(${-rY}deg)`;
|
|
11440
|
+
}
|
|
11441
|
+
};
|
|
11442
|
+
}
|
|
11443
|
+
ngAfterViewInit() {
|
|
11444
|
+
const el = this.wrapper;
|
|
11445
|
+
// Directly attach events to the wrapper
|
|
11446
|
+
el.onpointermove = (e) => this.onPointerMove(e);
|
|
11447
|
+
el.onpointerenter = () => this.onPointerEnter();
|
|
11448
|
+
el.onpointerleave = () => this.onPointerLeave();
|
|
11449
|
+
el.onclick = () => this.onClick();
|
|
11450
|
+
this.loaded.emit();
|
|
11451
|
+
}
|
|
11452
|
+
onPointerMove(e) {
|
|
11453
|
+
const { width, height, left, top } = this.wrapper.getBoundingClientRect();
|
|
11454
|
+
this.pointerX = e.pageX - left - (width / 2);
|
|
11455
|
+
this.pointerY = e.pageY - top - (height / 2);
|
|
11456
|
+
this.render();
|
|
11457
|
+
}
|
|
11458
|
+
onPointerEnter() {
|
|
11459
|
+
clearTimeout(this.pointerLeave);
|
|
11460
|
+
}
|
|
11461
|
+
onPointerLeave() {
|
|
11462
|
+
this.pointerLeave = setTimeout(() => {
|
|
11463
|
+
this.pointerX = 0;
|
|
11464
|
+
this.pointerY = 0;
|
|
11465
|
+
this.render();
|
|
11466
|
+
}, 600);
|
|
11467
|
+
}
|
|
11468
|
+
// TODO: This can get intercepted in some states
|
|
11469
|
+
onClick() {
|
|
11470
|
+
this.showBackOfCard = !this.showBackOfCard;
|
|
11471
|
+
this.render();
|
|
11472
|
+
}
|
|
11473
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ParallaxCardComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11474
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ParallaxCardComponent, isStandalone: true, selector: "ngx-parallax-card", inputs: { width: "width", height: "height", bgInset: "bgInset", flipAnimationDuration: "flipAnimationDuration" }, outputs: { loaded: "loaded" }, host: { properties: { "style.width": "width", "style.height": "height", "style.--card-bg-inset": "-bgInset+\"px\"", "style.--flip-animation-duration": "flipAnimationDuration+\"ms\"", "class.flip": "showBackOfCard" } }, queries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: TemplateRef }, { propertyName: "background", first: true, predicate: ["background"], descendants: true, read: TemplateRef }, { propertyName: "backContent", first: true, predicate: ["backContent"], descendants: true, read: TemplateRef }, { propertyName: "backBackground", first: true, predicate: ["backBackground"], descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (renderCardBack) {\n <div class=\"card backface\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"backBackground\" />\n </div>\n <div class=\"card-content\">\n <ng-template [ngTemplateOutlet]=\"backContent\" />\n </div>\n </div>\n}\n\n@if (renderCardFront) {\n <div class=\"card front\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"background\" />\n </div>\n <div class=\"card-content\">\n @if (content) {\n <ng-template [ngTemplateOutlet]=\"content\"/>\n }\n @else {\n <ng-content/>\n }\n </div>\n </div>\n}\n\n\n", styles: [":host{display:block;position:relative;cursor:pointer;--easing-function: cubic-bezier(.23, 1, .32, 1);--border-radius: 9px}.card{position:absolute;height:100%;width:100%;background-color:#333;backface-visibility:hidden;overflow:hidden;box-shadow:#0000 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px;border-radius:var(--border-radius);transition:transform var(--flip-animation-duration) var(--easing-function),box-shadow 2s var(--easing-function);transform-style:preserve-3d}.card:hover{box-shadow:#fff6 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px}.card:hover .card-content{border:2px solid #fff}.card-bg{inset:var(--card-bg-inset);position:absolute;pointer-events:none;transition:transform .6s var(--easing-function)}.card-content{position:absolute;top:0;color:#fff;height:100%;width:100%;z-index:1;border:2px solid rgba(255,255,255,0);border-radius:var(--border-radius);transition:transform .6s var(--easing-function),border-color .6s var(--easing-function)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
11475
|
+
}
|
|
11476
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ParallaxCardComponent, decorators: [{
|
|
11477
|
+
type: Component,
|
|
11478
|
+
args: [{ selector: 'ngx-parallax-card', imports: [
|
|
11479
|
+
NgTemplateOutlet
|
|
11480
|
+
], host: {
|
|
11481
|
+
'[style.width]': 'width',
|
|
11482
|
+
'[style.height]': 'height',
|
|
11483
|
+
'[style.--card-bg-inset]': '-bgInset+"px"',
|
|
11484
|
+
'[style.--flip-animation-duration]': 'flipAnimationDuration+"ms"',
|
|
11485
|
+
'[class.flip]': 'showBackOfCard'
|
|
11486
|
+
}, standalone: true, template: "@if (renderCardBack) {\n <div class=\"card backface\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"backBackground\" />\n </div>\n <div class=\"card-content\">\n <ng-template [ngTemplateOutlet]=\"backContent\" />\n </div>\n </div>\n}\n\n@if (renderCardFront) {\n <div class=\"card front\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"background\" />\n </div>\n <div class=\"card-content\">\n @if (content) {\n <ng-template [ngTemplateOutlet]=\"content\"/>\n }\n @else {\n <ng-content/>\n }\n </div>\n </div>\n}\n\n\n", styles: [":host{display:block;position:relative;cursor:pointer;--easing-function: cubic-bezier(.23, 1, .32, 1);--border-radius: 9px}.card{position:absolute;height:100%;width:100%;background-color:#333;backface-visibility:hidden;overflow:hidden;box-shadow:#0000 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px;border-radius:var(--border-radius);transition:transform var(--flip-animation-duration) var(--easing-function),box-shadow 2s var(--easing-function);transform-style:preserve-3d}.card:hover{box-shadow:#fff6 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px}.card:hover .card-content{border:2px solid #fff}.card-bg{inset:var(--card-bg-inset);position:absolute;pointer-events:none;transition:transform .6s var(--easing-function)}.card-content{position:absolute;top:0;color:#fff;height:100%;width:100%;z-index:1;border:2px solid rgba(255,255,255,0);border-radius:var(--border-radius);transition:transform .6s var(--easing-function),border-color .6s var(--easing-function)}\n"] }]
|
|
11487
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { content: [{
|
|
11488
|
+
type: ContentChild,
|
|
11489
|
+
args: ['content', { read: TemplateRef }]
|
|
11490
|
+
}], background: [{
|
|
11491
|
+
type: ContentChild,
|
|
11492
|
+
args: ['background', { read: TemplateRef }]
|
|
11493
|
+
}], backContent: [{
|
|
11494
|
+
type: ContentChild,
|
|
11495
|
+
args: ['backContent', { read: TemplateRef }]
|
|
11496
|
+
}], backBackground: [{
|
|
11497
|
+
type: ContentChild,
|
|
11498
|
+
args: ['backBackground', { read: TemplateRef }]
|
|
11499
|
+
}], loaded: [{
|
|
11500
|
+
type: Output
|
|
11501
|
+
}], width: [{
|
|
11502
|
+
type: Input
|
|
11503
|
+
}], height: [{
|
|
11504
|
+
type: Input
|
|
11505
|
+
}], bgInset: [{
|
|
11506
|
+
type: Input
|
|
11507
|
+
}], flipAnimationDuration: [{
|
|
11508
|
+
type: Input
|
|
11509
|
+
}] } });
|
|
11510
|
+
|
|
11379
11511
|
/**
|
|
11380
11512
|
* Extend this component to automatically generate
|
|
11381
11513
|
* bindings to a React component.
|
|
@@ -11453,5 +11585,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImpor
|
|
|
11453
11585
|
* Generated bundle index. Do not edit.
|
|
11454
11586
|
*/
|
|
11455
11587
|
|
|
11456
|
-
export { CommandPaletteService, ComponentResolveStrategy, ConsoleLogger, DependencyService, DialogService, DynamicHTMLComponent, DynamicHTMLOptions, DynamicHTMLRenderer, Fetch, FileService, FilemanagerComponent, HtmlBypass, InstallMonacoUMD, KeyboardService, LazyLoaderComponent, LazyLoaderModule, LazyLoaderService, LogIcon, MenuDirective, NGX_DYNAMIC_CONFIG, NGX_IMAGE_CACHE_CONFIG, NGX_LAZY_LOADER_CONFIG, NGX_WEB_COMPONENTS_CONFIG, NavigationService, NgxDynamicHTMLModule, NgxImageCacheDirective, OnMount, ReactMagicWrapperComponent, ResourceBypass, ScriptBypass, StyleBypass, TabulatorComponent, ThemeService, TooltipDirective, UrlBypass, VscodeComponent, openMenu, openTooltip };
|
|
11588
|
+
export { CommandPaletteService, ComponentResolveStrategy, ConsoleLogger, DependencyService, DialogService, DynamicHTMLComponent, DynamicHTMLOptions, DynamicHTMLRenderer, Fetch, FileService, FilemanagerComponent, HtmlBypass, InstallMonacoUMD, KeyboardService, LazyLoaderComponent, LazyLoaderModule, LazyLoaderService, LogIcon, MenuDirective, NGX_DYNAMIC_CONFIG, NGX_IMAGE_CACHE_CONFIG, NGX_LAZY_LOADER_CONFIG, NGX_WEB_COMPONENTS_CONFIG, NavigationService, NgxDynamicHTMLModule, NgxImageCacheDirective, OnMount, ParallaxCardComponent, ReactMagicWrapperComponent, ResourceBypass, ScriptBypass, StyleBypass, TabulatorComponent, ThemeService, TooltipDirective, UrlBypass, VscodeComponent, openMenu, openTooltip };
|
|
11457
11589
|
//# sourceMappingURL=dotglitch-ngx-common.mjs.map
|