import { Component, EventEmitter, Input, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "../../services/prompt-manager.service";
import * as i2 from "@angular/common";
import * as i3 from "@angular/forms";
function PromptEditorComponent_div_20_button_4_Template(rf, ctx) { if (rf & 1) {
    const _r2 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "button", 43);
    i0.ɵɵlistener("click", function PromptEditorComponent_div_20_button_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r2); const i_r3 = i0.ɵɵnextContext().index; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.removeProperty(i_r3)); });
    i0.ɵɵelement(1, "i", 44);
    i0.ɵɵelementEnd();
} }
function PromptEditorComponent_div_20_option_20_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "option", 45);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const type_r6 = ctx.$implicit;
    i0.ɵɵproperty("value", type_r6.value);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate1(" ", type_r6.label, " ");
} }
function PromptEditorComponent_div_20_div_26_Template(rf, ctx) { if (rf & 1) {
    const _r7 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 25)(1, "div", 46)(2, "label");
    i0.ɵɵtext(3, "Min");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(4, "input", 47);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_div_26_Template_input_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r7); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.min, $event) || (property_r5.min = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd()();
    i0.ɵɵelementStart(5, "div", 46)(6, "label");
    i0.ɵɵtext(7, "Max");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(8, "input", 47);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_div_26_Template_input_ngModelChange_8_listener($event) { i0.ɵɵrestoreView(_r7); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.max, $event) || (property_r5.max = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd()();
    i0.ɵɵelementStart(9, "div", 46)(10, "label");
    i0.ɵɵtext(11, "Step");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(12, "input", 47);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_div_26_Template_input_ngModelChange_12_listener($event) { i0.ɵɵrestoreView(_r7); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.step, $event) || (property_r5.step = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd()()();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(4);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.min);
    i0.ɵɵadvance(4);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.max);
    i0.ɵɵadvance(4);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.step);
} }
function PromptEditorComponent_div_20_div_27_Template(rf, ctx) { if (rf & 1) {
    const _r8 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 26)(1, "label");
    i0.ɵɵtext(2, "Rows");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "input", 48);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_div_27_Template_input_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r8); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.rows, $event) || (property_r5.rows = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(3);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.rows);
} }
function PromptEditorComponent_div_20_div_28_div_4_Template(rf, ctx) { if (rf & 1) {
    const _r10 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 53)(1, "input", 54);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_div_28_div_4_Template_input_ngModelChange_1_listener($event) { const option_r11 = i0.ɵɵrestoreView(_r10).$implicit; i0.ɵɵtwoWayBindingSet(option_r11.value, $event) || (option_r11.value = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(2, "input", 55);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_div_28_div_4_Template_input_ngModelChange_2_listener($event) { const option_r11 = i0.ɵɵrestoreView(_r10).$implicit; i0.ɵɵtwoWayBindingSet(option_r11.label, $event) || (option_r11.label = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "button", 56);
    i0.ɵɵlistener("click", function PromptEditorComponent_div_20_div_28_div_4_Template_button_click_3_listener() { const j_r12 = i0.ɵɵrestoreView(_r10).index; const property_r5 = i0.ɵɵnextContext(2).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.removeSelectOption(property_r5, j_r12)); });
    i0.ɵɵelement(4, "i", 5);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const option_r11 = ctx.$implicit;
    i0.ɵɵadvance();
    i0.ɵɵtwoWayProperty("ngModel", option_r11.value);
    i0.ɵɵadvance();
    i0.ɵɵtwoWayProperty("ngModel", option_r11.label);
} }
function PromptEditorComponent_div_20_div_28_Template(rf, ctx) { if (rf & 1) {
    const _r9 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 49)(1, "label");
    i0.ɵɵtext(2, "Options");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div", 50);
    i0.ɵɵtemplate(4, PromptEditorComponent_div_20_div_28_div_4_Template, 5, 2, "div", 51);
    i0.ɵɵelementStart(5, "button", 52);
    i0.ɵɵlistener("click", function PromptEditorComponent_div_20_div_28_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r9); const property_r5 = i0.ɵɵnextContext().$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.addSelectOption(property_r5)); });
    i0.ɵɵelement(6, "i", 13);
    i0.ɵɵtext(7, " Add Option ");
    i0.ɵɵelementEnd()()();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(4);
    i0.ɵɵproperty("ngForOf", property_r5.options);
} }
function PromptEditorComponent_div_20_input_33_Template(rf, ctx) { if (rf & 1) {
    const _r13 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "input", 57);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_input_33_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r13); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.defaultValue, $event) || (property_r5.defaultValue = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵtwoWayProperty("ngModel", property_r5.defaultValue);
} }
function PromptEditorComponent_div_20_input_34_Template(rf, ctx) { if (rf & 1) {
    const _r14 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "input", 47);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_input_34_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r14); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.defaultValue, $event) || (property_r5.defaultValue = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵtwoWayProperty("ngModel", property_r5.defaultValue);
} }
function PromptEditorComponent_div_20_textarea_35_Template(rf, ctx) { if (rf & 1) {
    const _r15 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "textarea", 58);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_textarea_35_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r15); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.defaultValue, $event) || (property_r5.defaultValue = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵtext(1, "                ");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵtwoWayProperty("ngModel", property_r5.defaultValue);
    i0.ɵɵproperty("rows", 2);
} }
function PromptEditorComponent_div_20_textarea_36_Template(rf, ctx) { if (rf & 1) {
    const _r16 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "textarea", 59);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_textarea_36_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r16); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.defaultValue, $event) || (property_r5.defaultValue = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵtext(1, "                ");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵtwoWayProperty("ngModel", property_r5.defaultValue);
    i0.ɵɵproperty("rows", 2);
} }
function PromptEditorComponent_div_20_select_37_option_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "option", 45);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const opt_r18 = ctx.$implicit;
    i0.ɵɵproperty("value", opt_r18.value);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate1(" ", opt_r18.label, " ");
} }
function PromptEditorComponent_div_20_select_37_Template(rf, ctx) { if (rf & 1) {
    const _r17 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "select", 60);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_select_37_Template_select_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r17); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.defaultValue, $event) || (property_r5.defaultValue = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵtemplate(1, PromptEditorComponent_div_20_select_37_option_1_Template, 2, 2, "option", 30);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵtwoWayProperty("ngModel", property_r5.defaultValue);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngForOf", property_r5.options);
} }
function PromptEditorComponent_div_20_label_38_Template(rf, ctx) { if (rf & 1) {
    const _r19 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "label", 61)(1, "input", 62);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_label_38_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r19); const property_r5 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(property_r5.defaultValue, $event) || (property_r5.defaultValue = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd();
    i0.ɵɵtext(2, " Default checked ");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const property_r5 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance();
    i0.ɵɵtwoWayProperty("ngModel", property_r5.defaultValue);
} }
function PromptEditorComponent_div_20_Template(rf, ctx) { if (rf & 1) {
    const _r1 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 20)(1, "div", 21)(2, "span", 22);
    i0.ɵɵtext(3);
    i0.ɵɵelementEnd();
    i0.ɵɵtemplate(4, PromptEditorComponent_div_20_button_4_Template, 2, 0, "button", 23);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(5, "div", 24)(6, "div", 25)(7, "div", 26)(8, "label");
    i0.ɵɵtext(9, "Property Key");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(10, "input", 27);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_Template_input_ngModelChange_10_listener($event) { const property_r5 = i0.ɵɵrestoreView(_r1).$implicit; i0.ɵɵtwoWayBindingSet(property_r5.key, $event) || (property_r5.key = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵlistener("input", function PromptEditorComponent_div_20_Template_input_input_10_listener($event) { const property_r5 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.sanitizeKey($event, property_r5)); });
    i0.ɵɵelementEnd()();
    i0.ɵɵelementStart(11, "div", 26)(12, "label");
    i0.ɵɵtext(13, "Display Label");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(14, "input", 28);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_Template_input_ngModelChange_14_listener($event) { const property_r5 = i0.ɵɵrestoreView(_r1).$implicit; i0.ɵɵtwoWayBindingSet(property_r5.label, $event) || (property_r5.label = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd()()();
    i0.ɵɵelementStart(15, "div", 25)(16, "div", 26)(17, "label");
    i0.ɵɵtext(18, "Type");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(19, "select", 29);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_Template_select_ngModelChange_19_listener($event) { const property_r5 = i0.ɵɵrestoreView(_r1).$implicit; i0.ɵɵtwoWayBindingSet(property_r5.type, $event) || (property_r5.type = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵlistener("change", function PromptEditorComponent_div_20_Template_select_change_19_listener() { const property_r5 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.updatePropertyType(property_r5)); });
    i0.ɵɵtemplate(20, PromptEditorComponent_div_20_option_20_Template, 2, 2, "option", 30);
    i0.ɵɵelementEnd()();
    i0.ɵɵelementStart(21, "div", 26)(22, "label");
    i0.ɵɵtext(23, "Placeholder");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(24, "input", 31);
    i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_div_20_Template_input_ngModelChange_24_listener($event) { const property_r5 = i0.ɵɵrestoreView(_r1).$implicit; i0.ɵɵtwoWayBindingSet(property_r5.placeholder, $event) || (property_r5.placeholder = $event); return i0.ɵɵresetView($event); });
    i0.ɵɵelementEnd()()();
    i0.ɵɵelementStart(25, "div", 32);
    i0.ɵɵtemplate(26, PromptEditorComponent_div_20_div_26_Template, 13, 3, "div", 33)(27, PromptEditorComponent_div_20_div_27_Template, 4, 1, "div", 34)(28, PromptEditorComponent_div_20_div_28_Template, 8, 1, "div", 35);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(29, "div", 26)(30, "label");
    i0.ɵɵtext(31, "Default Value");
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(32, "div", 36);
    i0.ɵɵtemplate(33, PromptEditorComponent_div_20_input_33_Template, 1, 1, "input", 37)(34, PromptEditorComponent_div_20_input_34_Template, 1, 1, "input", 38)(35, PromptEditorComponent_div_20_textarea_35_Template, 2, 2, "textarea", 39)(36, PromptEditorComponent_div_20_textarea_36_Template, 2, 2, "textarea", 40)(37, PromptEditorComponent_div_20_select_37_Template, 2, 2, "select", 41)(38, PromptEditorComponent_div_20_label_38_Template, 3, 1, "label", 42);
    i0.ɵɵelementEnd()()()();
} if (rf & 2) {
    const property_r5 = ctx.$implicit;
    const i_r3 = ctx.index;
    const ctx_r3 = i0.ɵɵnextContext();
    i0.ɵɵadvance(3);
    i0.ɵɵtextInterpolate(i_r3 + 1);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r3.properties.length > 1);
    i0.ɵɵadvance(6);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.key);
    i0.ɵɵadvance(4);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.label);
    i0.ɵɵadvance(5);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.type);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngForOf", ctx_r3.propertyTypes);
    i0.ɵɵadvance(4);
    i0.ɵɵtwoWayProperty("ngModel", property_r5.placeholder);
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngIf", property_r5.type === "number");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", property_r5.type === "textarea" || property_r5.type === "json");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", property_r5.type === "select");
    i0.ɵɵadvance(4);
    i0.ɵɵproperty("ngSwitch", property_r5.type);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngSwitchCase", "text");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngSwitchCase", "number");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngSwitchCase", "textarea");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngSwitchCase", "json");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngSwitchCase", "select");
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngSwitchCase", "checkbox");
} }
export class PromptEditorComponent {
    constructor(promptManager) {
        this.promptManager = promptManager;
        this.isNew = false;
        this.save = new EventEmitter();
        this.cancel = new EventEmitter();
        this.promptName = '';
        this.properties = [];
        // Available property types
        this.propertyTypes = [
            { value: 'text', label: 'Text Input' },
            { value: 'textarea', label: 'Text Area' },
            { value: 'number', label: 'Number' },
            { value: 'select', label: 'Dropdown' },
            { value: 'checkbox', label: 'Checkbox' },
            { value: 'json', label: 'JSON' }
        ];
    }
    ngOnInit() {
        if (this.promptId && !this.isNew) {
            // Load existing prompt
            const prompt = this.promptManager.getPrompt(this.promptId);
            if (prompt) {
                this.promptName = prompt.name;
                this.properties = JSON.parse(JSON.stringify(prompt.properties || [])); // Deep clone
            }
        }
        else {
            // Initialize with default property
            this.properties = [{
                    key: 'message',
                    label: 'Message',
                    type: 'textarea',
                    rows: 4,
                    placeholder: 'Enter your prompt...',
                    defaultValue: ''
                }];
        }
    }
    addProperty() {
        const newProperty = {
            key: `property_${Date.now()}`,
            label: 'New Property',
            type: 'text',
            placeholder: '',
            defaultValue: ''
        };
        this.properties.push(newProperty);
    }
    removeProperty(index) {
        this.properties.splice(index, 1);
    }
    updatePropertyType(property) {
        // Reset type-specific properties when type changes
        delete property.options;
        delete property.min;
        delete property.max;
        delete property.step;
        delete property.rows;
        // Set defaults based on type
        switch (property.type) {
            case 'textarea':
            case 'json':
                property.rows = 4;
                break;
            case 'number':
                property.min = 0;
                property.max = 100;
                property.step = 1;
                break;
            case 'select':
                property.options = [
                    { value: 'option1', label: 'Option 1' },
                    { value: 'option2', label: 'Option 2' }
                ];
                break;
            case 'checkbox':
                property.defaultValue = false;
                break;
        }
    }
    addSelectOption(property) {
        if (!property.options) {
            property.options = [];
        }
        property.options.push({
            value: `opt_${Date.now()}`,
            label: 'New Option'
        });
    }
    removeSelectOption(property, index) {
        if (property.options) {
            property.options.splice(index, 1);
        }
    }
    savePrompt() {
        if (!this.promptName.trim()) {
            alert('Please enter a prompt name');
            return;
        }
        if (this.properties.length === 0) {
            alert('Please add at least one property');
            return;
        }
        // Validate property keys are unique
        const keys = this.properties.map(p => p.key);
        if (new Set(keys).size !== keys.length) {
            alert('Property keys must be unique');
            return;
        }
        let savedPrompt;
        if (this.promptId && !this.isNew) {
            // Update existing
            this.promptManager.updatePrompt(this.promptId, {
                name: this.promptName,
                properties: this.properties
            });
            savedPrompt = this.promptManager.getPrompt(this.promptId);
        }
        else {
            // Create new
            savedPrompt = this.promptManager.createPrompt(this.promptName, this.properties);
        }
        this.save.emit(savedPrompt);
    }
    onCancel() {
        this.cancel.emit();
    }
    // Make property key safe for use as identifier
    sanitizeKey(event, property) {
        const value = event.target.value;
        property.key = value.replace(/[^a-zA-Z0-9_]/g, '_').replace(/^[0-9]/, '_$&');
    }
    static { this.ɵfac = function PromptEditorComponent_Factory(t) { return new (t || PromptEditorComponent)(i0.ɵɵdirectiveInject(i1.PromptManagerService)); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PromptEditorComponent, selectors: [["app-prompt-editor"]], inputs: { promptId: "promptId", isNew: "isNew" }, outputs: { save: "save", cancel: "cancel" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 27, vars: 3, consts: [[1, "prompt-editor"], [1, "editor-header"], [1, "editor-title"], [1, "fas", "fa-edit"], [1, "close-button", 3, "click"], [1, "fas", "fa-times"], [1, "editor-content"], [1, "form-section"], [1, "form-label"], ["type", "text", "placeholder", "Enter prompt name...", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "section-header"], [1, "section-title"], [1, "add-button", 3, "click"], [1, "fas", "fa-plus"], [1, "properties-list"], ["class", "property-item", 4, "ngFor", "ngForOf"], [1, "editor-footer"], [1, "button", "secondary", 3, "click"], [1, "button", "primary", 3, "click"], [1, "fas", "fa-save"], [1, "property-item"], [1, "property-header"], [1, "property-number"], ["class", "remove-button", 3, "click", 4, "ngIf"], [1, "property-fields"], [1, "field-row"], [1, "field"], ["type", "text", "placeholder", "property_key", 1, "form-input", 3, "ngModelChange", "input", "ngModel"], ["type", "text", "placeholder", "Property Label", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "form-input", 3, "ngModelChange", "change", "ngModel"], [3, "value", 4, "ngFor", "ngForOf"], ["type", "text", "placeholder", "Placeholder text...", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "type-specific-fields"], ["class", "field-row", 4, "ngIf"], ["class", "field", 4, "ngIf"], ["class", "select-options", 4, "ngIf"], [3, "ngSwitch"], ["type", "text", "class", "form-input", 3, "ngModel", "ngModelChange", 4, "ngSwitchCase"], ["type", "number", "class", "form-input", 3, "ngModel", "ngModelChange", 4, "ngSwitchCase"], ["class", "form-input", 3, "ngModel", "rows", "ngModelChange", 4, "ngSwitchCase"], ["placeholder", "{\"key\": \"value\"}", "class", "form-input", 3, "ngModel", "rows", "ngModelChange", 4, "ngSwitchCase"], ["class", "form-input", 3, "ngModel", "ngModelChange", 4, "ngSwitchCase"], ["class", "checkbox-label", 4, "ngSwitchCase"], [1, "remove-button", 3, "click"], [1, "fas", "fa-trash"], [3, "value"], [1, "field-third"], ["type", "number", 1, "form-input", 3, "ngModelChange", "ngModel"], ["type", "number", "min", "1", "max", "20", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "select-options"], [1, "options-list"], ["class", "option-item", 4, "ngFor", "ngForOf"], [1, "add-option-button", 3, "click"], [1, "option-item"], ["type", "text", "placeholder", "Value", 1, "form-input", "small", 3, "ngModelChange", "ngModel"], ["type", "text", "placeholder", "Label", 1, "form-input", "small", 3, "ngModelChange", "ngModel"], [1, "icon-button", 3, "click"], ["type", "text", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "form-input", 3, "ngModelChange", "ngModel", "rows"], ["placeholder", "{\"key\": \"value\"}", 1, "form-input", 3, "ngModelChange", "ngModel", "rows"], [1, "form-input", 3, "ngModelChange", "ngModel"], [1, "checkbox-label"], ["type", "checkbox", 3, "ngModelChange", "ngModel"]], template: function PromptEditorComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "h3", 2);
            i0.ɵɵelement(3, "i", 3);
            i0.ɵɵtext(4);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(5, "button", 4);
            i0.ɵɵlistener("click", function PromptEditorComponent_Template_button_click_5_listener() { return ctx.onCancel(); });
            i0.ɵɵelement(6, "i", 5);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(7, "div", 6)(8, "div", 7)(9, "label", 8);
            i0.ɵɵtext(10, "Prompt Name");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(11, "input", 9);
            i0.ɵɵtwoWayListener("ngModelChange", function PromptEditorComponent_Template_input_ngModelChange_11_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.promptName, $event) || (ctx.promptName = $event); return $event; });
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(12, "div", 7)(13, "div", 10)(14, "h4", 11);
            i0.ɵɵtext(15, "Properties");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(16, "button", 12);
            i0.ɵɵlistener("click", function PromptEditorComponent_Template_button_click_16_listener() { return ctx.addProperty(); });
            i0.ɵɵelement(17, "i", 13);
            i0.ɵɵtext(18, " Add Property ");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(19, "div", 14);
            i0.ɵɵtemplate(20, PromptEditorComponent_div_20_Template, 39, 17, "div", 15);
            i0.ɵɵelementEnd()()();
            i0.ɵɵelementStart(21, "div", 16)(22, "button", 17);
            i0.ɵɵlistener("click", function PromptEditorComponent_Template_button_click_22_listener() { return ctx.onCancel(); });
            i0.ɵɵtext(23, "Cancel");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(24, "button", 18);
            i0.ɵɵlistener("click", function PromptEditorComponent_Template_button_click_24_listener() { return ctx.savePrompt(); });
            i0.ɵɵelement(25, "i", 19);
            i0.ɵɵtext(26, " Save Prompt ");
            i0.ɵɵelementEnd()()();
        } if (rf & 2) {
            i0.ɵɵadvance(4);
            i0.ɵɵtextInterpolate1(" ", ctx.isNew ? "Create New Prompt" : "Edit Prompt", " ");
            i0.ɵɵadvance(7);
            i0.ɵɵtwoWayProperty("ngModel", ctx.promptName);
            i0.ɵɵadvance(9);
            i0.ɵɵproperty("ngForOf", ctx.properties);
        } }, dependencies: [CommonModule, i2.NgForOf, i2.NgIf, i2.NgSwitch, i2.NgSwitchCase, FormsModule, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.DefaultValueAccessor, i3.NumberValueAccessor, i3.CheckboxControlValueAccessor, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.MinValidator, i3.MaxValidator, i3.NgModel], styles: [".prompt-editor[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90%;\n  max-width: 800px;\n  max-height: 90vh;\n  background: var(--white-color);\n  border-radius: var(--border-radius);\n  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);\n  display: flex;\n  flex-direction: column;\n  z-index: 1000;\n}\n\n.editor-header[_ngcontent-%COMP%] {\n  padding: 1.5rem;\n  border-bottom: 1px solid var(--gray-700);\n  background: var(--gray-600);\n  border-radius: var(--border-radius) var(--border-radius) 0 0;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.editor-title[_ngcontent-%COMP%] {\n  font-size: 1.25rem;\n  font-weight: 600;\n  margin: 0;\n  color: var(--gray-900);\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  \n  i {\n    color: var(--mj-blue);\n  }\n}\n\n.close-button[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border: none;\n  background: transparent;\n  color: var(--gray-800);\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: var(--gray-700);\n    color: var(--gray-900);\n  }\n}\n\n.editor-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1.5rem;\n}\n\n.form-section[_ngcontent-%COMP%] {\n  margin-bottom: 2rem;\n}\n\n.form-label[_ngcontent-%COMP%] {\n  display: block;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  font-weight: 600;\n  color: var(--gray-800);\n}\n\n.form-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 0.5rem 0.75rem;\n  border: 1px solid var(--gray-700);\n  border-radius: var(--border-radius);\n  font-size: 0.875rem;\n  transition: all var(--transition-time);\n  \n  &:focus {\n    outline: none;\n    border-color: var(--mj-blue);\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.25);\n  }\n  \n  &.small {\n    width: auto;\n    flex: 1;\n  }\n}\n\ntextarea.form-input[_ngcontent-%COMP%] {\n  resize: vertical;\n  font-family: inherit;\n}\n\n.section-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 1rem;\n}\n\n.section-title[_ngcontent-%COMP%] {\n  font-size: 1rem;\n  font-weight: 600;\n  margin: 0;\n  color: var(--gray-900);\n}\n\n.add-button[_ngcontent-%COMP%] {\n  padding: 0.5rem 1rem;\n  border: 1px solid var(--mj-blue);\n  background: transparent;\n  color: var(--mj-blue);\n  border-radius: var(--border-radius);\n  cursor: pointer;\n  font-size: 0.875rem;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: var(--mj-blue);\n    color: white;\n  }\n}\n\n.properties-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 1.5rem;\n}\n\n.property-item[_ngcontent-%COMP%] {\n  background: var(--gray-600);\n  border: 1px solid var(--gray-700);\n  border-radius: var(--border-radius);\n  padding: 1rem;\n}\n\n.property-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 1rem;\n}\n\n.property-number[_ngcontent-%COMP%] {\n  width: 24px;\n  height: 24px;\n  background: var(--mj-blue);\n  color: white;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.75rem;\n  font-weight: 600;\n}\n\n.remove-button[_ngcontent-%COMP%] {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: #dc3545;\n  color: white;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.75rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: #c82333;\n  }\n}\n\n.property-fields[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.field-row[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 1rem;\n}\n\n.field[_ngcontent-%COMP%] {\n  flex: 1;\n  \n  label {\n    display: block;\n    margin-bottom: 0.25rem;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--gray-800);\n  }\n}\n\n.field-third[_ngcontent-%COMP%] {\n  flex: 1;\n  \n  label {\n    display: block;\n    margin-bottom: 0.25rem;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--gray-800);\n  }\n}\n\n.type-specific-fields[_ngcontent-%COMP%] {\n  background: var(--white-color);\n  padding: 1rem;\n  border-radius: var(--border-radius);\n  margin-top: 0.5rem;\n}\n\n.select-options[_ngcontent-%COMP%] {\n  label {\n    display: block;\n    margin-bottom: 0.5rem;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--gray-800);\n  }\n}\n\n.options-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.option-item[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n}\n\n.icon-button[_ngcontent-%COMP%] {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: var(--gray-700);\n  color: var(--gray-900);\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.75rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: #dc3545;\n    color: white;\n  }\n}\n\n.add-option-button[_ngcontent-%COMP%] {\n  padding: 0.375rem 0.75rem;\n  border: 1px dashed var(--gray-700);\n  background: transparent;\n  color: var(--gray-800);\n  border-radius: var(--border-radius);\n  cursor: pointer;\n  font-size: 0.75rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    border-color: var(--mj-blue);\n    color: var(--mj-blue);\n  }\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  font-size: 0.875rem;\n  color: var(--gray-900);\n  cursor: pointer;\n  \n  input[type=\"checkbox\"] {\n    cursor: pointer;\n  }\n}\n\n.editor-footer[_ngcontent-%COMP%] {\n  padding: 1rem 1.5rem;\n  border-top: 1px solid var(--gray-700);\n  background: var(--gray-600);\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n}\n\n.button[_ngcontent-%COMP%] {\n  padding: 0.5rem 1.25rem;\n  border: none;\n  border-radius: var(--border-radius);\n  font-size: 0.875rem;\n  font-weight: 500;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  transition: all var(--transition-time);\n  \n  &.primary {\n    background: var(--mj-blue);\n    color: white;\n    \n    &:hover {\n      background: #005a8b;\n    }\n  }\n  \n  &.secondary {\n    background: var(--gray-700);\n    color: var(--gray-900);\n    \n    &:hover {\n      background: var(--gray-800);\n    }\n  }\n}\n\n//   Modal   backdrop\n[_nghost-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  z-index: 999;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}"] }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PromptEditorComponent, [{
        type: Component,
        args: [{ selector: 'app-prompt-editor', standalone: true, imports: [CommonModule, FormsModule], template: "<div class=\"prompt-editor\">\n  <div class=\"editor-header\">\n    <h3 class=\"editor-title\">\n      <i class=\"fas fa-edit\"></i> \n      {{ isNew ? 'Create New Prompt' : 'Edit Prompt' }}\n    </h3>\n    <button class=\"close-button\" (click)=\"onCancel()\">\n      <i class=\"fas fa-times\"></i>\n    </button>\n  </div>\n\n  <div class=\"editor-content\">\n    <div class=\"form-section\">\n      <label class=\"form-label\">Prompt Name</label>\n      <input \n        type=\"text\" \n        [(ngModel)]=\"promptName\" \n        class=\"form-input\"\n        placeholder=\"Enter prompt name...\">\n    </div>\n\n    <div class=\"form-section\">\n      <div class=\"section-header\">\n        <h4 class=\"section-title\">Properties</h4>\n        <button class=\"add-button\" (click)=\"addProperty()\">\n          <i class=\"fas fa-plus\"></i> Add Property\n        </button>\n      </div>\n\n      <div class=\"properties-list\">\n        <div *ngFor=\"let property of properties; let i = index\" class=\"property-item\">\n          <div class=\"property-header\">\n            <span class=\"property-number\">{{ i + 1 }}</span>\n            <button class=\"remove-button\" (click)=\"removeProperty(i)\" *ngIf=\"properties.length > 1\">\n              <i class=\"fas fa-trash\"></i>\n            </button>\n          </div>\n\n          <div class=\"property-fields\">\n            <div class=\"field-row\">\n              <div class=\"field\">\n                <label>Property Key</label>\n                <input \n                  type=\"text\" \n                  [(ngModel)]=\"property.key\" \n                  (input)=\"sanitizeKey($event, property)\"\n                  class=\"form-input\"\n                  placeholder=\"property_key\">\n              </div>\n              <div class=\"field\">\n                <label>Display Label</label>\n                <input \n                  type=\"text\" \n                  [(ngModel)]=\"property.label\" \n                  class=\"form-input\"\n                  placeholder=\"Property Label\">\n              </div>\n            </div>\n\n            <div class=\"field-row\">\n              <div class=\"field\">\n                <label>Type</label>\n                <select \n                  [(ngModel)]=\"property.type\" \n                  (change)=\"updatePropertyType(property)\"\n                  class=\"form-input\">\n                  <option *ngFor=\"let type of propertyTypes\" [value]=\"type.value\">\n                    {{ type.label }}\n                  </option>\n                </select>\n              </div>\n              <div class=\"field\">\n                <label>Placeholder</label>\n                <input \n                  type=\"text\" \n                  [(ngModel)]=\"property.placeholder\" \n                  class=\"form-input\"\n                  placeholder=\"Placeholder text...\">\n              </div>\n            </div>\n\n            <!-- Type-specific fields -->\n            <div class=\"type-specific-fields\">\n              <!-- Number fields -->\n              <div *ngIf=\"property.type === 'number'\" class=\"field-row\">\n                <div class=\"field-third\">\n                  <label>Min</label>\n                  <input \n                    type=\"number\" \n                    [(ngModel)]=\"property.min\" \n                    class=\"form-input\">\n                </div>\n                <div class=\"field-third\">\n                  <label>Max</label>\n                  <input \n                    type=\"number\" \n                    [(ngModel)]=\"property.max\" \n                    class=\"form-input\">\n                </div>\n                <div class=\"field-third\">\n                  <label>Step</label>\n                  <input \n                    type=\"number\" \n                    [(ngModel)]=\"property.step\" \n                    class=\"form-input\">\n                </div>\n              </div>\n\n              <!-- Textarea/JSON fields -->\n              <div *ngIf=\"property.type === 'textarea' || property.type === 'json'\" class=\"field\">\n                <label>Rows</label>\n                <input \n                  type=\"number\" \n                  [(ngModel)]=\"property.rows\" \n                  min=\"1\" \n                  max=\"20\"\n                  class=\"form-input\">\n              </div>\n\n              <!-- Select options -->\n              <div *ngIf=\"property.type === 'select'\" class=\"select-options\">\n                <label>Options</label>\n                <div class=\"options-list\">\n                  <div *ngFor=\"let option of property.options; let j = index\" class=\"option-item\">\n                    <input \n                      type=\"text\" \n                      [(ngModel)]=\"option.value\" \n                      class=\"form-input small\"\n                      placeholder=\"Value\">\n                    <input \n                      type=\"text\" \n                      [(ngModel)]=\"option.label\" \n                      class=\"form-input small\"\n                      placeholder=\"Label\">\n                    <button class=\"icon-button\" (click)=\"removeSelectOption(property, j)\">\n                      <i class=\"fas fa-times\"></i>\n                    </button>\n                  </div>\n                  <button class=\"add-option-button\" (click)=\"addSelectOption(property)\">\n                    <i class=\"fas fa-plus\"></i> Add Option\n                  </button>\n                </div>\n              </div>\n            </div>\n\n            <!-- Default value -->\n            <div class=\"field\">\n              <label>Default Value</label>\n              <div [ngSwitch]=\"property.type\">\n                <input \n                  *ngSwitchCase=\"'text'\"\n                  type=\"text\" \n                  [(ngModel)]=\"property.defaultValue\" \n                  class=\"form-input\">\n                <input \n                  *ngSwitchCase=\"'number'\"\n                  type=\"number\" \n                  [(ngModel)]=\"property.defaultValue\" \n                  class=\"form-input\">\n                <textarea \n                  *ngSwitchCase=\"'textarea'\"\n                  [(ngModel)]=\"property.defaultValue\" \n                  [rows]=\"2\"\n                  class=\"form-input\">\n                </textarea>\n                <textarea \n                  *ngSwitchCase=\"'json'\"\n                  [(ngModel)]=\"property.defaultValue\" \n                  [rows]=\"2\"\n                  placeholder='{\"key\": \"value\"}'\n                  class=\"form-input\">\n                </textarea>\n                <select \n                  *ngSwitchCase=\"'select'\"\n                  [(ngModel)]=\"property.defaultValue\" \n                  class=\"form-input\">\n                  <option *ngFor=\"let opt of property.options\" [value]=\"opt.value\">\n                    {{ opt.label }}\n                  </option>\n                </select>\n                <label *ngSwitchCase=\"'checkbox'\" class=\"checkbox-label\">\n                  <input \n                    type=\"checkbox\" \n                    [(ngModel)]=\"property.defaultValue\">\n                  Default checked\n                </label>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"editor-footer\">\n    <button class=\"button secondary\" (click)=\"onCancel()\">Cancel</button>\n    <button class=\"button primary\" (click)=\"savePrompt()\">\n      <i class=\"fas fa-save\"></i> Save Prompt\n    </button>\n  </div>\n</div>", styles: [".prompt-editor {\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90%;\n  max-width: 800px;\n  max-height: 90vh;\n  background: var(--white-color);\n  border-radius: var(--border-radius);\n  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);\n  display: flex;\n  flex-direction: column;\n  z-index: 1000;\n}\n\n.editor-header {\n  padding: 1.5rem;\n  border-bottom: 1px solid var(--gray-700);\n  background: var(--gray-600);\n  border-radius: var(--border-radius) var(--border-radius) 0 0;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.editor-title {\n  font-size: 1.25rem;\n  font-weight: 600;\n  margin: 0;\n  color: var(--gray-900);\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  \n  i {\n    color: var(--mj-blue);\n  }\n}\n\n.close-button {\n  width: 36px;\n  height: 36px;\n  border: none;\n  background: transparent;\n  color: var(--gray-800);\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: var(--gray-700);\n    color: var(--gray-900);\n  }\n}\n\n.editor-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1.5rem;\n}\n\n.form-section {\n  margin-bottom: 2rem;\n}\n\n.form-label {\n  display: block;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  font-weight: 600;\n  color: var(--gray-800);\n}\n\n.form-input {\n  width: 100%;\n  padding: 0.5rem 0.75rem;\n  border: 1px solid var(--gray-700);\n  border-radius: var(--border-radius);\n  font-size: 0.875rem;\n  transition: all var(--transition-time);\n  \n  &:focus {\n    outline: none;\n    border-color: var(--mj-blue);\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.25);\n  }\n  \n  &.small {\n    width: auto;\n    flex: 1;\n  }\n}\n\ntextarea.form-input {\n  resize: vertical;\n  font-family: inherit;\n}\n\n.section-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 1rem;\n}\n\n.section-title {\n  font-size: 1rem;\n  font-weight: 600;\n  margin: 0;\n  color: var(--gray-900);\n}\n\n.add-button {\n  padding: 0.5rem 1rem;\n  border: 1px solid var(--mj-blue);\n  background: transparent;\n  color: var(--mj-blue);\n  border-radius: var(--border-radius);\n  cursor: pointer;\n  font-size: 0.875rem;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: var(--mj-blue);\n    color: white;\n  }\n}\n\n.properties-list {\n  display: flex;\n  flex-direction: column;\n  gap: 1.5rem;\n}\n\n.property-item {\n  background: var(--gray-600);\n  border: 1px solid var(--gray-700);\n  border-radius: var(--border-radius);\n  padding: 1rem;\n}\n\n.property-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 1rem;\n}\n\n.property-number {\n  width: 24px;\n  height: 24px;\n  background: var(--mj-blue);\n  color: white;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.75rem;\n  font-weight: 600;\n}\n\n.remove-button {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: #dc3545;\n  color: white;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.75rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: #c82333;\n  }\n}\n\n.property-fields {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.field-row {\n  display: flex;\n  gap: 1rem;\n}\n\n.field {\n  flex: 1;\n  \n  label {\n    display: block;\n    margin-bottom: 0.25rem;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--gray-800);\n  }\n}\n\n.field-third {\n  flex: 1;\n  \n  label {\n    display: block;\n    margin-bottom: 0.25rem;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--gray-800);\n  }\n}\n\n.type-specific-fields {\n  background: var(--white-color);\n  padding: 1rem;\n  border-radius: var(--border-radius);\n  margin-top: 0.5rem;\n}\n\n.select-options {\n  label {\n    display: block;\n    margin-bottom: 0.5rem;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--gray-800);\n  }\n}\n\n.options-list {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.option-item {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n}\n\n.icon-button {\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: var(--gray-700);\n  color: var(--gray-900);\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 0.75rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    background: #dc3545;\n    color: white;\n  }\n}\n\n.add-option-button {\n  padding: 0.375rem 0.75rem;\n  border: 1px dashed var(--gray-700);\n  background: transparent;\n  color: var(--gray-800);\n  border-radius: var(--border-radius);\n  cursor: pointer;\n  font-size: 0.75rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n  transition: all var(--transition-time);\n  \n  &:hover {\n    border-color: var(--mj-blue);\n    color: var(--mj-blue);\n  }\n}\n\n.checkbox-label {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  font-size: 0.875rem;\n  color: var(--gray-900);\n  cursor: pointer;\n  \n  input[type=\"checkbox\"] {\n    cursor: pointer;\n  }\n}\n\n.editor-footer {\n  padding: 1rem 1.5rem;\n  border-top: 1px solid var(--gray-700);\n  background: var(--gray-600);\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n}\n\n.button {\n  padding: 0.5rem 1.25rem;\n  border: none;\n  border-radius: var(--border-radius);\n  font-size: 0.875rem;\n  font-weight: 500;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  transition: all var(--transition-time);\n  \n  &.primary {\n    background: var(--mj-blue);\n    color: white;\n    \n    &:hover {\n      background: #005a8b;\n    }\n  }\n  \n  &.secondary {\n    background: var(--gray-700);\n    color: var(--gray-900);\n    \n    &:hover {\n      background: var(--gray-800);\n    }\n  }\n}\n\n// Modal backdrop\n:host {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  z-index: 999;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}"] }]
    }], () => [{ type: i1.PromptManagerService }], { promptId: [{
            type: Input
        }], isNew: [{
            type: Input
        }], save: [{
            type: Output
        }], cancel: [{
            type: Output
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PromptEditorComponent, { className: "PromptEditorComponent", filePath: "src/lib/custom/AIAgents/FlowAgentType/flow-editor-integration/components/prompt-editor/prompt-editor.component.ts", lineNumber: 14 }); })();
//# sourceMappingURL=prompt-editor.component.js.map