@govtechsg/sgds-web-component 1.1.0 → 1.2.1

package/components/Input/sgds-input.cjs.js

@@ -59,6 +59,7 @@ class SgdsInput extends sgdsElement["default"] {
         this.valid = false;
         /**@internal */
         this.inputId = generateId["default"]("input", this.type);
+        this.labelId = generateId["default"]("label");
     }
     /** Sets focus on the input. */
     focus(options) {
@@ -141,10 +142,12 @@ class SgdsInput extends sgdsElement["default"] {
         @invalid=${() => this.setInvalid(true)}
         @focus=${this._handleFocus}
         @blur=${this._handleBlur}
+        aria-describedby=${ifDefined_js.ifDefined(this.invalid && this.hasFeedback ? `${this.inputId}-invalid` : undefined)}
+        aria-labelledby="${this.labelId} ${this.inputId}Help ${this.invalid && this.hasFeedback
+            ? `${this.inputId}-invalid`
+            : ""}"
       />
-      ${this.hasFeedback
-            ? staticHtml_js.html `<div id="${this.inputId}-invalid" class="invalid-feedback">${this.invalidFeedback}</div>`
-            : ""} `;
+      ${this._renderFeedback()} `;
     }
     _renderFeedback() {
         return this.hasFeedback
@@ -152,7 +155,9 @@ class SgdsInput extends sgdsElement["default"] {
             : "";
     }
     _renderLabel() {
-        const labelTemplate = staticHtml_js.html ` <label for=${this.inputId} class="form-label">${this.label}</label> `;
+        const labelTemplate = staticHtml_js.html `
+      <label for=${this.inputId} id=${this.labelId} class="form-label">${this.label}</label>
+    `;
         return this.label && labelTemplate;
     }
     _renderHintText() {

package/components/Input/sgds-input.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-input.cjs.js","sources":["../../../src/components/Input/sgds-input.ts"],"sourcesContent":["import { property, query, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { live } from \"lit/directives/live.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { defaultValue } from \"../../utils/defaultvalue\";\nimport type { SgdsFormControl } from \"../../utils/form\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\n\n/**\n * @summary Text inputs allow your users to enter letters, numbers and symbols on a single line.\n *\n * @event sgds-change - Emitted when an alteration to the control's value is committed by the user.\n * @event sgds-input - Emitted when the control receives input and its value changes.\n * @event sgds-focus - Emitted when input is in focus.\n * @event sgds-blur - Emitted when input is not in focus.\n *\n */\nexport class SgdsInput extends SgdsElement implements SgdsFormControl {\n  static styles = SgdsElement.styles;\n  /**@internal */\n  @query(\"input.form-control\") input: HTMLInputElement;\n  /**@internal */\n  protected readonly formSubmitController = new FormSubmitController(this);\n  /** The type of input which works the same as HTMLInputElement*/\n  @property({ reflect: true }) type:\n    | \"date\"\n    | \"datetime-local\"\n    | \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\" = \"text\";\n  /** The input's label  */\n  @property({ reflect: true }) label = \"\";\n  /** The input's hint text below the label */\n  @property({ reflect: true }) hintText = \"\";\n  /**The input's name attribute */\n  @property({ reflect: true }) name: string;\n  /**Forwards classes to the native HTMLInputElement of the component. Can be used to insert any classes from bootstrap such as mt-2 */\n  @property({ reflect: true }) inputClasses: string;\n  /**Optional. Pass svg html of icons in string form*/\n  @property({ type: String }) icon: string;\n  /**Sets the minimum length of the input */\n  @property({ type: Number, reflect: true }) minlength: number;\n  /**Sets the maximum length of the input */\n  @property({ type: Number, reflect: true }) maxlength: number;\n  /**The input's placeholder text. */\n  @property({ type: String, reflect: true }) placeholder = \"placeholder\";\n  /**A pattern to validate input against. */\n  @property({ type: String }) pattern: string;\n  /**Autofocus the input */\n  @property({ type: Boolean, reflect: true }) autofocus = false;\n  /**Disables the input. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  /**Makes the input a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n  /**Makes the input readonly. */\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**The input's value attribute. */\n  @property({ reflect: true }) value = \"\";\n  /**Gets or sets the default value used to reset this element. The initial value corresponds to the one originally specified in the HTML that created this element. */\n  @defaultValue()\n  defaultValue = \"\";\n\n  /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n  @property({ type: Boolean, reflect: true }) hasFeedback = false;\n  /**Feedback text for error state when validated */\n  @property({ type: String, reflect: true }) invalidFeedback = \"\";\n\n  /**@internal */\n  @state() invalid = false;\n  /**@internal */\n  @state() valid = false;\n\n  /**@internal */\n  protected inputId: string = genId(\"input\", this.type);\n\n  /** Sets focus on the input. */\n  public focus(options?: FocusOptions) {\n    this.input.focus(options);\n  }\n  /** Sets blur on the input. */\n  public blur() {\n    this.input.blur();\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  public reportValidity() {\n    return this.input.reportValidity();\n  }\n  public setCustomValidity(err: string) {\n    return this.input.setCustomValidity(err);\n  }\n  public setInvalid(bool: boolean) {\n    this.invalid = bool;\n  }\n  protected _handleChange(event: string) {\n    this.value = this.input.value;\n    this.emit(event);\n  }\n\n  protected _handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  protected _handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  protected _handleKeyDown(event: KeyboardEvent) {\n    const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n    // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n    // submitting to allow users to cancel the keydown event if they need to\n    if (event.key === \"Enter\" && !hasModifier) {\n      setTimeout(() => {\n        // Prevent submission when enter is click on a submission in an Input Method Editor with isComposing\n        if (!event.defaultPrevented && !event.isComposing) {\n          this.formSubmitController.submit();\n        }\n      });\n    }\n  }\n\n  @watch(\"disabled\", { waitUntilFirstUpdate: true })\n  _handleDisabledChange() {\n    // Disabled form controls are always valid, so we need to recheck validity when the state changes\n    this.input.disabled = this.disabled;\n    this.invalid = !this.input.checkValidity();\n  }\n\n  @watch(\"value\", { waitUntilFirstUpdate: true })\n  _handleValueChange() {\n    this.invalid = !this.input.checkValidity();\n    this.valid = this.input.checkValidity();\n    // remove validation for input that is not required, is already dirty and has empty value\n    if (!this.required && this.value === \"\") {\n      this.valid = false;\n    }\n  }\n  protected _renderInput() {\n    return html`<input\n        class=${classMap({\n          \"form-control\": true,\n          \"is-invalid\": this.hasFeedback && this.invalid,\n          \"is-valid\": this.hasFeedback && this.valid,\n          [`${this.inputClasses}`]: this.inputClasses\n        })}\n        type=${this.type}\n        id=${this.inputId}\n        name=${ifDefined(this.name)}\n        placeholder=${ifDefined(this.placeholder)}\n        aria-invalid=${this.invalid ? \"true\" : \"false\"}\n        pattern=${ifDefined(this.pattern)}\n        ?autofocus=${this.autofocus}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        ?required=${this.required}\n        .value=${live(this.value)}\n        minlength=${ifDefined(this.minlength)}\n        maxlength=${ifDefined(this.maxlength)}\n        @input=${() => this._handleChange(\"sgds-input\")}\n        @change=${() => this._handleChange(\"sgds-change\")}\n        @keydown=${this._handleKeyDown}\n        @invalid=${() => this.setInvalid(true)}\n        @focus=${this._handleFocus}\n        @blur=${this._handleBlur}\n      />\n      ${this.hasFeedback\n        ? html`<div id=\"${this.inputId}-invalid\" class=\"invalid-feedback\">${this.invalidFeedback}</div>`\n        : \"\"} `;\n  }\n  protected _renderFeedback() {\n    return this.hasFeedback\n      ? html`<div id=\"${this.inputId}-invalid\" class=\"invalid-feedback\">${this.invalidFeedback}</div>`\n      : \"\";\n  }\n  protected _renderLabel() {\n    const labelTemplate = html` <label for=${this.inputId} class=\"form-label\">${this.label}</label> `;\n    return this.label && labelTemplate;\n  }\n  protected _renderHintText() {\n    const hintTextTemplate = html`\n      <small id=\"${this.inputId}Help\" class=\"text-muted form-text\">${this.hintText}</small>\n    `;\n    return this.hintText && hintTextTemplate;\n  }\n  render() {\n    const input = html`${this._renderInput()}`;\n    // if iconName is defined\n    const inputWithIcon = html`\n      <div class=\"sgds form-control-group ${this.inputClasses}\">\n        <span class=\"form-control-icon\"> ${unsafeSVG(this.icon)} </span>\n        ${input}\n      </div>\n    `;\n    // if hintText is defined\n\n    return html`\n      <div class=\"d-flex flex-column w-100\">\n        ${html`${this._renderLabel()} ${this._renderHintText()} ${this.icon ? inputWithIcon : input} `}\n      </div>\n    `;\n  }\n}\n\nexport default SgdsInput;\n"],"names":["SgdsElement","FormSubmitController","genId","html","classMap","ifDefined","live","unsafeSVG","__decorate","query","property","defaultValue","state","watch"],"mappings":"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"}
+{"version":3,"file":"sgds-input.cjs.js","sources":["../../../src/components/Input/sgds-input.ts"],"sourcesContent":["import { property, query, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { live } from \"lit/directives/live.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { defaultValue } from \"../../utils/defaultvalue\";\nimport type { SgdsFormControl } from \"../../utils/form\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\n\n/**\n * @summary Text inputs allow your users to enter letters, numbers and symbols on a single line.\n *\n * @event sgds-change - Emitted when an alteration to the control's value is committed by the user.\n * @event sgds-input - Emitted when the control receives input and its value changes.\n * @event sgds-focus - Emitted when input is in focus.\n * @event sgds-blur - Emitted when input is not in focus.\n *\n */\nexport class SgdsInput extends SgdsElement implements SgdsFormControl {\n  static styles = SgdsElement.styles;\n  /**@internal */\n  @query(\"input.form-control\") input: HTMLInputElement;\n  /**@internal */\n  protected readonly formSubmitController = new FormSubmitController(this);\n  /** The type of input which works the same as HTMLInputElement*/\n  @property({ reflect: true }) type:\n    | \"date\"\n    | \"datetime-local\"\n    | \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\" = \"text\";\n  /** The input's label  */\n  @property({ reflect: true }) label = \"\";\n  /** The input's hint text below the label */\n  @property({ reflect: true }) hintText = \"\";\n  /**The input's name attribute */\n  @property({ reflect: true }) name: string;\n  /**Forwards classes to the native HTMLInputElement of the component. Can be used to insert any classes from bootstrap such as mt-2 */\n  @property({ reflect: true }) inputClasses: string;\n  /**Optional. Pass svg html of icons in string form*/\n  @property({ type: String }) icon: string;\n  /**Sets the minimum length of the input */\n  @property({ type: Number, reflect: true }) minlength: number;\n  /**Sets the maximum length of the input */\n  @property({ type: Number, reflect: true }) maxlength: number;\n  /**The input's placeholder text. */\n  @property({ type: String, reflect: true }) placeholder = \"placeholder\";\n  /**A pattern to validate input against. */\n  @property({ type: String }) pattern: string;\n  /**Autofocus the input */\n  @property({ type: Boolean, reflect: true }) autofocus = false;\n  /**Disables the input. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  /**Makes the input a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n  /**Makes the input readonly. */\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**The input's value attribute. */\n  @property({ reflect: true }) value = \"\";\n  /**Gets or sets the default value used to reset this element. The initial value corresponds to the one originally specified in the HTML that created this element. */\n  @defaultValue()\n  defaultValue = \"\";\n\n  /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n  @property({ type: Boolean, reflect: true }) hasFeedback = false;\n  /**Feedback text for error state when validated */\n  @property({ type: String, reflect: true }) invalidFeedback = \"\";\n\n  /**@internal */\n  @state() invalid = false;\n  /**@internal */\n  @state() valid = false;\n\n  /**@internal */\n  protected inputId: string = genId(\"input\", this.type);\n\n  protected labelId: string = genId(\"label\");\n\n  /** Sets focus on the input. */\n  public focus(options?: FocusOptions) {\n    this.input.focus(options);\n  }\n  /** Sets blur on the input. */\n  public blur() {\n    this.input.blur();\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  public reportValidity() {\n    return this.input.reportValidity();\n  }\n  public setCustomValidity(err: string) {\n    return this.input.setCustomValidity(err);\n  }\n  public setInvalid(bool: boolean) {\n    this.invalid = bool;\n  }\n  protected _handleChange(event: string) {\n    this.value = this.input.value;\n    this.emit(event);\n  }\n\n  protected _handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  protected _handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  protected _handleKeyDown(event: KeyboardEvent) {\n    const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n    // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n    // submitting to allow users to cancel the keydown event if they need to\n    if (event.key === \"Enter\" && !hasModifier) {\n      setTimeout(() => {\n        // Prevent submission when enter is click on a submission in an Input Method Editor with isComposing\n        if (!event.defaultPrevented && !event.isComposing) {\n          this.formSubmitController.submit();\n        }\n      });\n    }\n  }\n\n  @watch(\"disabled\", { waitUntilFirstUpdate: true })\n  _handleDisabledChange() {\n    // Disabled form controls are always valid, so we need to recheck validity when the state changes\n    this.input.disabled = this.disabled;\n    this.invalid = !this.input.checkValidity();\n  }\n\n  @watch(\"value\", { waitUntilFirstUpdate: true })\n  _handleValueChange() {\n    this.invalid = !this.input.checkValidity();\n    this.valid = this.input.checkValidity();\n    // remove validation for input that is not required, is already dirty and has empty value\n    if (!this.required && this.value === \"\") {\n      this.valid = false;\n    }\n  }\n  protected _renderInput() {\n    return html`<input\n        class=${classMap({\n          \"form-control\": true,\n          \"is-invalid\": this.hasFeedback && this.invalid,\n          \"is-valid\": this.hasFeedback && this.valid,\n          [`${this.inputClasses}`]: this.inputClasses\n        })}\n        type=${this.type}\n        id=${this.inputId}\n        name=${ifDefined(this.name)}\n        placeholder=${ifDefined(this.placeholder)}\n        aria-invalid=${this.invalid ? \"true\" : \"false\"}\n        pattern=${ifDefined(this.pattern)}\n        ?autofocus=${this.autofocus}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        ?required=${this.required}\n        .value=${live(this.value)}\n        minlength=${ifDefined(this.minlength)}\n        maxlength=${ifDefined(this.maxlength)}\n        @input=${() => this._handleChange(\"sgds-input\")}\n        @change=${() => this._handleChange(\"sgds-change\")}\n        @keydown=${this._handleKeyDown}\n        @invalid=${() => this.setInvalid(true)}\n        @focus=${this._handleFocus}\n        @blur=${this._handleBlur}\n        aria-describedby=${ifDefined(this.invalid && this.hasFeedback ? `${this.inputId}-invalid` : undefined)}\n        aria-labelledby=\"${this.labelId} ${this.inputId}Help ${this.invalid && this.hasFeedback\n          ? `${this.inputId}-invalid`\n          : \"\"}\"\n      />\n      ${this._renderFeedback()} `;\n  }\n  protected _renderFeedback() {\n    return this.hasFeedback\n      ? html`<div id=\"${this.inputId}-invalid\" class=\"invalid-feedback\">${this.invalidFeedback}</div>`\n      : \"\";\n  }\n  protected _renderLabel() {\n    const labelTemplate = html`\n      <label for=${this.inputId} id=${this.labelId} class=\"form-label\">${this.label}</label>\n    `;\n    return this.label && labelTemplate;\n  }\n  protected _renderHintText() {\n    const hintTextTemplate = html`\n      <small id=\"${this.inputId}Help\" class=\"text-muted form-text\">${this.hintText}</small>\n    `;\n    return this.hintText && hintTextTemplate;\n  }\n  render() {\n    const input = html`${this._renderInput()}`;\n    // if iconName is defined\n    const inputWithIcon = html`\n      <div class=\"sgds form-control-group ${this.inputClasses}\">\n        <span class=\"form-control-icon\"> ${unsafeSVG(this.icon)} </span>\n        ${input}\n      </div>\n    `;\n    // if hintText is defined\n\n    return html`\n      <div class=\"d-flex flex-column w-100\">\n        ${html`${this._renderLabel()} ${this._renderHintText()} ${this.icon ? inputWithIcon : input} `}\n      </div>\n    `;\n  }\n}\n\nexport default SgdsInput;\n"],"names":["SgdsElement","FormSubmitController","genId","html","classMap","ifDefined","live","unsafeSVG","__decorate","query","property","defaultValue","state","watch"],"mappings":"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"}

package/components/Input/sgds-input.d.ts

@@ -58,6 +58,7 @@ export declare class SgdsInput extends SgdsElement implements SgdsFormControl {
     valid: boolean;
     /**@internal */
     protected inputId: string;
+    protected labelId: string;
     /** Sets focus on the input. */
     focus(options?: FocusOptions): void;
     /** Sets blur on the input. */

package/components/Input/sgds-input.js

@@ -55,6 +55,7 @@ class SgdsInput extends SgdsElement {
         this.valid = false;
         /**@internal */
         this.inputId = genId("input", this.type);
+        this.labelId = genId("label");
     }
     /** Sets focus on the input. */
     focus(options) {
@@ -137,10 +138,12 @@ class SgdsInput extends SgdsElement {
         @invalid=${() => this.setInvalid(true)}
         @focus=${this._handleFocus}
         @blur=${this._handleBlur}
+        aria-describedby=${ifDefined(this.invalid && this.hasFeedback ? `${this.inputId}-invalid` : undefined)}
+        aria-labelledby="${this.labelId} ${this.inputId}Help ${this.invalid && this.hasFeedback
+            ? `${this.inputId}-invalid`
+            : ""}"
       />
-      ${this.hasFeedback
-            ? html `<div id="${this.inputId}-invalid" class="invalid-feedback">${this.invalidFeedback}</div>`
-            : ""} `;
+      ${this._renderFeedback()} `;
     }
     _renderFeedback() {
         return this.hasFeedback
@@ -148,7 +151,9 @@ class SgdsInput extends SgdsElement {
             : "";
     }
     _renderLabel() {
-        const labelTemplate = html ` <label for=${this.inputId} class="form-label">${this.label}</label> `;
+        const labelTemplate = html `
+      <label for=${this.inputId} id=${this.labelId} class="form-label">${this.label}</label>
+    `;
         return this.label && labelTemplate;
     }
     _renderHintText() {

package/components/Input/sgds-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-input.js","sources":["../../../src/components/Input/sgds-input.ts"],"sourcesContent":["import { property, query, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { live } from \"lit/directives/live.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { defaultValue } from \"../../utils/defaultvalue\";\nimport type { SgdsFormControl } from \"../../utils/form\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\n\n/**\n * @summary Text inputs allow your users to enter letters, numbers and symbols on a single line.\n *\n * @event sgds-change - Emitted when an alteration to the control's value is committed by the user.\n * @event sgds-input - Emitted when the control receives input and its value changes.\n * @event sgds-focus - Emitted when input is in focus.\n * @event sgds-blur - Emitted when input is not in focus.\n *\n */\nexport class SgdsInput extends SgdsElement implements SgdsFormControl {\n  static styles = SgdsElement.styles;\n  /**@internal */\n  @query(\"input.form-control\") input: HTMLInputElement;\n  /**@internal */\n  protected readonly formSubmitController = new FormSubmitController(this);\n  /** The type of input which works the same as HTMLInputElement*/\n  @property({ reflect: true }) type:\n    | \"date\"\n    | \"datetime-local\"\n    | \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\" = \"text\";\n  /** The input's label  */\n  @property({ reflect: true }) label = \"\";\n  /** The input's hint text below the label */\n  @property({ reflect: true }) hintText = \"\";\n  /**The input's name attribute */\n  @property({ reflect: true }) name: string;\n  /**Forwards classes to the native HTMLInputElement of the component. Can be used to insert any classes from bootstrap such as mt-2 */\n  @property({ reflect: true }) inputClasses: string;\n  /**Optional. Pass svg html of icons in string form*/\n  @property({ type: String }) icon: string;\n  /**Sets the minimum length of the input */\n  @property({ type: Number, reflect: true }) minlength: number;\n  /**Sets the maximum length of the input */\n  @property({ type: Number, reflect: true }) maxlength: number;\n  /**The input's placeholder text. */\n  @property({ type: String, reflect: true }) placeholder = \"placeholder\";\n  /**A pattern to validate input against. */\n  @property({ type: String }) pattern: string;\n  /**Autofocus the input */\n  @property({ type: Boolean, reflect: true }) autofocus = false;\n  /**Disables the input. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  /**Makes the input a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n  /**Makes the input readonly. */\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**The input's value attribute. */\n  @property({ reflect: true }) value = \"\";\n  /**Gets or sets the default value used to reset this element. The initial value corresponds to the one originally specified in the HTML that created this element. */\n  @defaultValue()\n  defaultValue = \"\";\n\n  /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n  @property({ type: Boolean, reflect: true }) hasFeedback = false;\n  /**Feedback text for error state when validated */\n  @property({ type: String, reflect: true }) invalidFeedback = \"\";\n\n  /**@internal */\n  @state() invalid = false;\n  /**@internal */\n  @state() valid = false;\n\n  /**@internal */\n  protected inputId: string = genId(\"input\", this.type);\n\n  /** Sets focus on the input. */\n  public focus(options?: FocusOptions) {\n    this.input.focus(options);\n  }\n  /** Sets blur on the input. */\n  public blur() {\n    this.input.blur();\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  public reportValidity() {\n    return this.input.reportValidity();\n  }\n  public setCustomValidity(err: string) {\n    return this.input.setCustomValidity(err);\n  }\n  public setInvalid(bool: boolean) {\n    this.invalid = bool;\n  }\n  protected _handleChange(event: string) {\n    this.value = this.input.value;\n    this.emit(event);\n  }\n\n  protected _handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  protected _handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  protected _handleKeyDown(event: KeyboardEvent) {\n    const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n    // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n    // submitting to allow users to cancel the keydown event if they need to\n    if (event.key === \"Enter\" && !hasModifier) {\n      setTimeout(() => {\n        // Prevent submission when enter is click on a submission in an Input Method Editor with isComposing\n        if (!event.defaultPrevented && !event.isComposing) {\n          this.formSubmitController.submit();\n        }\n      });\n    }\n  }\n\n  @watch(\"disabled\", { waitUntilFirstUpdate: true })\n  _handleDisabledChange() {\n    // Disabled form controls are always valid, so we need to recheck validity when the state changes\n    this.input.disabled = this.disabled;\n    this.invalid = !this.input.checkValidity();\n  }\n\n  @watch(\"value\", { waitUntilFirstUpdate: true })\n  _handleValueChange() {\n    this.invalid = !this.input.checkValidity();\n    this.valid = this.input.checkValidity();\n    // remove validation for input that is not required, is already dirty and has empty value\n    if (!this.required && this.value === \"\") {\n      this.valid = false;\n    }\n  }\n  protected _renderInput() {\n    return html`<input\n        class=${classMap({\n          \"form-control\": true,\n          \"is-invalid\": this.hasFeedback && this.invalid,\n          \"is-valid\": this.hasFeedback && this.valid,\n          [`${this.inputClasses}`]: this.inputClasses\n        })}\n        type=${this.type}\n        id=${this.inputId}\n        name=${ifDefined(this.name)}\n        placeholder=${ifDefined(this.placeholder)}\n        aria-invalid=${this.invalid ? \"true\" : \"false\"}\n        pattern=${ifDefined(this.pattern)}\n        ?autofocus=${this.autofocus}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        ?required=${this.required}\n        .value=${live(this.value)}\n        minlength=${ifDefined(this.minlength)}\n        maxlength=${ifDefined(this.maxlength)}\n        @input=${() => this._handleChange(\"sgds-input\")}\n        @change=${() => this._handleChange(\"sgds-change\")}\n        @keydown=${this._handleKeyDown}\n        @invalid=${() => this.setInvalid(true)}\n        @focus=${this._handleFocus}\n        @blur=${this._handleBlur}\n      />\n      ${this.hasFeedback\n        ? html`<div id=\"${this.inputId}-invalid\" class=\"invalid-feedback\">${this.invalidFeedback}</div>`\n        : \"\"} `;\n  }\n  protected _renderFeedback() {\n    return this.hasFeedback\n      ? html`<div id=\"${this.inputId}-invalid\" class=\"invalid-feedback\">${this.invalidFeedback}</div>`\n      : \"\";\n  }\n  protected _renderLabel() {\n    const labelTemplate = html` <label for=${this.inputId} class=\"form-label\">${this.label}</label> `;\n    return this.label && labelTemplate;\n  }\n  protected _renderHintText() {\n    const hintTextTemplate = html`\n      <small id=\"${this.inputId}Help\" class=\"text-muted form-text\">${this.hintText}</small>\n    `;\n    return this.hintText && hintTextTemplate;\n  }\n  render() {\n    const input = html`${this._renderInput()}`;\n    // if iconName is defined\n    const inputWithIcon = html`\n      <div class=\"sgds form-control-group ${this.inputClasses}\">\n        <span class=\"form-control-icon\"> ${unsafeSVG(this.icon)} </span>\n        ${input}\n      </div>\n    `;\n    // if hintText is defined\n\n    return html`\n      <div class=\"d-flex flex-column w-100\">\n        ${html`${this._renderLabel()} ${this._renderHintText()} ${this.icon ? inputWithIcon : input} `}\n      </div>\n    `;\n  }\n}\n\nexport default SgdsInput;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"sgds-input.js","sources":["../../../src/components/Input/sgds-input.ts"],"sourcesContent":["import { property, query, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { live } from \"lit/directives/live.js\";\nimport { unsafeSVG } from \"lit/directives/unsafe-svg.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { defaultValue } from \"../../utils/defaultvalue\";\nimport type { SgdsFormControl } from \"../../utils/form\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\n\n/**\n * @summary Text inputs allow your users to enter letters, numbers and symbols on a single line.\n *\n * @event sgds-change - Emitted when an alteration to the control's value is committed by the user.\n * @event sgds-input - Emitted when the control receives input and its value changes.\n * @event sgds-focus - Emitted when input is in focus.\n * @event sgds-blur - Emitted when input is not in focus.\n *\n */\nexport class SgdsInput extends SgdsElement implements SgdsFormControl {\n  static styles = SgdsElement.styles;\n  /**@internal */\n  @query(\"input.form-control\") input: HTMLInputElement;\n  /**@internal */\n  protected readonly formSubmitController = new FormSubmitController(this);\n  /** The type of input which works the same as HTMLInputElement*/\n  @property({ reflect: true }) type:\n    | \"date\"\n    | \"datetime-local\"\n    | \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\" = \"text\";\n  /** The input's label  */\n  @property({ reflect: true }) label = \"\";\n  /** The input's hint text below the label */\n  @property({ reflect: true }) hintText = \"\";\n  /**The input's name attribute */\n  @property({ reflect: true }) name: string;\n  /**Forwards classes to the native HTMLInputElement of the component. Can be used to insert any classes from bootstrap such as mt-2 */\n  @property({ reflect: true }) inputClasses: string;\n  /**Optional. Pass svg html of icons in string form*/\n  @property({ type: String }) icon: string;\n  /**Sets the minimum length of the input */\n  @property({ type: Number, reflect: true }) minlength: number;\n  /**Sets the maximum length of the input */\n  @property({ type: Number, reflect: true }) maxlength: number;\n  /**The input's placeholder text. */\n  @property({ type: String, reflect: true }) placeholder = \"placeholder\";\n  /**A pattern to validate input against. */\n  @property({ type: String }) pattern: string;\n  /**Autofocus the input */\n  @property({ type: Boolean, reflect: true }) autofocus = false;\n  /**Disables the input. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  /**Makes the input a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n  /**Makes the input readonly. */\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**The input's value attribute. */\n  @property({ reflect: true }) value = \"\";\n  /**Gets or sets the default value used to reset this element. The initial value corresponds to the one originally specified in the HTML that created this element. */\n  @defaultValue()\n  defaultValue = \"\";\n\n  /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n  @property({ type: Boolean, reflect: true }) hasFeedback = false;\n  /**Feedback text for error state when validated */\n  @property({ type: String, reflect: true }) invalidFeedback = \"\";\n\n  /**@internal */\n  @state() invalid = false;\n  /**@internal */\n  @state() valid = false;\n\n  /**@internal */\n  protected inputId: string = genId(\"input\", this.type);\n\n  protected labelId: string = genId(\"label\");\n\n  /** Sets focus on the input. */\n  public focus(options?: FocusOptions) {\n    this.input.focus(options);\n  }\n  /** Sets blur on the input. */\n  public blur() {\n    this.input.blur();\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  public reportValidity() {\n    return this.input.reportValidity();\n  }\n  public setCustomValidity(err: string) {\n    return this.input.setCustomValidity(err);\n  }\n  public setInvalid(bool: boolean) {\n    this.invalid = bool;\n  }\n  protected _handleChange(event: string) {\n    this.value = this.input.value;\n    this.emit(event);\n  }\n\n  protected _handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  protected _handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  protected _handleKeyDown(event: KeyboardEvent) {\n    const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n    // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n    // submitting to allow users to cancel the keydown event if they need to\n    if (event.key === \"Enter\" && !hasModifier) {\n      setTimeout(() => {\n        // Prevent submission when enter is click on a submission in an Input Method Editor with isComposing\n        if (!event.defaultPrevented && !event.isComposing) {\n          this.formSubmitController.submit();\n        }\n      });\n    }\n  }\n\n  @watch(\"disabled\", { waitUntilFirstUpdate: true })\n  _handleDisabledChange() {\n    // Disabled form controls are always valid, so we need to recheck validity when the state changes\n    this.input.disabled = this.disabled;\n    this.invalid = !this.input.checkValidity();\n  }\n\n  @watch(\"value\", { waitUntilFirstUpdate: true })\n  _handleValueChange() {\n    this.invalid = !this.input.checkValidity();\n    this.valid = this.input.checkValidity();\n    // remove validation for input that is not required, is already dirty and has empty value\n    if (!this.required && this.value === \"\") {\n      this.valid = false;\n    }\n  }\n  protected _renderInput() {\n    return html`<input\n        class=${classMap({\n          \"form-control\": true,\n          \"is-invalid\": this.hasFeedback && this.invalid,\n          \"is-valid\": this.hasFeedback && this.valid,\n          [`${this.inputClasses}`]: this.inputClasses\n        })}\n        type=${this.type}\n        id=${this.inputId}\n        name=${ifDefined(this.name)}\n        placeholder=${ifDefined(this.placeholder)}\n        aria-invalid=${this.invalid ? \"true\" : \"false\"}\n        pattern=${ifDefined(this.pattern)}\n        ?autofocus=${this.autofocus}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        ?required=${this.required}\n        .value=${live(this.value)}\n        minlength=${ifDefined(this.minlength)}\n        maxlength=${ifDefined(this.maxlength)}\n        @input=${() => this._handleChange(\"sgds-input\")}\n        @change=${() => this._handleChange(\"sgds-change\")}\n        @keydown=${this._handleKeyDown}\n        @invalid=${() => this.setInvalid(true)}\n        @focus=${this._handleFocus}\n        @blur=${this._handleBlur}\n        aria-describedby=${ifDefined(this.invalid && this.hasFeedback ? `${this.inputId}-invalid` : undefined)}\n        aria-labelledby=\"${this.labelId} ${this.inputId}Help ${this.invalid && this.hasFeedback\n          ? `${this.inputId}-invalid`\n          : \"\"}\"\n      />\n      ${this._renderFeedback()} `;\n  }\n  protected _renderFeedback() {\n    return this.hasFeedback\n      ? html`<div id=\"${this.inputId}-invalid\" class=\"invalid-feedback\">${this.invalidFeedback}</div>`\n      : \"\";\n  }\n  protected _renderLabel() {\n    const labelTemplate = html`\n      <label for=${this.inputId} id=${this.labelId} class=\"form-label\">${this.label}</label>\n    `;\n    return this.label && labelTemplate;\n  }\n  protected _renderHintText() {\n    const hintTextTemplate = html`\n      <small id=\"${this.inputId}Help\" class=\"text-muted form-text\">${this.hintText}</small>\n    `;\n    return this.hintText && hintTextTemplate;\n  }\n  render() {\n    const input = html`${this._renderInput()}`;\n    // if iconName is defined\n    const inputWithIcon = html`\n      <div class=\"sgds form-control-group ${this.inputClasses}\">\n        <span class=\"form-control-icon\"> ${unsafeSVG(this.icon)} </span>\n        ${input}\n      </div>\n    `;\n    // if hintText is defined\n\n    return html`\n      <div class=\"d-flex flex-column w-100\">\n        ${html`${this._renderLabel()} ${this._renderHintText()} ${this.icon ? inputWithIcon : input} `}\n      </div>\n    `;\n  }\n}\n\nexport default SgdsInput;\n"],"names":[],"mappings":"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"}