Skip to content

[CLI MCP] [Angular]: AI app generation uses native <input type="date"> inside igx-input-group instead of Ignite UI date input components #1655

@Zneeky

Description

@Zneeky

Description:

When generating an Angular app through the MCP AI flow, date fields are currently being produced with a native HTML date input inside igx-input-group:

<igx-input-group class="form-group">
  <igx-prefix>
    <igx-icon>date_range</igx-icon>
  </igx-prefix>
  <input
    igxInput
    type="date"
    formControlName="dateOfBirth"
    [class.input-error]="dateOfBirth?.invalid && submitted">
  <label igxLabel>Date of Birth *</label>
</igx-input-group>

This should not be the preferred output for Ignite UI Angular generation. The generated result looks visually incorrect / broken in practice

Expected:

For Angular app generation targeting Ignite UI, the MCP should prefer documented Ignite UI date-entry patterns such as:

  • igx-date-picker
  • or <input> combined with IgxInput and IgxDateTimeEditor directives

Resources:

Prompt

Build a modern SaaS dashboard using Ignite UI for Angular. Include a left sidebar navigation, top header, KPI cards (IgxCard), a data grid (IgxGrid) with sorting/filtering, a date picker (IgxDatePicker) for scheduling, and a chart section. Add a responsive registration page with input groups, validation, password fields, and a date filed. Use a clean, minimal design with soft shadows, rounded corners, and a blue-purple gradient theme.

Generated App

saas-dashboard-app.zip

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions