import { NgIf, NgClass, NgOptimizedImage } from '@angular/common';
import * as i0 from '@angular/core';
import { Component, Input } from '@angular/core';
import { LanguageEnum } from '@testlocallibrary/shared-kernel/models/enums';
import * as i1 from '@testlocallibrary/shared-kernel/services/language';
import { LanguageService } from '@testlocallibrary/shared-kernel/services/language';

class FlippingCardComponent {
    constructor(languageService) {
        this.languageService = languageService;
        this.ar = LanguageEnum.Ar;
        this.en = LanguageEnum.En;
        this.language = this.en;
        this.imgPath = '../../../assets/images/img/icon.png';
        this.imgAlt = '';
        this.title = '';
        this.subTitle = '';
        this.discription = '';
        this.isFlippingCard = false;
        this.language = this.languageService.getLanguage();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlippingCardComponent, deps: [{ token: i1.LanguageService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FlippingCardComponent, isStandalone: true, selector: "lib-flipping-card", inputs: { imgPath: "imgPath", imgAlt: "imgAlt", title: "title", subTitle: "subTitle", discription: "discription", isFlippingCard: "isFlippingCard" }, providers: [LanguageService], ngImport: i0, template: "<div class=\"flip-card\">\r\n  <div class=\"flip-card-inner\">\r\n    <div class=\"flip-card-front\">\r\n      <div class=\"img\">\r\n        <img\r\n          [src]=\"imgPath\"\r\n          [alt]=\"imgAlt\"\r\n          ngSrcset=\"100w, 200w, 300w\"\r\n          sizes=\"50vw\"\r\n          placeholder\r\n          priority\r\n          \r\n        />\r\n      </div>\r\n      <div class=\"title\">\r\n        <h3>{{ title }}</h3>\r\n      </div>\r\n      <ng-content select=\"[frontBtnLink]\"></ng-content>\r\n    </div>\r\n    <div class=\"flip-card-back\">\r\n      <div class=\"sub-title\">\r\n        <span>{{ subTitle }}</span>\r\n      </div>\r\n      <div class=\"content\">\r\n        <p *ngIf=\"discription !== ''\" [ngClass]=\"{'text-left' : language == en, 'text-right': language == ar}\">{{ discription }}</p>\r\n        <ng-content select=\"[discription]\"></ng-content>\r\n      </div>\r\n      <ng-content select=\"[backBtnLink]\"></ng-content>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".flip-card{background-color:transparent;padding:32px;height:226px;perspective:1000px;border-radius:10px;box-shadow:0 4px 6px -2px #0000000d,0 10px 15px -3px #0000001a;border:1px solid #cbd5e1}.flip-card:hover{border:1px solid #254596}.flip-card .flip-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d}.flip-card .flip-card-inner .flip-card-front{background:#fff;color:#000;text-align:left}.flip-card .flip-card-inner .flip-card-front .img{margin-bottom:16px;width:60px;height:60px}.flip-card .flip-card-inner .flip-card-front .img img{width:60px!important;height:60px}.flip-card .flip-card-inner .flip-card-front .title{margin-bottom:16px}.flip-card .flip-card-inner .flip-card-front .title h3{font-size:20px;font-style:normal;font-weight:600;text-align:start}.flip-card .flip-card-inner .flip-card-back{background-color:#fff;transform:rotateY(180deg);text-align:left}.flip-card .flip-card-inner .flip-card-back .sub-title span{color:#475569;font-size:16px;font-style:normal;font-weight:600}.flip-card .flip-card-inner .flip-card-back .content p{color:#475569;font-size:16px;font-style:normal;font-weight:400}.flip-card .flip-card-inner .flip-card-back .content .text-left{text-align:left}.flip-card .flip-card-inner .flip-card-back .content .text-right{text-align:right}.flip-card .flip-card-front,.flip-card .flip-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden}.flip-card:hover .flip-card-inner{transform:rotateY(180deg)}@media only screen and (max-width: 360px){.flip-card{width:290px;margin:auto;min-height:282px}}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FlippingCardComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lib-flipping-card', imports: [NgIf, NgClass, NgOptimizedImage], providers: [LanguageService], standalone: true, template: "<div class=\"flip-card\">\r\n  <div class=\"flip-card-inner\">\r\n    <div class=\"flip-card-front\">\r\n      <div class=\"img\">\r\n        <img\r\n          [src]=\"imgPath\"\r\n          [alt]=\"imgAlt\"\r\n          ngSrcset=\"100w, 200w, 300w\"\r\n          sizes=\"50vw\"\r\n          placeholder\r\n          priority\r\n          \r\n        />\r\n      </div>\r\n      <div class=\"title\">\r\n        <h3>{{ title }}</h3>\r\n      </div>\r\n      <ng-content select=\"[frontBtnLink]\"></ng-content>\r\n    </div>\r\n    <div class=\"flip-card-back\">\r\n      <div class=\"sub-title\">\r\n        <span>{{ subTitle }}</span>\r\n      </div>\r\n      <div class=\"content\">\r\n        <p *ngIf=\"discription !== ''\" [ngClass]=\"{'text-left' : language == en, 'text-right': language == ar}\">{{ discription }}</p>\r\n        <ng-content select=\"[discription]\"></ng-content>\r\n      </div>\r\n      <ng-content select=\"[backBtnLink]\"></ng-content>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".flip-card{background-color:transparent;padding:32px;height:226px;perspective:1000px;border-radius:10px;box-shadow:0 4px 6px -2px #0000000d,0 10px 15px -3px #0000001a;border:1px solid #cbd5e1}.flip-card:hover{border:1px solid #254596}.flip-card .flip-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d}.flip-card .flip-card-inner .flip-card-front{background:#fff;color:#000;text-align:left}.flip-card .flip-card-inner .flip-card-front .img{margin-bottom:16px;width:60px;height:60px}.flip-card .flip-card-inner .flip-card-front .img img{width:60px!important;height:60px}.flip-card .flip-card-inner .flip-card-front .title{margin-bottom:16px}.flip-card .flip-card-inner .flip-card-front .title h3{font-size:20px;font-style:normal;font-weight:600;text-align:start}.flip-card .flip-card-inner .flip-card-back{background-color:#fff;transform:rotateY(180deg);text-align:left}.flip-card .flip-card-inner .flip-card-back .sub-title span{color:#475569;font-size:16px;font-style:normal;font-weight:600}.flip-card .flip-card-inner .flip-card-back .content p{color:#475569;font-size:16px;font-style:normal;font-weight:400}.flip-card .flip-card-inner .flip-card-back .content .text-left{text-align:left}.flip-card .flip-card-inner .flip-card-back .content .text-right{text-align:right}.flip-card .flip-card-front,.flip-card .flip-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden}.flip-card:hover .flip-card-inner{transform:rotateY(180deg)}@media only screen and (max-width: 360px){.flip-card{width:290px;margin:auto;min-height:282px}}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.LanguageService }]; }, propDecorators: { imgPath: [{
                type: Input
            }], imgAlt: [{
                type: Input
            }], title: [{
                type: Input
            }], subTitle: [{
                type: Input
            }], discription: [{
                type: Input
            }], isFlippingCard: [{
                type: Input
            }] } });

/**
 * Generated bundle index. Do not edit.
 */

export { FlippingCardComponent };
//# sourceMappingURL=testlocallibrary-shared-kernel-components-flipping-card.mjs.map
