@sondor-technology/sondor-components 1.0.7 → 1.0.9

package/dist/components/cron-builder/cron-builder.js

@@ -0,0 +1,522 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, css } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { resetStyles } from "../../styles/reset";
+let StCronBuilder = class StCronBuilder extends LitElement {
+    constructor() {
+        super();
+        this.name = "";
+        this.value = "";
+        this.required = false;
+        this._frequency = "weekly";
+        this._time = "12:00";
+        this._days = "1,3,5";
+        this._monthDay = "1";
+        this._date = "";
+        this._customCron = "0 * * * *";
+        this._customCronError = "";
+        this._customCronText = "";
+        this._defaultValue = "";
+        this._lastGeneratedOutput = "";
+        this._internals = this.attachInternals();
+        const today = new Date();
+        const pad = (n) => n.toString().padStart(2, "0");
+        this._date = `${today.getFullYear()}-${pad(today.getMonth() + 1)}-${pad(today.getDate())}`;
+    }
+    willUpdate(changedProperties) {
+        super.willUpdate(changedProperties);
+        // Check if value changed, is truthy (not ""), and wasn't generated by the component itself
+        if (changedProperties.has("value") && this.value && this.value !== this._lastGeneratedOutput) {
+            this._parseIncomingValue(this.value);
+            this._generateOutput(true); // true = silent (don't dispatch 'change' event)
+        }
+    }
+    firstUpdated(changedProperties) {
+        super.firstUpdated(changedProperties);
+        // If the component mounted without an external value, generate the default cron string
+        if (!this.value) {
+            this._generateOutput(true);
+        }
+        this._defaultValue = this.value;
+    }
+    _parseIncomingValue(val) {
+        if (!val)
+            return;
+        // 1. One-Off Checks
+        if (val.includes("T")) {
+            this._frequency = "one-off";
+            const [dateStr, timeStr] = val.split("T");
+            this._date = dateStr;
+            this._time = timeStr;
+            return;
+        }
+        const parts = val.trim().split(/\s+/);
+        if (parts.length !== 5) {
+            this._frequency = "custom";
+            this._customCron = val;
+            return;
+        }
+        // 🚀 THE FIX: Check mathematical validity FIRST.
+        // If it's broken (like DOW 15), force it to Custom so the error UI displays.
+        const analysis = this._translateCron(val);
+        if (!analysis.valid) {
+            this._frequency = "custom";
+            this._customCron = val;
+            return;
+        }
+        // 2. Safe mapping for valid cron strings
+        const [min, hour, dom, mon, dow] = parts;
+        if (/^\d+$/.test(min) && /^\d+$/.test(hour)) {
+            this._time = `${hour.padStart(2, "0")}:${min.padStart(2, "0")}`;
+            if (dom === "*" && mon === "*" && dow === "*") {
+                this._frequency = "daily";
+                return;
+            }
+            // Ensure weekly is only triggered for simple lists (e.g. "1,3,5" or "1"), not steps/ranges
+            else if (dom === "*" && mon === "*" && /^[0-7](,[0-7])*$/.test(dow)) {
+                this._frequency = "weekly";
+                this._days = dow;
+                return;
+            }
+            else if (/^\d+$/.test(dom) && mon === "*" && dow === "*") {
+                this._frequency = "monthly";
+                this._monthDay = dom;
+                return;
+            }
+        }
+        // 3. Fallback for valid but complex expressions (e.g., */15 * * * *)
+        this._frequency = "custom";
+        this._customCron = val;
+    }
+    _translateCron(cron) {
+        const parts = cron.trim().split(/\s+/);
+        if (parts.length !== 5) {
+            return {
+                valid: false,
+                text: `A cron expression must contain exactly 5 segments (currently ${parts.length}).`,
+            };
+        }
+        const types = ["Minute", "Hour", "Day of Month", "Month", "Day of Week"];
+        const bounds = [
+            { min: 0, max: 59 }, // Minute
+            { min: 0, max: 23 }, // Hour
+            { min: 1, max: 31 }, // DOM
+            { min: 1, max: 12 }, // Month
+            { min: 0, max: 7 }, // DOW
+        ];
+        for (let i = 0; i < 5; i++) {
+            const part = parts[i];
+            const type = types[i];
+            const bound = bounds[i];
+            // Prevent consecutive or hanging symbols like 1- or */
+            if (/(^[\/\-\,])|([\/\-\,]$)|([\/\-\,]{2,})/.test(part)) {
+                return { valid: false, text: `Invalid formatting in ${type} segment.` };
+            }
+            // First 3 segments (min, hour, dom) cannot have letters
+            if (i < 3 && /[A-Za-z]/.test(part)) {
+                return { valid: false, text: `${type} cannot contain letters.` };
+            }
+            // Last 2 segments can only have specific valid keywords
+            if (/[A-Za-z]/.test(part)) {
+                const words = part.match(/[A-Za-z]+/g) || [];
+                const validWords = i === 3
+                    ? ["JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"]
+                    : ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
+                for (const word of words) {
+                    if (!validWords.includes(word.toUpperCase())) {
+                        return { valid: false, text: `"${word}" is not a valid ${type}.` };
+                    }
+                }
+            }
+            const numbers = part.match(/\d+/g);
+            if (numbers) {
+                for (const numStr of numbers) {
+                    const num = parseInt(numStr, 10);
+                    if (num < bound.min || num > bound.max) {
+                        return {
+                            valid: false,
+                            text: `${type} values must be between ${bound.min} and ${bound.max}.`,
+                        };
+                    }
+                }
+            }
+        }
+        const [min, hour, dom, mon, dow] = parts;
+        let desc = "Runs ";
+        if (min === "*")
+            desc += "every minute";
+        else if (min.startsWith("*/"))
+            desc += `every ${min.substring(2)} minutes`;
+        else
+            desc += `at minute ${min}`;
+        if (hour !== "*") {
+            if (hour.startsWith("*/"))
+                desc += `, past every ${hour.substring(2)} hours`;
+            else
+                desc += `, past hour ${hour}`;
+        }
+        if (dom !== "*") {
+            if (dom.startsWith("*/"))
+                desc += `, every ${dom.substring(2)} days`;
+            else
+                desc += `, on day ${dom} of the month`;
+        }
+        if (mon !== "*") {
+            if (mon.startsWith("*/"))
+                desc += `, every ${mon.substring(2)} months`;
+            else
+                desc += `, in month ${mon}`;
+        }
+        if (dow !== "*") {
+            const days = [
+                "Sunday",
+                "Monday",
+                "Tuesday",
+                "Wednesday",
+                "Thursday",
+                "Friday",
+                "Saturday",
+                "Sunday",
+            ];
+            let dayStr = dow;
+            if (dow.length === 1 && /[0-7]/.test(dow)) {
+                dayStr = days[parseInt(dow, 10)];
+            }
+            else if (dow.includes("-") && /[0-7]-[0-7]/.test(dow)) {
+                dayStr = dow
+                    .split("-")
+                    .map((d) => days[parseInt(d, 10)])
+                    .join(" through ");
+            }
+            desc += `, on ${dayStr}`;
+        }
+        return { valid: true, text: desc + "." };
+    }
+    _generateOutput(silent = false) {
+        let output = "";
+        this._customCronError = "";
+        this._customCronText = "";
+        this._internals.setValidity({});
+        if (this._frequency === "custom") {
+            const analysis = this._translateCron(this._customCron);
+            if (!analysis.valid) {
+                this._customCronError = analysis.text;
+                this._internals.setValidity({ customError: true }, analysis.text);
+            }
+            else {
+                this._customCronText = analysis.text;
+            }
+            output = this._customCron;
+        }
+        else if (this._frequency === "one-off") {
+            output = `${this._date}T${this._time}`;
+        }
+        else {
+            const [hh, mm] = this._time.split(":");
+            const minute = mm ? parseInt(mm, 10).toString() : "0";
+            const hour = hh ? parseInt(hh, 10).toString() : "0";
+            switch (this._frequency) {
+                case "daily":
+                    output = `${minute} ${hour} * * *`;
+                    break;
+                case "weekly":
+                    const safeDays = this._days || "1";
+                    output = `${minute} ${hour} * * ${safeDays}`;
+                    break;
+                case "monthly":
+                    output = `${minute} ${hour} ${this._monthDay} * *`;
+                    break;
+            }
+        }
+        this._lastGeneratedOutput = output;
+        this.value = output;
+        this._internals.setFormValue(output);
+        // Only dispatch if the user actually clicked/typed something
+        if (!silent) {
+            this.dispatchEvent(new Event("change", { bubbles: true, composed: true }));
+        }
+    }
+    _handleCustomCronInput(e) {
+        const inputEl = e.target;
+        const sanitized = inputEl.value.replace(/[^0-9A-Za-z\s\*\/\-\,]/g, "");
+        if (inputEl.value !== sanitized) {
+            inputEl.value = sanitized;
+        }
+        this._customCron = sanitized;
+        this._generateOutput();
+    }
+    _handleFrequencyChange(e) {
+        this._frequency = e.target.value;
+        this._generateOutput();
+    }
+    checkValidity() {
+        return this._internals.checkValidity();
+    }
+    reportValidity() {
+        return this._internals.reportValidity();
+    }
+    formResetCallback() {
+        this.value = this._defaultValue;
+        this._frequency = "weekly";
+        this._generateOutput();
+    }
+    render() {
+        const frequencyOptions = [
+            { label: "One-Off Execution", value: "one-off" },
+            { label: "Daily", value: "daily" },
+            { label: "Weekly", value: "weekly" },
+            { label: "Monthly", value: "monthly" },
+            { label: "Custom Cron", value: "custom" },
+        ];
+        const monthDayOptions = Array.from({ length: 31 }, (_, i) => ({
+            label: `${i + 1}${i === 0 ? "st" : i === 1 ? "nd" : i === 2 ? "rd" : "th"}`,
+            value: String(i + 1),
+        }));
+        // Calculate which segment the user is currently typing in
+        const activeSegmentIndex = Math.min(this._customCron.trimStart().split(/\s+/).length - 1, 4);
+        return html `
+      <div class="builder-grid">
+        <div class="row">
+          <st-select
+            label="Schedule Type"
+            .options=${frequencyOptions}
+            .value=${this._frequency}
+            @change=${this._handleFrequencyChange}
+          ></st-select>
+        </div>
+
+        ${this._frequency === "weekly"
+            ? html `
+              <div class="row">
+                <label>Run on days</label>
+                <st-toggle-group
+                  multiple
+                  .value=${this._days}
+                  @change=${(e) => {
+                this._days = e.target.value;
+                this._generateOutput();
+            }}
+                >
+                  <st-toggle-button value="1">Mon</st-toggle-button>
+                  <st-toggle-button value="2">Tue</st-toggle-button>
+                  <st-toggle-button value="3">Wed</st-toggle-button>
+                  <st-toggle-button value="4">Thu</st-toggle-button>
+                  <st-toggle-button value="5">Fri</st-toggle-button>
+                  <st-toggle-button value="6">Sat</st-toggle-button>
+                  <st-toggle-button value="0">Sun</st-toggle-button>
+                </st-toggle-group>
+              </div>
+            `
+            : ""}
+        ${this._frequency === "monthly"
+            ? html `
+              <div class="row">
+                <st-select
+                  label="Run on day of month"
+                  .options=${monthDayOptions}
+                  .value=${this._monthDay}
+                  @change=${(e) => {
+                this._monthDay = e.target.value;
+                this._generateOutput();
+            }}
+                ></st-select>
+              </div>
+            `
+            : ""}
+        ${this._frequency === "one-off"
+            ? html `
+              <div class="row">
+                <label>Execution Date</label>
+                <st-calendar
+                  .value=${this._date}
+                  @change=${(e) => {
+                this._date = e.target.value;
+                this._generateOutput();
+            }}
+                ></st-calendar>
+              </div>
+            `
+            : ""}
+        ${this._frequency === "custom"
+            ? html `
+              <div class="row">
+                <st-input
+                  label="Raw Cron Expression"
+                  placeholder="*/15 * * * *"
+                  .value=${this._customCron}
+                  .error=${this._customCronError}
+                  ?invalid=${!!this._customCronError}
+                  @input=${this._handleCustomCronInput}
+                ></st-input>
+                <div class="cron-segments" aria-hidden="true">
+                  ${["Minute", "Hour", "Day", "Month", "Weekday"].map((label, i) => html `
+                      <div class="segment-badge ${activeSegmentIndex === i ? "active" : ""}">
+                        ${label}
+                      </div>
+                    `)}
+                </div>
+
+                ${this._customCronText && !this._customCronError
+                ? html `
+                      <div class="helper-text success-text">
+                        <strong>Schedule:</strong> ${this._customCronText}
+                      </div>
+                    `
+                : ""}
+              </div>
+            `
+            : ""}
+        ${this._frequency !== "custom"
+            ? html `
+              <div class="row">
+                <st-time-picker
+                  label="Execution Time"
+                  .value=${this._time}
+                  @change=${(e) => {
+                this._time = e.target.value;
+                this._generateOutput();
+            }}
+                ></st-time-picker>
+              </div>
+            `
+            : ""}
+
+        <div class="output-preview">
+          <div class="helper-text">Generated Payload</div>
+          <code>${this.value}</code>
+        </div>
+      </div>
+    `;
+    }
+};
+StCronBuilder.formAssociated = true;
+StCronBuilder.styles = [
+    resetStyles,
+    css `
+      :host {
+        display: block;
+        background: var(--st-color-surface);
+        border: 1px solid var(--st-color-border);
+        border-radius: var(--st-radius-lg);
+        padding: var(--st-spacing-lg);
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+      }
+
+      .builder-grid {
+        display: flex;
+        flex-direction: column;
+        gap: var(--st-spacing-lg);
+      }
+
+      .row {
+        display: flex;
+        flex-direction: column;
+        gap: var(--st-spacing-xs);
+      }
+
+      label {
+        font-size: var(--st-font-size-sm);
+        font-weight: 600;
+        color: var(--st-color-text);
+      }
+
+      .helper-text {
+        font-size: var(--st-font-size-xs);
+        color: var(--st-color-text-muted);
+        margin-top: 4px;
+      }
+
+      .cron-segments {
+        display: flex;
+        gap: 4px;
+        margin-top: var(--st-spacing-xs);
+        margin-bottom: var(--st-spacing-xs);
+      }
+
+      .segment-badge {
+        flex: 1;
+        text-align: center;
+        font-size: 11px;
+        padding: 4px;
+        background: var(--st-color-surface-muted, #f1f5f9);
+        border-radius: var(--st-radius-sm);
+        color: var(--st-color-text-muted);
+        border: 1px solid var(--st-color-border);
+        transition: all 0.2s;
+      }
+
+      .segment-badge.active {
+        background: var(--st-color-primary, #eff6ff);
+        color: var(--st-color-surface);
+        border-color: var(--st-color-primary);
+        font-weight: 600;
+      }
+
+      .success-text {
+        color: var(--st-color-success, #16a34a);
+      }
+
+      .error-text {
+        color: var(--st-color-danger, #dc2626);
+        font-weight: 500;
+      }
+
+      .output-preview {
+        margin-top: var(--st-spacing-md);
+        padding: var(--st-spacing-md);
+        background: var(--st-color-surface-muted, #f8fafc);
+        border-radius: var(--st-radius-md);
+        border: 1px dashed var(--st-color-border);
+      }
+
+      .output-preview code {
+        font-family: monospace;
+        color: var(--st-color-primary);
+        font-weight: bold;
+        font-size: var(--st-font-size-lg);
+      }
+    `,
+];
+__decorate([
+    property({ type: String, reflect: true })
+], StCronBuilder.prototype, "name", void 0);
+__decorate([
+    property({ type: String })
+], StCronBuilder.prototype, "value", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], StCronBuilder.prototype, "required", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_frequency", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_time", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_days", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_monthDay", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_date", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_customCron", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_customCronError", void 0);
+__decorate([
+    state()
+], StCronBuilder.prototype, "_customCronText", void 0);
+StCronBuilder = __decorate([
+    customElement("st-cron-builder")
+], StCronBuilder);
+export { StCronBuilder };
+//# sourceMappingURL=cron-builder.js.map

package/dist/components/cron-builder/cron-builder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cron-builder.js","sourceRoot":"","sources":["../../../src/components/cron-builder/cron-builder.ts"],"names":[],"mappings":"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"}

package/dist/components/input/input.d.ts

@@ -18,6 +18,7 @@ export declare class StInput extends LitElement {
     placeholder: string;
     type: InputType;
     helpText: string;
+    error: string;
     autocomplete?: string;
     required: boolean;
     minlength?: number;

package/dist/components/input/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAa,cAAc,EAAC,MAAM,KAAK,CAAC;AAK1D,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;AAEpF,qBACa,OAAQ,SAAQ,UAAU;IACrC,MAAM,CAAC,cAAc,UAAQ;IAC7B,MAAM,CAAC,iBAAiB;;;;;;;MAA2D;IACnF,OAAO,CAAC,UAAU,CAAmB;IAErB,OAAO,CAAC,QAAQ,CAAoB;IACX,IAAI,SAAM;IACzB,KAAK,SAAM;IACX,KAAK,SAAM;IACX,WAAW,SAAM;IACjB,IAAI,EAAE,SAAS,CAAU;IACf,QAAQ,SAAM;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IAER,QAAQ,UAAS;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IAED,QAAQ,UAAS;IACjB,OAAO,UAAS;IAChB,QAAQ,UAAS;IAE3D,cAWC;IAED,MAAM,CAAC,MAAM,4BAmGX;IAEO,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,QAOvD;IAED,OAAO,CAAC,aAAa;IASrB,iBAAiB,SAIhB;IAED,aAAa,YAEZ;IAED,cAAc,YAEb;IAED,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,aAAa;IAIvB,MAAM,yCA4CH;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAa,cAAc,EAAC,MAAM,KAAK,CAAC;AAK1D,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;AAEpF,qBACa,OAAQ,SAAQ,UAAU;IACrC,MAAM,CAAC,cAAc,UAAQ;IAC7B,MAAM,CAAC,iBAAiB;;;;;;;MAA2D;IACnF,OAAO,CAAC,UAAU,CAAmB;IAErB,OAAO,CAAC,QAAQ,CAAoB;IACX,IAAI,SAAM;IACzB,KAAK,SAAM;IACX,KAAK,SAAM;IACX,WAAW,SAAM;IACjB,IAAI,EAAE,SAAS,CAAU;IACf,QAAQ,SAAM;IACxB,KAAK,SAAM;IACT,YAAY,CAAC,EAAE,MAAM,CAAC;IAER,QAAQ,UAAS;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IAED,QAAQ,UAAS;IACjB,OAAO,UAAS;IAChB,QAAQ,UAAS;IAE3D,cAWC;IAED,MAAM,CAAC,MAAM,4BA2GX;IAEO,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,QAUvD;IAED,OAAO,CAAC,aAAa;IAoBrB,iBAAiB,SAIhB;IAED,aAAa,YAEZ;IAED,cAAc,YAEb;IAED,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,aAAa;IAIrB,MAAM,yCA6CL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}

package/dist/components/input/input.js

@@ -17,13 +17,14 @@ let StInput = class StInput extends LitElement {
         this.placeholder = "";
         this.type = "text";
         this.helpText = "";
+        this.error = "";
         this.required = false;
         this.disabled = false;
         this.invalid = false;
         this.readonly = false;
         this._internals = this.attachInternals();
         this.addEventListener("focusout", () => {
-            this.invalid = !this._inputEl.validity.valid;
+            this.invalid = !!this.error || !this._inputEl.validity.valid;
         });
         this.addEventListener("invalid", () => {
             this.invalid = true;
@@ -34,12 +35,22 @@ let StInput = class StInput extends LitElement {
         if (changedProperties.has("value")) {
             this._internals.setFormValue(this.value);
         }
-        this._syncValidity();
+        if (changedProperties.has("value") || changedProperties.has("error") || changedProperties.has("required")) {
+            this._syncValidity();
+        }
     }
     _syncValidity() {
         if (!this._inputEl)
             return;
+        if (this.error) {
+            this._internals.setValidity({ customError: true }, this.error, this._inputEl);
+            this.invalid = true;
+            return;
+        }
         this._internals.setValidity(this._inputEl.validity, this._inputEl.validationMessage, this._inputEl);
+        if (this.invalid && this._inputEl.validity.valid) {
+            this.invalid = false;
+        }
     }
     formResetCallback() {
         this.value = "";
@@ -55,7 +66,7 @@ let StInput = class StInput extends LitElement {
     _handleInput(e) {
         const target = e.target;
         this.value = target.value;
-        if (this.invalid && target.validity.valid) {
+        if (this.invalid && target.validity.valid && !this.error) {
             this.invalid = false;
         }
         this.dispatchEvent(new Event("input", { bubbles: true, composed: true }));
@@ -64,8 +75,7 @@ let StInput = class StInput extends LitElement {
         this.dispatchEvent(new Event("change", { bubbles: true, composed: true }));
     }
     render() {
-        const helpTextId = this.helpText ? "help-text" : undefined;
-        // Security: Prevent OS/Extensions from logging sensitive data via spellcheck
+        const descriptionId = this.error ? "error-text" : (this.helpText ? "help-text" : undefined);
         const isSensitive = this.type === "password" || this.type === "email";
         const safeSpellcheck = isSensitive ? "false" : undefined;
         const safeAutocapitalize = isSensitive ? "none" : undefined;
@@ -92,7 +102,7 @@ let StInput = class StInput extends LitElement {
             spellcheck=${ifDefined(safeSpellcheck)}
             autocapitalize=${ifDefined(safeAutocapitalize)}
             aria-invalid=${this.invalid ? "true" : "false"}
-            aria-describedby=${ifDefined(helpTextId)}
+            aria-describedby=${ifDefined(descriptionId)}
             @input=${this._handleInput}
             @change=${this._handleChange}
           />
@@ -100,9 +110,11 @@ let StInput = class StInput extends LitElement {
           <slot name="suffix"></slot>
         </div>
 
-        ${this.helpText
-            ? html `<div id="help-text" class="help-text">${this.helpText}</div>`
-            : ""}
+        ${this.error
+            ? html `<div id="error-text" class="error-text">${this.error}</div>`
+            : this.helpText
+                ? html `<div id="help-text" class="help-text">${this.helpText}</div>`
+                : ""}
       </div>
     `;
     }
@@ -182,16 +194,24 @@ StInput.styles = [
         margin: 0;
       }
 
+      /* 🚀 NEW: Explicit error text styling */
+      .error-text {
+        font-size: var(--st-font-size-xs);
+        color: var(--st-color-error, #dc2626);
+        margin: 0;
+        font-weight: 500;
+      }
+
       :host([invalid]) .input-wrapper {
-        border-color: var(--st-color-error);
+        border-color: var(--st-color-error, #dc2626);
       }
 
       :host([invalid]) .input-wrapper:focus-within {
-        box-shadow: 0 0 0 1px var(--st-color-error);
+        box-shadow: 0 0 0 1px var(--st-color-error, #dc2626);
       }
 
       :host([invalid]) .help-text {
-        color: var(--st-color-error);
+        color: var(--st-color-error, #dc2626);
       }
 
       :host([disabled]) .input-wrapper {
@@ -230,6 +250,9 @@ __decorate([
 __decorate([
     property({ attribute: "help-text" })
 ], StInput.prototype, "helpText", void 0);
+__decorate([
+    property({ type: String })
+], StInput.prototype, "error", void 0);
 __decorate([
     property({ type: String })
 ], StInput.prototype, "autocomplete", void 0);