@yoursabhishekabhi7/modal-popup-ng-all/esm2022/lib/boot-starp-components/boot-strap-offcanvas/boot-strap-offcanvas.component.mjs

Reusable Angular modal popup components supporting Angular 14 to 18

import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
export class BootStrapOffcanvasComponent {
    TitleText = '';
    TimeStamp = '';
    constructor() { }
    ngOnInit() {
    }
    get OpenModel() {
        $('#customoffcanvas').removeClass('hide');
        return $('#customoffcanvas').addClass('show');
    }
    get hideModel() {
        $('#customoffcanvas').removeClass('show');
        return $('#customoffcanvas').addClass('hide');
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BootStrapOffcanvasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: BootStrapOffcanvasComponent, selector: "boot-strap-offcanvas", inputs: { TitleText: "TitleText", TimeStamp: "TimeStamp" }, ngImport: i0, template: "<div class=\"custom-offcanvas\" id=\"customoffcanvas\">\r\n    <button type=\"button\" class=\"btn-close text-reset\" aria-label=\"Close\" (click)=\"this.hideModel\"></button>\r\n    <div class=\"offcanvas-body\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [".custom-offcanvas{position:fixed;background:#0000;width:100vw;top:0;right:0;height:100vh;box-shadow:-6px 2px 12px 2px #f4f4f4;z-index:9999;display:none;transform:translate3d(-46px,0,0);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.btn-close{position:absolute;right:5px;top:5px}.offcanvas-body{background:#fff;width:380px;margin:0 0 auto auto;height:100vh}.custom-offcanvas.show{display:block;transform:translateZ(0)}.custom-offcanvas.hide{display:none}\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: BootStrapOffcanvasComponent, decorators: [{
            type: Component,
            args: [{ selector: 'boot-strap-offcanvas', template: "<div class=\"custom-offcanvas\" id=\"customoffcanvas\">\r\n    <button type=\"button\" class=\"btn-close text-reset\" aria-label=\"Close\" (click)=\"this.hideModel\"></button>\r\n    <div class=\"offcanvas-body\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [".custom-offcanvas{position:fixed;background:#0000;width:100vw;top:0;right:0;height:100vh;box-shadow:-6px 2px 12px 2px #f4f4f4;z-index:9999;display:none;transform:translate3d(-46px,0,0);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.btn-close{position:absolute;right:5px;top:5px}.offcanvas-body{background:#fff;width:380px;margin:0 0 auto auto;height:100vh}.custom-offcanvas.show{display:block;transform:translateZ(0)}.custom-offcanvas.hide{display:none}\n"] }]
        }], ctorParameters: () => [], propDecorators: { TitleText: [{
                type: Input,
                args: ["TitleText"]
            }], TimeStamp: [{
                type: Input,
                args: ["TimeStamp"]
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9vdC1zdHJhcC1vZmZjYW52YXMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbW9kYWwtcG9wdXAtbmcxNC0xOC9zcmMvbGliL2Jvb3Qtc3RhcnAtY29tcG9uZW50cy9ib290LXN0cmFwLW9mZmNhbnZhcy9ib290LXN0cmFwLW9mZmNhbnZhcy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tb2RhbC1wb3B1cC1uZzE0LTE4L3NyYy9saWIvYm9vdC1zdGFycC1jb21wb25lbnRzL2Jvb3Qtc3RyYXAtb2ZmY2FudmFzL2Jvb3Qtc3RyYXAtb2ZmY2FudmFzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOztBQU96RCxNQUFNLE9BQU8sMkJBQTJCO0lBQ2xCLFNBQVMsR0FBVSxFQUFFLENBQUE7SUFDckIsU0FBUyxHQUFVLEVBQUUsQ0FBQTtJQUN6QyxnQkFBZ0IsQ0FBQztJQUVqQixRQUFRO0lBQ1IsQ0FBQztJQUVELElBQUksU0FBUztRQUNYLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsQ0FBQTtRQUN6QyxPQUFPLENBQUMsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUNoRCxDQUFDO0lBRUQsSUFBSSxTQUFTO1FBQ1gsQ0FBQyxDQUFDLGtCQUFrQixDQUFDLENBQUMsV0FBVyxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQzFDLE9BQU8sQ0FBQyxDQUFDLGtCQUFrQixDQUFDLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxDQUFBO0lBQy9DLENBQUM7dUdBaEJVLDJCQUEyQjsyRkFBM0IsMkJBQTJCLHdIQ1B4Qyx3UkFNQTs7MkZEQ2EsMkJBQTJCO2tCQUx2QyxTQUFTOytCQUNFLHNCQUFzQjt3REFLWixTQUFTO3NCQUE1QixLQUFLO3VCQUFDLFdBQVc7Z0JBQ0UsU0FBUztzQkFBNUIsS0FBSzt1QkFBQyxXQUFXIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2Jvb3Qtc3RyYXAtb2ZmY2FudmFzJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vYm9vdC1zdHJhcC1vZmZjYW52YXMuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL2Jvb3Qtc3RyYXAtb2ZmY2FudmFzLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIEJvb3RTdHJhcE9mZmNhbnZhc0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgQElucHV0KFwiVGl0bGVUZXh0XCIpIFRpdGxlVGV4dDogc3RyaW5nID0nJ1xyXG4gIEBJbnB1dChcIlRpbWVTdGFtcFwiKSBUaW1lU3RhbXA6IHN0cmluZyA9JydcclxuICBjb25zdHJ1Y3RvcigpIHsgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICB9XHJcblxyXG4gIGdldCBPcGVuTW9kZWwoKSB7XHJcbiAgICAkKCcjY3VzdG9tb2ZmY2FudmFzJykucmVtb3ZlQ2xhc3MoJ2hpZGUnKVxyXG4gICAgcmV0dXJuICQoJyNjdXN0b21vZmZjYW52YXMnKS5hZGRDbGFzcygnc2hvdycpO1xyXG4gIH1cclxuXHJcbiAgZ2V0IGhpZGVNb2RlbCgpIHtcclxuICAgICQoJyNjdXN0b21vZmZjYW52YXMnKS5yZW1vdmVDbGFzcygnc2hvdycpO1xyXG4gICAgcmV0dXJuICQoJyNjdXN0b21vZmZjYW52YXMnKS5hZGRDbGFzcygnaGlkZScpXHJcbiAgfVxyXG5cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwiY3VzdG9tLW9mZmNhbnZhc1wiIGlkPVwiY3VzdG9tb2ZmY2FudmFzXCI+XHJcbiAgICA8YnV0dG9uIHR5cGU9XCJidXR0b25cIiBjbGFzcz1cImJ0bi1jbG9zZSB0ZXh0LXJlc2V0XCIgYXJpYS1sYWJlbD1cIkNsb3NlXCIgKGNsaWNrKT1cInRoaXMuaGlkZU1vZGVsXCI+PC9idXR0b24+XHJcbiAgICA8ZGl2IGNsYXNzPVwib2ZmY2FudmFzLWJvZHlcIj5cclxuICAgICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+XHJcbiJdfQ==