UNPKG

ngx-gooey

Version:

<p align="center"> <img alt="Preview" src="docs/assets/preview.gif" height="260" width="260"> </p> <p align="center"> <h1 align="center">The gooey effect for Angular</h1> </p> The 'gooey effect' has been made popular by various (amazing) blogposts over

1 lines 4.58 kB
{"version":3,"file":"ngx-gooey.mjs","sources":["../../src/lib/ngx-gooey.component.ts","../../src/public-api.ts","../../src/ngx-gooey.ts"],"sourcesContent":["import { Component, Input } from '@angular/core';\n\nimport { CommonModule } from '@angular/common';\n\n@Component({\n selector: 'ngx-gooey',\n imports: [CommonModule],\n template: `\n <svg data-testid=\"svg\" style=\"pointer-events: none; position: absolute;\">\n <defs>\n <filter\n colorInterpolationFilters=\"sRGB\"\n data-testid=\"filter\"\n [attr.id]=\"id\"\n >\n <feGaussianBlur\n data-testid=\"blur\"\n [attr.stdDeviation]=\"blur\"\n ></feGaussianBlur>\n <feColorMatrix [attr.values]=\"colorMatrixValues\"></feColorMatrix>\n <feComposite\n *ngIf=\"composite\"\n data-testid=\"composite\"\n in=\"SourceGraphic\"\n ></feComposite>\n </filter>\n </defs>\n </svg>\n <div [ngClass]=\"className\" data-testid=\"element\" [ngStyle]=\"getStyle()\">\n <ng-content></ng-content>\n </div>\n `\n})\nexport class Gooey {\n @Input() children: any;\n @Input() className?: string;\n @Input() composite?: boolean = false;\n @Input() intensity: 'weak' | 'medium' | 'strong' = 'medium';\n @Input() id: string = 'gooey-angular';\n @Input() style?: { [key: string]: string };\n\n get blur(): number {\n return this.intensity === 'weak'\n ? 8\n : this.intensity === 'strong'\n ? 16\n : 12;\n }\n\n get alpha(): number {\n return this.blur * 6;\n }\n\n get shift(): number {\n return this.alpha / -2;\n }\n\n get r(): string {\n return '1 0 0 0 0';\n }\n\n get g(): string {\n return '0 1 0 0 0';\n }\n\n get b(): string {\n return '0 0 1 0 0';\n }\n\n get a(): string {\n return `0 0 0 ${this.alpha} ${this.shift}`;\n }\n\n get colorMatrixValues(): string {\n return `${this.r} ${this.g} ${this.b} ${this.a}`;\n }\n\n getStyle(): { [key: string]: string } {\n return {\n ...(this.style || {}),\n filter: 'url(#' + this.id + ')',\n };\n }\n}\n","/*\n * Public API Surface of ngx-gooey\n */\n\nexport * from './lib/ngx-gooey.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}