import { Component } from '@angular/core';
import { MatDialogRef } from '@angular/material/dialog';
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/dialog";
import * as i2 from "@angular/forms";
import * as i3 from "@angular/common";
function AppCreateDialogComponentComponent_span_12_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 12);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate(ctx_r0.errMessage.name);
} }
const _c0 = function (a0) { return { "invalid-input": a0 }; };
export class AppCreateDialogComponentComponent {
    constructor(dialogRef) {
        this.dialogRef = dialogRef;
        this.name = '';
        this.description = '';
        this.errMessage = { name: '' };
        this.showErrMessge = { name: false };
    }
    onCancel() {
        this.dialogRef.close();
    }
    onSubmit() {
        if (this.name.trim()) {
            this.dialogRef.close({ name: this.name, description: this.description });
        }
        else {
            this.onBlur();
            // Optional: Display an error message if name is empty
        }
    }
    onBlur() {
        this.showErrMessge.name = true;
        this.onInput();
    }
    onInput() {
        this.name.trim() ? this.errMessage.name = "" : this.errMessage.name = "App name should not be empty";
    }
}
AppCreateDialogComponentComponent.ɵfac = function AppCreateDialogComponentComponent_Factory(t) { return new (t || AppCreateDialogComponentComponent)(i0.ɵɵdirectiveInject(i1.MatDialogRef)); };
AppCreateDialogComponentComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AppCreateDialogComponentComponent, selectors: [["app-app-create-dialog-component"]], decls: 22, vars: 6, consts: [[1, "popup-container", "create-app-popup"], [1, "close-icon", 3, "click"], [1, "flex", "flex-col", "gap-2"], ["for", "app-name"], ["type", "text", "id", "app-name", "required", "", 1, "", 3, "ngModel", "ngClass", "ngModelChange", "blur", "input"], [1, "err-message-container"], ["class", "error-message", 4, "ngIf"], ["for", "app-desc"], ["id", "app-desc", "placeholder", "Please provide a detailed description of your app so that our AI can assist you in building your apps faster.", "rows", "5", 1, "", 3, "ngModel", "ngModelChange"], [1, "action-btn-container"], [1, "stroke-btn", 3, "click"], [1, "fill-btn", 3, "click"], [1, "error-message"]], template: function AppCreateDialogComponentComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵelementStart(0, "div", 0);
        i0.ɵɵelementStart(1, "button", 1);
        i0.ɵɵlistener("click", function AppCreateDialogComponentComponent_Template_button_click_1_listener() { return ctx.onCancel(); });
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(2, "h1");
        i0.ɵɵtext(3, "Create a New App");
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(4, "div", 2);
        i0.ɵɵelementStart(5, "div");
        i0.ɵɵelementStart(6, "label", 3);
        i0.ɵɵtext(7, "App Name");
        i0.ɵɵelementStart(8, "sup");
        i0.ɵɵtext(9, "*");
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(10, "input", 4);
        i0.ɵɵlistener("ngModelChange", function AppCreateDialogComponentComponent_Template_input_ngModelChange_10_listener($event) { return ctx.name = $event; })("blur", function AppCreateDialogComponentComponent_Template_input_blur_10_listener() { return ctx.onBlur(); })("input", function AppCreateDialogComponentComponent_Template_input_input_10_listener() { return ctx.onInput(); });
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(11, "div", 5);
        i0.ɵɵtemplate(12, AppCreateDialogComponentComponent_span_12_Template, 2, 1, "span", 6);
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(13, "div");
        i0.ɵɵelementStart(14, "label", 7);
        i0.ɵɵtext(15, "Description");
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(16, "textarea", 8);
        i0.ɵɵlistener("ngModelChange", function AppCreateDialogComponentComponent_Template_textarea_ngModelChange_16_listener($event) { return ctx.description = $event; });
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(17, "div", 9);
        i0.ɵɵelementStart(18, "button", 10);
        i0.ɵɵlistener("click", function AppCreateDialogComponentComponent_Template_button_click_18_listener() { return ctx.onCancel(); });
        i0.ɵɵtext(19, "Cancel");
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(20, "button", 11);
        i0.ɵɵlistener("click", function AppCreateDialogComponentComponent_Template_button_click_20_listener() { return ctx.onSubmit(); });
        i0.ɵɵtext(21, "Create");
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
    } if (rf & 2) {
        i0.ɵɵadvance(10);
        i0.ɵɵproperty("ngModel", ctx.name)("ngClass", i0.ɵɵpureFunction1(4, _c0, ctx.showErrMessge.name && ctx.errMessage.name));
        i0.ɵɵadvance(2);
        i0.ɵɵproperty("ngIf", ctx.showErrMessge.name && ctx.errMessage.name);
        i0.ɵɵadvance(4);
        i0.ɵɵproperty("ngModel", ctx.description);
    } }, directives: [i2.DefaultValueAccessor, i2.RequiredValidator, i2.NgControlStatus, i2.NgModel, i3.NgClass, i3.NgIf], styles: [".create-app-popup[_ngcontent-%COMP%]{min-width:30vw}", ".popup-container[_ngcontent-%COMP%]{min-width:20vw;min-height:fit-content;width:fit-content;height:fit-content;max-width:75vw;max-height:75vh;font-family:Inter var,Roboto;font-size:.875rem;position:relative}.popup-container[_ngcontent-%COMP%]   .popup-body[_ngcontent-%COMP%]{max-height:70vh;overflow:auto}.popup-container[_ngcontent-%COMP%]   h1[_ngcontent-%COMP%]{font-family:Inter var,Roboto!important;color:#1b2b4b;font-size:1.125rem;font-weight:500;line-height:28px;margin:0 0 1rem;text-transform:capitalize;width:fit-content}.popup-container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:#475467;font-weight:400;margin:0;line-height:20px}.popup-container[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]:not(.mat-slide-toggle-label){display:block;color:#1b2b4b;font-weight:500;margin:0 0 .2rem}.popup-container[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]:not(.mat-slide-toggle-label)   sup[_ngcontent-%COMP%]{color:#dc2626}.popup-container[_ngcontent-%COMP%]   .close-icon[_ngcontent-%COMP%]{height:24px;width:24px;background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M18 6L6 18M6 6L18 18%22 stroke%3D%22%23667085%22 stroke-width%3D%222%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");background-position:center;background-size:100%;position:absolute;top:0;right:0;cursor:pointer}.popup-container[_ngcontent-%COMP%]   .action-btn-container[_ngcontent-%COMP%]{display:flex;justify-content:right;gap:.5rem;margin:1.5rem 0 0}.popup-container[_ngcontent-%COMP%]   input[type=text][_ngcontent-%COMP%], .popup-container[_ngcontent-%COMP%]   input[type=number][_ngcontent-%COMP%], .popup-container[_ngcontent-%COMP%]   input[type=email][_ngcontent-%COMP%], .popup-container[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{display:block;border:1px solid #D0D5DD;border-radius:.375rem;width:100%;padding:.5rem 1rem;color:#1b2b4b;resize:none}.popup-container[_ngcontent-%COMP%]   input[type=text][_ngcontent-%COMP%]::placeholder, .popup-container[_ngcontent-%COMP%]   input[type=number][_ngcontent-%COMP%]::placeholder, .popup-container[_ngcontent-%COMP%]   input[type=email][_ngcontent-%COMP%]::placeholder, .popup-container[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]::placeholder{color:#a5a5a5}.popup-container[_ngcontent-%COMP%]   input[type=text][_ngcontent-%COMP%]:focus, .popup-container[_ngcontent-%COMP%]   input[type=number][_ngcontent-%COMP%]:focus, .popup-container[_ngcontent-%COMP%]   input[type=email][_ngcontent-%COMP%]:focus, .popup-container[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]:focus{border:1px solid #6C52ED}.popup-container[_ngcontent-%COMP%]   .err-message-container[_ngcontent-%COMP%]{height:14px;line-height:12px;width:100%;margin-top:2px}.popup-container[_ngcontent-%COMP%]   .err-message-container[_ngcontent-%COMP%]   .error-message[_ngcontent-%COMP%]{color:#dc2626;font-size:12px;float:right}.popup-container[_ngcontent-%COMP%]   .invalid-input[_ngcontent-%COMP%]{border:1px solid #DC2626!important}.popup-container[_ngcontent-%COMP%]   .checkbox-container[_ngcontent-%COMP%]{display:flex;justify-content:start;align-items:center}.popup-container[_ngcontent-%COMP%]   .checkbox-container[_ngcontent-%COMP%]   input[type=checkbox][_ngcontent-%COMP%]{width:fit-content;margin:0 .5rem 0 0}.stroke-btn[_ngcontent-%COMP%]{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;background-color:#fff;border:1px solid #D0D5DD;color:#344054}.stroke-btn[_ngcontent-%COMP%]:hover{background-color:#eff6ff}.fill-btn[_ngcontent-%COMP%]{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;border:1px solid transparent;background-image:linear-gradient(to right,#4E4AEA,#3C88FC);color:#fff}.fill-btn[_ngcontent-%COMP%]:hover{opacity:.7}.publish-btn[_ngcontent-%COMP%]{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;border:none;background-color:#e19965;color:#fff}.publish-btn[_ngcontent-%COMP%]:hover{opacity:.7}.delete-btn[_ngcontent-%COMP%]{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;background-color:#fff;border:1px solid #D0D5DD;color:#dc2626}.delete-btn[_ngcontent-%COMP%]:hover{background-color:#eff6ff}"] });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AppCreateDialogComponentComponent, [{
        type: Component,
        args: [{ selector: 'app-app-create-dialog-component', template: "<div class=\"popup-container create-app-popup\">\n   <button class=\"close-icon\" (click)=\"onCancel()\"></button>\n  <h1>Create a New App</h1>\n  <div class=\"flex flex-col gap-2\">\n    <div>\n      <label for=\"app-name\">App Name<sup>*</sup></label>\n      <input type=\"text\" [(ngModel)]=\"name\" id=\"app-name\" class=\"\" (blur)=\"onBlur()\" (input)=\"onInput()\" [ngClass]=\"{'invalid-input': showErrMessge.name && errMessage.name}\" required />\n      <div class=\"err-message-container\"><span *ngIf=\"showErrMessge.name && errMessage.name\" class=\"error-message\">{{ errMessage.name }}</span></div>\n    </div>\n    <div>\n      <label for=\"app-desc\">Description</label>\n      <textarea [(ngModel)]=\"description\" id=\"app-desc\" placeholder=\"Please provide a detailed description of your app so that our AI can assist you in building your apps faster.\" class=\"\" rows=\"5\"></textarea>\n    </div>\n  </div>\n  <div class=\"action-btn-container\">\n    <button (click)=\"onCancel()\" class=\"stroke-btn\">Cancel</button>\n    <button (click)=\"onSubmit()\"  class=\"fill-btn\">Create</button>\n  </div>\n</div>", styles: [".create-app-popup{min-width:30vw}\n", ".popup-container{min-width:20vw;min-height:fit-content;width:fit-content;height:fit-content;max-width:75vw;max-height:75vh;font-family:Inter var,Roboto;font-size:.875rem;position:relative}.popup-container .popup-body{max-height:70vh;overflow:auto}.popup-container h1{font-family:Inter var,Roboto!important;color:#1b2b4b;font-size:1.125rem;font-weight:500;line-height:28px;margin:0 0 1rem;text-transform:capitalize;width:fit-content}.popup-container p{color:#475467;font-weight:400;margin:0;line-height:20px}.popup-container label:not(.mat-slide-toggle-label){display:block;color:#1b2b4b;font-weight:500;margin:0 0 .2rem}.popup-container label:not(.mat-slide-toggle-label) sup{color:#dc2626}.popup-container .close-icon{height:24px;width:24px;background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M18 6L6 18M6 6L18 18%22 stroke%3D%22%23667085%22 stroke-width%3D%222%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");background-position:center;background-size:100%;position:absolute;top:0;right:0;cursor:pointer}.popup-container .action-btn-container{display:flex;justify-content:right;gap:.5rem;margin:1.5rem 0 0}.popup-container input[type=text],.popup-container input[type=number],.popup-container input[type=email],.popup-container textarea{display:block;border:1px solid #D0D5DD;border-radius:.375rem;width:100%;padding:.5rem 1rem;color:#1b2b4b;resize:none}.popup-container input[type=text]::placeholder,.popup-container input[type=number]::placeholder,.popup-container input[type=email]::placeholder,.popup-container textarea::placeholder{color:#a5a5a5}.popup-container input[type=text]:focus,.popup-container input[type=number]:focus,.popup-container input[type=email]:focus,.popup-container textarea:focus{border:1px solid #6C52ED}.popup-container .err-message-container{height:14px;line-height:12px;width:100%;margin-top:2px}.popup-container .err-message-container .error-message{color:#dc2626;font-size:12px;float:right}.popup-container .invalid-input{border:1px solid #DC2626!important}.popup-container .checkbox-container{display:flex;justify-content:start;align-items:center}.popup-container .checkbox-container input[type=checkbox]{width:fit-content;margin:0 .5rem 0 0}.stroke-btn{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;background-color:#fff;border:1px solid #D0D5DD;color:#344054}.stroke-btn:hover{background-color:#eff6ff}.fill-btn{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;border:1px solid transparent;background-image:linear-gradient(to right,#4E4AEA,#3C88FC);color:#fff}.fill-btn:hover{opacity:.7}.publish-btn{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;border:none;background-color:#e19965;color:#fff}.publish-btn:hover{opacity:.7}.delete-btn{box-sizing:border-box;padding:.5rem 1rem;border-radius:.5rem;font-size:1rem;font-weight:500;width:fit-content;text-transform:capitalize;background-color:#fff;border:1px solid #D0D5DD;color:#dc2626}.delete-btn:hover{background-color:#eff6ff}\n"] }]
    }], function () { return [{ type: i1.MatDialogRef }]; }, null); })();
//# sourceMappingURL=data:application/json;base64, 