/**
 * @module step-basics.component
 * @description Step 1 of the create wizard — entity name, table name, schema, description.
 *
 * Auto-derives the table name from entity name (PascalCase, no spaces) but
 * lets the user override it freely.  Once the user manually edits the table
 * name it stops tracking entity name changes.
 */
import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef, inject, } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
const _forTrack0 = ($index, $item) => $item.value;
function StepBasicsComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtext(0, " Auto-derived from entity name \u2014 edit to override. ");
} }
function StepBasicsComponent_Conditional_26_For_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "option", 16);
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const schema_r3 = ctx.$implicit;
    i0.ɵɵproperty("value", schema_r3.value);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate(schema_r3.label);
} }
function StepBasicsComponent_Conditional_26_Template(rf, ctx) { if (rf & 1) {
    const _r1 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "select", 15);
    i0.ɵɵlistener("change", function StepBasicsComponent_Conditional_26_Template_select_change_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnSchemaChange($event.target.value)); });
    i0.ɵɵrepeaterCreate(1, StepBasicsComponent_Conditional_26_For_2_Template, 2, 2, "option", 16, _forTrack0);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵproperty("value", ctx_r1.SchemaName);
    i0.ɵɵadvance();
    i0.ɵɵrepeater(ctx_r1.AvailableSchemas);
} }
function StepBasicsComponent_Conditional_27_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 12);
    i0.ɵɵelement(1, "i", 17);
    i0.ɵɵtext(2, " You do not have authorization to create entities in any schema. Contact your administrator. ");
    i0.ɵɵelementEnd();
} }
function StepBasicsComponent_Conditional_28_Template(rf, ctx) { if (rf & 1) {
    const _r4 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "input", 18);
    i0.ɵɵlistener("input", function StepBasicsComponent_Conditional_28_Template_input_input_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnCustomSchemaChange($event.target.value)); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(1, "span", 5);
    i0.ɵɵelement(2, "i", 19);
    i0.ɵɵtext(3, " Custom schema requires elevated access. Confirm with your DBA. ");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵproperty("value", ctx_r1.CustomSchemaName);
} }
export class StepBasicsComponent {
    cdr = inject(ChangeDetectorRef);
    InitialValue = {};
    _availableSchemas = [];
    set AvailableSchemas(schemas) {
        this._availableSchemas = schemas;
        // Schemas arrive async — if SchemaName wasn't set by InitialValue, auto-select the default now.
        if (!this.SchemaName && schemas.length > 0) {
            this.SchemaName = this.defaultSchema();
            this.updateCustomSchemaVisibility();
            this.emit();
            this.cdr.markForCheck();
        }
    }
    get AvailableSchemas() { return this._availableSchemas; }
    ValueChanged = new EventEmitter();
    // ─── Form fields ───────────────────────────────────────────────────────
    EntityName = '';
    TableName = '';
    SchemaName = '';
    Description = '';
    /** When true, TableName auto-tracks EntityName changes. */
    tableNameIsAuto = true;
    // ─── Custom schema input ───────────────────────────────────────────────
    ShowCustomSchemaInput = false;
    CustomSchemaName = '';
    // ─── Lifecycle ─────────────────────────────────────────────────────────
    ngOnInit() {
        this.EntityName = this.InitialValue.entityName ?? '';
        this.TableName = this.InitialValue.tableName ?? '';
        this.SchemaName = this.InitialValue.schemaName ?? this.defaultSchema();
        this.Description = this.InitialValue.description ?? '';
        this.tableNameIsAuto = this.InitialValue.tableNameIsAuto ?? true;
        // If SchemaName was a previously typed value (no matching dropdown option),
        // restore it to CustomSchemaName so the text field is pre-populated on back-nav.
        const knownOpt = this.AvailableSchemas.find(s => s.value === this.SchemaName);
        if (knownOpt == null && this.SchemaName) {
            this.CustomSchemaName = this.SchemaName;
        }
        this.updateCustomSchemaVisibility();
    }
    // ─── Event handlers ────────────────────────────────────────────────────
    OnEntityNameChange(value) {
        this.EntityName = value;
        if (this.tableNameIsAuto) {
            this.TableName = this.deriveTableName(value);
        }
        this.emit();
    }
    OnTableNameChange(value) {
        this.TableName = value;
        // User has taken manual control
        this.tableNameIsAuto = value === this.deriveTableName(this.EntityName);
        this.emit();
    }
    OnSchemaChange(value) {
        this.SchemaName = value;
        this.updateCustomSchemaVisibility();
        if (!this.ShowCustomSchemaInput)
            this.CustomSchemaName = '';
        this.emit();
    }
    OnCustomSchemaChange(value) {
        this.CustomSchemaName = value;
        this.SchemaName = value;
        this.emit();
    }
    OnDescriptionChange(value) {
        this.Description = value;
        this.emit();
    }
    // ─── Helpers ───────────────────────────────────────────────────────────
    /** Pick the first schema in the list as default (usually '__mj_UDT'). */
    defaultSchema() {
        const def = this.AvailableSchemas.find(s => s.isDefault);
        return def?.value ?? this.AvailableSchemas[0]?.value ?? '';
    }
    updateCustomSchemaVisibility() {
        const opt = this.AvailableSchemas.find(s => s.value === this.SchemaName);
        // Show the free-text input only for the "Other" sentinel option (value === '').
        // Named schemas like 'testing_ethan' already have their name from the dropdown.
        // If SchemaName doesn't match any option (back-navigation from a typed entry),
        // show the input so the user can still edit their previously typed value.
        this.ShowCustomSchemaInput = opt != null ? opt.value === '' : this.SchemaName !== '';
    }
    /** Convert "Support Tickets" → "SupportTickets". */
    deriveTableName(entityName) {
        return entityName
            .replace(/[^a-zA-Z0-9 ]/g, '')
            .split(' ')
            .filter(Boolean)
            .map(w => w.charAt(0).toUpperCase() + w.slice(1))
            .join('');
    }
    emit() {
        this.ValueChanged.emit({
            entityName: this.EntityName,
            tableName: this.TableName,
            schemaName: this.SchemaName,
            description: this.Description,
            tableNameIsAuto: this.tableNameIsAuto,
        });
        this.cdr.markForCheck();
    }
    static ɵfac = function StepBasicsComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || StepBasicsComponent)(); };
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: StepBasicsComponent, selectors: [["mj-entity-step-basics"]], inputs: { InitialValue: "InitialValue", AvailableSchemas: "AvailableSchemas" }, outputs: { ValueChanged: "ValueChanged" }, standalone: false, decls: 34, vars: 8, consts: [[1, "step-basics"], [1, "field-group"], ["for", "entityName", 1, "field-label"], [1, "req"], ["id", "entityName", "type", "text", "placeholder", "e.g. Project Milestones", "autocomplete", "off", 1, "mj-input", 3, "input", "value"], [1, "field-hint"], ["for", "tableName", 1, "field-label"], [1, "table-name-wrap"], ["id", "tableName", "type", "text", "placeholder", "e.g. ProjectMilestones", "autocomplete", "off", 1, "mj-input", 3, "input", "value"], [1, "auto-badge"], ["for", "schemaName", 1, "field-label"], ["id", "schemaName", 1, "mj-input", 3, "value"], [1, "no-schemas-warning"], ["for", "description", 1, "field-label"], ["id", "description", "rows", "3", "placeholder", "Optional \u2014 briefly describe the purpose of this entity", 1, "mj-textarea", 3, "input", "value"], ["id", "schemaName", 1, "mj-input", 3, "change", "value"], [3, "value"], [1, "fa-solid", "fa-lock"], ["type", "text", "placeholder", "Enter schema name (e.g. sales, finance)", "autocomplete", "off", 1, "mj-input", "mt-sm", 3, "input", "value"], [1, "fa-solid", "fa-triangle-exclamation", "warning-icon"]], template: function StepBasicsComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "label", 2);
            i0.ɵɵtext(3, " Entity Name ");
            i0.ɵɵelementStart(4, "span", 3);
            i0.ɵɵtext(5, "*");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(6, "input", 4);
            i0.ɵɵlistener("input", function StepBasicsComponent_Template_input_input_6_listener($event) { return ctx.OnEntityNameChange($event.target.value); });
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(7, "span", 5);
            i0.ɵɵtext(8, " The display name used throughout MemberJunction (e.g., \"Expense Reports\") ");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(9, "div", 1)(10, "label", 6);
            i0.ɵɵtext(11, " Table Name ");
            i0.ɵɵelementStart(12, "span", 3);
            i0.ɵɵtext(13, "*");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(14, "div", 7)(15, "input", 8);
            i0.ɵɵlistener("input", function StepBasicsComponent_Template_input_input_15_listener($event) { return ctx.OnTableNameChange($event.target.value); });
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(16, "span", 9);
            i0.ɵɵtext(17, "auto");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(18, "span", 5);
            i0.ɵɵtext(19, " SQL table identifier. PascalCase, no spaces. ");
            i0.ɵɵconditionalCreate(20, StepBasicsComponent_Conditional_20_Template, 1, 0);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(21, "div", 1)(22, "label", 10);
            i0.ɵɵtext(23, " Schema ");
            i0.ɵɵelementStart(24, "span", 3);
            i0.ɵɵtext(25, "*");
            i0.ɵɵelementEnd()();
            i0.ɵɵconditionalCreate(26, StepBasicsComponent_Conditional_26_Template, 3, 1, "select", 11)(27, StepBasicsComponent_Conditional_27_Template, 3, 0, "div", 12);
            i0.ɵɵconditionalCreate(28, StepBasicsComponent_Conditional_28_Template, 4, 1);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(29, "div", 1)(30, "label", 13);
            i0.ɵɵtext(31, "Description");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(32, "textarea", 14);
            i0.ɵɵlistener("input", function StepBasicsComponent_Template_textarea_input_32_listener($event) { return ctx.OnDescriptionChange($event.target.value); });
            i0.ɵɵtext(33, "    ");
            i0.ɵɵelementEnd()()();
        } if (rf & 2) {
            i0.ɵɵadvance(6);
            i0.ɵɵproperty("value", ctx.EntityName);
            i0.ɵɵadvance(9);
            i0.ɵɵproperty("value", ctx.TableName);
            i0.ɵɵadvance();
            i0.ɵɵclassProp("active", ctx.tableNameIsAuto);
            i0.ɵɵadvance(4);
            i0.ɵɵconditional(ctx.tableNameIsAuto ? 20 : -1);
            i0.ɵɵadvance(6);
            i0.ɵɵconditional(ctx.AvailableSchemas.length > 0 ? 26 : 27);
            i0.ɵɵadvance(2);
            i0.ɵɵconditional(ctx.ShowCustomSchemaInput ? 28 : -1);
            i0.ɵɵadvance(4);
            i0.ɵɵproperty("value", ctx.Description);
        } }, dependencies: [i1.NgSelectOption, i1.ɵNgSelectMultipleOption], styles: [".step-basics[_ngcontent-%COMP%] {\n  padding: 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.field-group[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n\n.field-label[_ngcontent-%COMP%] {\n  font-size: 0.875rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.req[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n}\n\n.field-hint[_ngcontent-%COMP%] {\n  font-size: 0.8rem;\n  color: var(--mj-text-muted);\n  line-height: 1.5;\n}\n\n.table-name-wrap[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.table-name-wrap[_ngcontent-%COMP%]   .mj-input[_ngcontent-%COMP%] {\n  flex: 1;\n  padding-right: 52px;\n}\n\n.auto-badge[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 8px;\n  font-size: 0.7rem;\n  font-weight: 700;\n  text-transform: uppercase;\n  padding: 2px 6px;\n  border-radius: 4px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  pointer-events: none;\n  transition: background 0.15s, color 0.15s;\n}\n\n.auto-badge.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.no-schemas-warning[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 14px;\n  background: var(--mj-status-warning-bg);\n  color: var(--mj-status-warning-text);\n  border: 1px solid var(--mj-status-warning-border);\n  border-radius: 6px;\n  font-size: 0.875rem;\n}\n\n.warning-icon[_ngcontent-%COMP%] {\n  color: var(--mj-status-warning);\n  margin-right: 3px;\n}\n\n.mt-sm[_ngcontent-%COMP%] {\n  margin-top: 8px;\n}"], changeDetection: 0 });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(StepBasicsComponent, [{
        type: Component,
        args: [{ standalone: false, selector: 'mj-entity-step-basics', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"step-basics\">\n\n  <!-- \u2500\u2500 Entity Name \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"field-group\">\n    <label class=\"field-label\" for=\"entityName\">\n      Entity Name <span class=\"req\">*</span>\n    </label>\n    <input\n      id=\"entityName\"\n      type=\"text\"\n      class=\"mj-input\"\n      placeholder=\"e.g. Project Milestones\"\n      [value]=\"EntityName\"\n      (input)=\"OnEntityNameChange($any($event.target).value)\"\n      autocomplete=\"off\" />\n    <span class=\"field-hint\">\n      The display name used throughout MemberJunction (e.g., \"Expense Reports\")\n    </span>\n  </div>\n\n  <!-- \u2500\u2500 Table Name \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"field-group\">\n    <label class=\"field-label\" for=\"tableName\">\n      Table Name <span class=\"req\">*</span>\n    </label>\n    <div class=\"table-name-wrap\">\n      <input\n        id=\"tableName\"\n        type=\"text\"\n        class=\"mj-input\"\n        placeholder=\"e.g. ProjectMilestones\"\n        [value]=\"TableName\"\n        (input)=\"OnTableNameChange($any($event.target).value)\"\n        autocomplete=\"off\" />\n      <span class=\"auto-badge\" [class.active]=\"tableNameIsAuto\">auto</span>\n    </div>\n    <span class=\"field-hint\">\n      SQL table identifier. PascalCase, no spaces.\n      @if (tableNameIsAuto) {\n        Auto-derived from entity name \u2014 edit to override.\n      }\n    </span>\n  </div>\n\n  <!-- \u2500\u2500 Schema \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"field-group\">\n    <label class=\"field-label\" for=\"schemaName\">\n      Schema <span class=\"req\">*</span>\n    </label>\n    @if (AvailableSchemas.length > 0) {\n      <select\n        id=\"schemaName\"\n        class=\"mj-input\"\n        [value]=\"SchemaName\"\n        (change)=\"OnSchemaChange($any($event.target).value)\">\n        @for (schema of AvailableSchemas; track schema.value) {\n          <option [value]=\"schema.value\">{{ schema.label }}</option>\n        }\n      </select>\n    } @else {\n      <div class=\"no-schemas-warning\">\n        <i class=\"fa-solid fa-lock\"></i>\n        You do not have authorization to create entities in any schema.\n        Contact your administrator.\n      </div>\n    }\n\n    @if (ShowCustomSchemaInput) {\n      <input\n        type=\"text\"\n        class=\"mj-input mt-sm\"\n        placeholder=\"Enter schema name (e.g. sales, finance)\"\n        [value]=\"CustomSchemaName\"\n        (input)=\"OnCustomSchemaChange($any($event.target).value)\"\n        autocomplete=\"off\" />\n      <span class=\"field-hint\">\n        <i class=\"fa-solid fa-triangle-exclamation warning-icon\"></i>\n        Custom schema requires elevated access. Confirm with your DBA.\n      </span>\n    }\n  </div>\n\n  <!-- \u2500\u2500 Description \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"field-group\">\n    <label class=\"field-label\" for=\"description\">Description</label>\n    <textarea\n      id=\"description\"\n      class=\"mj-textarea\"\n      rows=\"3\"\n      placeholder=\"Optional \u2014 briefly describe the purpose of this entity\"\n      [value]=\"Description\"\n      (input)=\"OnDescriptionChange($any($event.target).value)\">\n    </textarea>\n  </div>\n\n</div>\n", styles: [".step-basics {\n  padding: 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.field-group {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n\n.field-label {\n  font-size: 0.875rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.req {\n  color: var(--mj-status-error);\n}\n\n.field-hint {\n  font-size: 0.8rem;\n  color: var(--mj-text-muted);\n  line-height: 1.5;\n}\n\n.table-name-wrap {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.table-name-wrap .mj-input {\n  flex: 1;\n  padding-right: 52px;\n}\n\n.auto-badge {\n  position: absolute;\n  right: 8px;\n  font-size: 0.7rem;\n  font-weight: 700;\n  text-transform: uppercase;\n  padding: 2px 6px;\n  border-radius: 4px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  pointer-events: none;\n  transition: background 0.15s, color 0.15s;\n}\n\n.auto-badge.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.no-schemas-warning {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 14px;\n  background: var(--mj-status-warning-bg);\n  color: var(--mj-status-warning-text);\n  border: 1px solid var(--mj-status-warning-border);\n  border-radius: 6px;\n  font-size: 0.875rem;\n}\n\n.warning-icon {\n  color: var(--mj-status-warning);\n  margin-right: 3px;\n}\n\n.mt-sm {\n  margin-top: 8px;\n}\n"] }]
    }], null, { InitialValue: [{
            type: Input
        }], AvailableSchemas: [{
            type: Input
        }], ValueChanged: [{
            type: Output
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(StepBasicsComponent, { className: "StepBasicsComponent", filePath: "src/DatabaseDesigner/components/create-wizard/steps/step-basics.component.ts", lineNumber: 23 }); })();
//# sourceMappingURL=step-basics.component.js.map