@govtechsg/sgds-web-component 3.10.0-rc.3 → 3.10.0

package/react/utils/validatorMixin.js

@@ -10,22 +10,18 @@ import { InputValidationController } from './inputValidationController.js';
  */
 const SgdsFormValidatorMixin = (superClass) => {
     class ToBeValidatedElement extends superClass {
-        constructor(...args) {
-            var _a;
-            super(...args);
+        constructor() {
+            super(...arguments);
             this._isTouched = false;
-            this._internals = this.attachInternals();
+        }
+        connectedCallback() {
+            var _a;
+            super.connectedCallback();
+            if (this._mixinShouldSkipSgdsValidation())
+                return;
             /** Idempotency guarantee */
-            (_a = this.inputValidationController) !== null && _a !== void 0 ? _a : (this.inputValidationController = new InputValidationController(this, this._internals));
+            (_a = this.inputValidationController) !== null && _a !== void 0 ? _a : (this.inputValidationController = new InputValidationController(this));
         }
-        // connectedCallback(): void {
-        //   super.connectedCallback();
-        //   if (this._mixinShouldSkipSgdsValidation()) return;
-        //   console.log('1')
-        //   this._internals = this.attachInternals();
-        //   /** Idempotency guarantee */
-        //   this.inputValidationController ??= new InputValidationController(this, this._internals);
-        // }
         async firstUpdated(changedProperties) {
             super.firstUpdated(changedProperties);
             /* Either input or sgds-input. For example, quantity-toggle uses sgds-input */

package/react/utils/validatorMixin.js.map

@@ -1 +1 @@
-{"version":3,"file":"validatorMixin.js","sources":["../../../src/utils/validatorMixin.ts"],"sourcesContent":["import { LitElement, PropertyValueMap } from \"lit\";\nimport { queryAsync } from \"lit/decorators.js\";\nimport { SgdsInput } from \"../components\";\nimport { InputValidationController } from \"./inputValidationController\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype Constructor<T> = new (...args: any[]) => T;\n\n/**\n * @summary The FormValidationMixin used by the form components\n * @param superClass\n * @returns\n */\nexport const SgdsFormValidatorMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n  class ToBeValidatedElement extends superClass {\n    static formAssociated = true;\n    inputValidationController: InputValidationController;\n    input: HTMLInputElement | SgdsInput | HTMLTextAreaElement;\n    private _isTouched = false;\n    @queryAsync(\"sgds-input\") sgdsInput: Promise<SgdsInput>;\n    @queryAsync(\"sgds-datepicker-input\") sgdsDatepickerInput: Promise<SgdsInput>;\n\n    private _internals: ElementInternals;\n    constructor(...args: any[]) {\n      super(...args);\n      this._internals = this.attachInternals();\n      /** Idempotency guarantee */\n      this.inputValidationController ??= new InputValidationController(this, this._internals);\n    }\n    // connectedCallback(): void {\n    //   super.connectedCallback();\n    //   if (this._mixinShouldSkipSgdsValidation()) return;\n    //   console.log('1')\n    //   this._internals = this.attachInternals();\n    //   /** Idempotency guarantee */\n    //   this.inputValidationController ??= new InputValidationController(this, this._internals);\n\n    // }\n    async firstUpdated(changedProperties: PropertyValueMap<this>) {\n      super.firstUpdated(changedProperties);\n\n      /* Either input or sgds-input. For example, quantity-toggle uses sgds-input */\n      this.input =\n        this.shadowRoot.querySelector(\"input\") ||\n        (await this.sgdsInput) ||\n        this.shadowRoot.querySelector(\"textarea\") ||\n        (await this.sgdsDatepickerInput);\n\n      if (this._mixinShouldSkipSgdsValidation()) return;\n\n      this._mixinSetFormValue();\n\n      this._mixinValidate(this.input);\n    }\n\n    /**\n     * Native lifecycle of Form-Associated Custom Element Callbacks\n     */\n    formResetCallback() {\n      if (this._mixinResetFormControl) {\n        this._mixinResetFormControl();\n      } else {\n        this.value = this.defaultValue;\n        this._mixinResetValidity(this.input);\n      }\n      this._mixinSetFormValue();\n    }\n    /**\n     *\n     * Methods use by classes using this mixin\n     */\n\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run change handler\n     */\n    _mixinHandleChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleChange(e);\n    }\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run input handler\n     */\n    _mixinHandleInputChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleInput(e);\n    }\n    /**\n     * During form resetting,\n     * 1. ValidityState is reset\n     * 2. invalid reactive prop is updated after the reset\n     * 3. Revalidates the ValidityState (but do not update invalid prop)\n     * to prepare for the next validity check\n     * 4. Reset touched state to false for a pristine form\n     */\n    _mixinResetValidity(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.resetValidity();\n      this.inputValidationController.updateInvalidState();\n      this.inputValidationController.validateInput(input);\n      this._isTouched ? (this._isTouched = false) : null;\n    }\n\n    _mixinValidate(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.validateInput(input);\n    }\n    _mixinSetFormValue() {\n      this.inputValidationController.setFormValue();\n    }\n    _mixinCheckValidity(): boolean {\n      return this.inputValidationController.checkValidity();\n    }\n    _mixinReportValidity(): boolean {\n      return this.inputValidationController.reportValidity();\n    }\n    _mixinGetValidity(): ValidityState {\n      return this.inputValidationController.validity;\n    }\n    _mixinGetValidationMessage(): string {\n      return this.inputValidationController.validationMessage;\n    }\n    _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void {\n      return this.inputValidationController.setValidity(flags, message, anchor);\n    }\n    // Only check for noValidate prop\n    _mixinShouldSkipSgdsValidation() {\n      const form = this.closest(\"form\");\n\n      return form?.noValidate || this.noValidate;\n    }\n\n    /** DECLARED INSTANCE METHODS AND PROPERTIES*/\n\n    /**\n     * Resets a form control to its initial state\n     */\n    declare _mixinResetFormControl: () => void;\n    declare value: string;\n    declare defaultValue: string;\n    declare defaultChecked: boolean;\n    declare noValidate: boolean;\n  }\n\n  return ToBeValidatedElement as Constructor<ToBeValidatedElementInterface> & T;\n};\n\nexport declare class ToBeValidatedElementInterface {\n  inputValidationController: InputValidationController;\n  input: HTMLInputElement;\n  _mixinHandleChange(e: Event): void;\n  _mixinHandleInputChange(e: Event): void;\n  _mixinResetValidity(input: HTMLInputElement | SgdsInput): void;\n  _mixinValidate(input: HTMLInputElement | SgdsInput): void;\n  _mixinSetFormValue(): void;\n  _mixinCheckValidity(): boolean;\n  _mixinReportValidity(): boolean;\n  _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;\n  _mixinGetValidity(): ValidityState;\n  _mixinGetValidationMessage(): string;\n  _mixinShouldSkipSgdsValidation(): boolean;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"validatorMixin.js","sources":["../../../src/utils/validatorMixin.ts"],"sourcesContent":["import { LitElement, PropertyValueMap } from \"lit\";\nimport { queryAsync } from \"lit/decorators.js\";\nimport { SgdsInput } from \"../components\";\nimport { InputValidationController } from \"./inputValidationController\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype Constructor<T> = new (...args: any[]) => T;\n\n/**\n * @summary The FormValidationMixin used by the form components\n * @param superClass\n * @returns\n */\nexport const SgdsFormValidatorMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n  class ToBeValidatedElement extends superClass {\n    static formAssociated = true;\n    inputValidationController: InputValidationController;\n    input: HTMLInputElement | SgdsInput | HTMLTextAreaElement;\n    private _isTouched = false;\n    @queryAsync(\"sgds-input\") sgdsInput: Promise<SgdsInput>;\n    @queryAsync(\"sgds-datepicker-input\") sgdsDatepickerInput: Promise<SgdsInput>;\n\n    connectedCallback(): void {\n      super.connectedCallback();\n      if (this._mixinShouldSkipSgdsValidation()) return;\n\n      /** Idempotency guarantee */\n      this.inputValidationController ??= new InputValidationController(this);\n    }\n    async firstUpdated(changedProperties: PropertyValueMap<this>) {\n      super.firstUpdated(changedProperties);\n\n      /* Either input or sgds-input. For example, quantity-toggle uses sgds-input */\n      this.input =\n        this.shadowRoot.querySelector(\"input\") ||\n        (await this.sgdsInput) ||\n        this.shadowRoot.querySelector(\"textarea\") ||\n        (await this.sgdsDatepickerInput);\n\n      if (this._mixinShouldSkipSgdsValidation()) return;\n\n      this._mixinSetFormValue();\n\n      this._mixinValidate(this.input);\n    }\n\n    /**\n     * Native lifecycle of Form-Associated Custom Element Callbacks\n     */\n    formResetCallback() {\n      if (this._mixinResetFormControl) {\n        this._mixinResetFormControl();\n      } else {\n        this.value = this.defaultValue;\n        this._mixinResetValidity(this.input);\n      }\n      this._mixinSetFormValue();\n    }\n    /**\n     *\n     * Methods use by classes using this mixin\n     */\n\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run change handler\n     */\n    _mixinHandleChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleChange(e);\n    }\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run input handler\n     */\n    _mixinHandleInputChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleInput(e);\n    }\n    /**\n     * During form resetting,\n     * 1. ValidityState is reset\n     * 2. invalid reactive prop is updated after the reset\n     * 3. Revalidates the ValidityState (but do not update invalid prop)\n     * to prepare for the next validity check\n     * 4. Reset touched state to false for a pristine form\n     */\n    _mixinResetValidity(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.resetValidity();\n      this.inputValidationController.updateInvalidState();\n      this.inputValidationController.validateInput(input);\n      this._isTouched ? (this._isTouched = false) : null;\n    }\n\n    _mixinValidate(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.validateInput(input);\n    }\n    _mixinSetFormValue() {\n      this.inputValidationController.setFormValue();\n    }\n    _mixinCheckValidity(): boolean {\n      return this.inputValidationController.checkValidity();\n    }\n    _mixinReportValidity(): boolean {\n      return this.inputValidationController.reportValidity();\n    }\n    _mixinGetValidity(): ValidityState {\n      return this.inputValidationController.validity;\n    }\n    _mixinGetValidationMessage(): string {\n      return this.inputValidationController.validationMessage;\n    }\n    _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void {\n      return this.inputValidationController.setValidity(flags, message, anchor);\n    }\n    // Only check for noValidate prop\n    _mixinShouldSkipSgdsValidation() {\n      const form = this.closest(\"form\");\n\n      return form?.noValidate || this.noValidate;\n    }\n\n    /** DECLARED INSTANCE METHODS AND PROPERTIES*/\n\n    /**\n     * Resets a form control to its initial state\n     */\n    declare _mixinResetFormControl: () => void;\n    declare value: string;\n    declare defaultValue: string;\n    declare defaultChecked: boolean;\n    declare noValidate: boolean;\n  }\n\n  return ToBeValidatedElement as Constructor<ToBeValidatedElementInterface> & T;\n};\n\nexport declare class ToBeValidatedElementInterface {\n  inputValidationController: InputValidationController;\n  input: HTMLInputElement;\n  _mixinHandleChange(e: Event): void;\n  _mixinHandleInputChange(e: Event): void;\n  _mixinResetValidity(input: HTMLInputElement | SgdsInput): void;\n  _mixinValidate(input: HTMLInputElement | SgdsInput): void;\n  _mixinSetFormValue(): void;\n  _mixinCheckValidity(): boolean;\n  _mixinReportValidity(): boolean;\n  _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;\n  _mixinGetValidity(): ValidityState;\n  _mixinGetValidationMessage(): string;\n  _mixinShouldSkipSgdsValidation(): boolean;\n}\n"],"names":[],"mappings":"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"}

package/utils/inputValidationController.d.ts

@@ -8,7 +8,7 @@ export declare class InputValidationController implements ReactiveController {
     _internals: ElementInternals;
     validationError: keyof ValidityState;
     options: InputValidationControllerOptions;
-    constructor(host: ReactiveControllerHost & HTMLElement, internals: ElementInternals, options?: Partial<InputValidationControllerOptions>);
+    constructor(host: ReactiveControllerHost & HTMLElement, options?: Partial<InputValidationControllerOptions>);
     hostConnected(): void;
     hostDisconnected(): void;
     /**

package/utils/inputValidationController.js

@@ -2,9 +2,9 @@
  * SGDS custom form validation methods and behaviours
  */
 class InputValidationController {
-    constructor(host, internals, options) {
+    constructor(host, options) {
         (this.host = host).addController(this);
-        this._internals = internals;
+        this._internals = this.host.attachInternals();
         this.options = Object.assign({ setInvalid: (host, value) => {
                 host.invalid = value;
             }, value: (host) => {

package/utils/inputValidationController.js.map

@@ -1 +1 @@
-{"version":3,"file":"inputValidationController.js","sources":["../../src/utils/inputValidationController.ts"],"sourcesContent":["import { ReactiveController, ReactiveControllerHost } from \"lit\";\nimport { SgdsFormControl } from \"./formSubmitController\";\nimport { SgdsCheckbox, SgdsInput } from \"../components\";\n\n/**\n * SGDS custom form validation methods and behaviours\n */\nexport class InputValidationController implements ReactiveController {\n  host: ReactiveControllerHost & HTMLElement;\n  _internals: ElementInternals;\n  validationError: keyof ValidityState;\n  options: InputValidationControllerOptions;\n\n  constructor(\n    host: ReactiveControllerHost & HTMLElement,\n    internals: ElementInternals,\n    options?: Partial<InputValidationControllerOptions>\n  ) {\n    (this.host = host).addController(this);\n    this._internals = internals;\n    this.options = {\n      setInvalid: (host: SgdsFormControl, value: boolean) => {\n        host.invalid = value;\n      },\n      value: (host: SgdsFormControl) => {\n        return host.value;\n      },\n      input: (host: SgdsFormControl) => host.input,\n      ...options\n    };\n  }\n\n  hostConnected(): void {\n    this.host.addEventListener(\"invalid\", e => this.handleInvalid(e));\n  }\n\n  hostDisconnected(): void {\n    this.host.removeEventListener(\"invalid\", e => this.handleInvalid(e));\n  }\n  /**\n   * Prevents the native browser error message pop up when reportValidity() called by\n   * associated form or the component's reportValidity during constraint validation\n   * Sets invalid reactive prop to true\n   */\n  handleInvalid(e: Event) {\n    e.preventDefault();\n    this.options.setInvalid(this.host, true);\n  }\n\n  /**\n   * Sets invalid to false when invoked and\n   * Updates the ValidityState based on new value, but\n   * does not update invalid reactive prop\n   * @param e\n   */\n  handleInput(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.options.setInvalid(this.host, false);\n    this.validateInput(input);\n  }\n  /**\n   * Validate the input's new value after onChange and\n   * update invalid reactive prop\n   * @param e\n   */\n  handleChange(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.validateInput(input);\n    this.options.setInvalid(this.host, !this.checkValidity());\n  }\n\n  get form() {\n    return this._internals.form;\n  }\n\n  get validity() {\n    return this._internals.validity;\n  }\n\n  get validationMessage() {\n    return this._internals.validationMessage;\n  }\n\n  get willValidate() {\n    return this._internals.willValidate;\n  }\n  /**\n   * Checks the validity and updates the invalid reactive prop of form components\n   */\n  updateInvalidState() {\n    this.options.setInvalid(this.host, !this.checkValidity());\n  }\n  /**\n   * Resets the ValidityState of the control\n   */\n  resetValidity() {\n    return this._internals.setValidity({});\n  }\n  /**\n   * Reports the validity\n   */\n  checkValidity(): boolean {\n    return this._internals.checkValidity();\n  }\n  /**\n   * Reports the validity with a error popup message\n   */\n  reportValidity(): boolean {\n    return this._internals.reportValidity();\n  }\n  setValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void {\n    return this._internals.setValidity(flags, message, anchor);\n  }\n  /**\n   * Sets the form control value into FormData,\n   * making the value of control accessible via FormData\n   */\n  setFormValue() {\n    const value = this.options.value(this.host) as string | FormData | File;\n    this._internals.setFormValue(value);\n  }\n  /**\n   * Updates the ValidityState of the input in form component at current state\n   */\n  validateInput(input) {\n    /** When the form control is disabled, its always valid */\n    if (this.options.input(this.host).disabled) {\n      return this._internals.setValidity({});\n    }\n    // get the validity of the internal <input>\n    const validState = input.validity;\n    // if the input is invalid, show the correct error\n    if (!validState.valid) {\n      // loop through the error reasons\n      for (const state in validState) {\n        // if there is an error and corresponding attribute holding\n        // the message\n        if (validState[state]) {\n          this.validationError = state.toString() as keyof ValidityState;\n          // set the validity error reason and the corresponding\n          // message\n          this._internals.setValidity({ [this.validationError]: true }, input.validationMessage, input);\n        }\n      }\n    } else {\n      this._internals.setValidity({});\n    }\n  }\n}\n\nexport interface InputValidationControllerOptions {\n  /** A function that sets the value of host invalid reactive prop */\n  setInvalid: (host: ReactiveControllerHost & HTMLElement, value: boolean) => void;\n  /** A function that gets the value of host value reactive prop */\n  value: (host: ReactiveControllerHost & HTMLElement) => unknown;\n  /** A function that gets the input control of host value reactive prop */\n  input: (host: ReactiveController & HTMLElement) => HTMLInputElement | SgdsInput | SgdsCheckbox;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"inputValidationController.js","sources":["../../src/utils/inputValidationController.ts"],"sourcesContent":["import { ReactiveController, ReactiveControllerHost } from \"lit\";\nimport { SgdsFormControl } from \"./formSubmitController\";\nimport { SgdsCheckbox, SgdsInput } from \"../components\";\n\n/**\n * SGDS custom form validation methods and behaviours\n */\nexport class InputValidationController implements ReactiveController {\n  host: ReactiveControllerHost & HTMLElement;\n  _internals: ElementInternals;\n  validationError: keyof ValidityState;\n  options: InputValidationControllerOptions;\n\n  constructor(host: ReactiveControllerHost & HTMLElement, options?: Partial<InputValidationControllerOptions>) {\n    (this.host = host).addController(this);\n    this._internals = this.host.attachInternals();\n    this.options = {\n      setInvalid: (host: SgdsFormControl, value: boolean) => {\n        host.invalid = value;\n      },\n      value: (host: SgdsFormControl) => {\n        return host.value;\n      },\n      input: (host: SgdsFormControl) => host.input,\n      ...options\n    };\n  }\n\n  hostConnected(): void {\n    this.host.addEventListener(\"invalid\", e => this.handleInvalid(e));\n  }\n\n  hostDisconnected(): void {\n    this.host.removeEventListener(\"invalid\", e => this.handleInvalid(e));\n  }\n  /**\n   * Prevents the native browser error message pop up when reportValidity() called by\n   * associated form or the component's reportValidity during constraint validation\n   * Sets invalid reactive prop to true\n   */\n  handleInvalid(e: Event) {\n    e.preventDefault();\n    this.options.setInvalid(this.host, true);\n  }\n\n  /**\n   * Sets invalid to false when invoked and\n   * Updates the ValidityState based on new value, but\n   * does not update invalid reactive prop\n   * @param e\n   */\n  handleInput(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.options.setInvalid(this.host, false);\n    this.validateInput(input);\n  }\n  /**\n   * Validate the input's new value after onChange and\n   * update invalid reactive prop\n   * @param e\n   */\n  handleChange(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.validateInput(input);\n    this.options.setInvalid(this.host, !this.checkValidity());\n  }\n\n  get form() {\n    return this._internals.form;\n  }\n\n  get validity() {\n    return this._internals.validity;\n  }\n\n  get validationMessage() {\n    return this._internals.validationMessage;\n  }\n\n  get willValidate() {\n    return this._internals.willValidate;\n  }\n  /**\n   * Checks the validity and updates the invalid reactive prop of form components\n   */\n  updateInvalidState() {\n    this.options.setInvalid(this.host, !this.checkValidity());\n  }\n  /**\n   * Resets the ValidityState of the control\n   */\n  resetValidity() {\n    return this._internals.setValidity({});\n  }\n  /**\n   * Reports the validity\n   */\n  checkValidity(): boolean {\n    return this._internals.checkValidity();\n  }\n  /**\n   * Reports the validity with a error popup message\n   */\n  reportValidity(): boolean {\n    return this._internals.reportValidity();\n  }\n  setValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void {\n    return this._internals.setValidity(flags, message, anchor);\n  }\n  /**\n   * Sets the form control value into FormData,\n   * making the value of control accessible via FormData\n   */\n  setFormValue() {\n    const value = this.options.value(this.host) as string | FormData | File;\n    this._internals.setFormValue(value);\n  }\n  /**\n   * Updates the ValidityState of the input in form component at current state\n   */\n  validateInput(input) {\n    /** When the form control is disabled, its always valid */\n    if (this.options.input(this.host).disabled) {\n      return this._internals.setValidity({});\n    }\n    // get the validity of the internal <input>\n    const validState = input.validity;\n    // if the input is invalid, show the correct error\n    if (!validState.valid) {\n      // loop through the error reasons\n      for (const state in validState) {\n        // if there is an error and corresponding attribute holding\n        // the message\n        if (validState[state]) {\n          this.validationError = state.toString() as keyof ValidityState;\n          // set the validity error reason and the corresponding\n          // message\n          this._internals.setValidity({ [this.validationError]: true }, input.validationMessage, input);\n        }\n      }\n    } else {\n      this._internals.setValidity({});\n    }\n  }\n}\n\nexport interface InputValidationControllerOptions {\n  /** A function that sets the value of host invalid reactive prop */\n  setInvalid: (host: ReactiveControllerHost & HTMLElement, value: boolean) => void;\n  /** A function that gets the value of host value reactive prop */\n  value: (host: ReactiveControllerHost & HTMLElement) => unknown;\n  /** A function that gets the input control of host value reactive prop */\n  input: (host: ReactiveController & HTMLElement) => HTMLInputElement | SgdsInput | SgdsCheckbox;\n}\n"],"names":[],"mappings":"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"}

package/utils/validatorMixin.js

@@ -9,22 +9,18 @@ import { InputValidationController } from './inputValidationController.js';
  */
 const SgdsFormValidatorMixin = (superClass) => {
     class ToBeValidatedElement extends superClass {
-        constructor(...args) {
-            var _a;
-            super(...args);
+        constructor() {
+            super(...arguments);
             this._isTouched = false;
-            this._internals = this.attachInternals();
+        }
+        connectedCallback() {
+            var _a;
+            super.connectedCallback();
+            if (this._mixinShouldSkipSgdsValidation())
+                return;
             /** Idempotency guarantee */
-            (_a = this.inputValidationController) !== null && _a !== void 0 ? _a : (this.inputValidationController = new InputValidationController(this, this._internals));
+            (_a = this.inputValidationController) !== null && _a !== void 0 ? _a : (this.inputValidationController = new InputValidationController(this));
         }
-        // connectedCallback(): void {
-        //   super.connectedCallback();
-        //   if (this._mixinShouldSkipSgdsValidation()) return;
-        //   console.log('1')
-        //   this._internals = this.attachInternals();
-        //   /** Idempotency guarantee */
-        //   this.inputValidationController ??= new InputValidationController(this, this._internals);
-        // }
         async firstUpdated(changedProperties) {
             super.firstUpdated(changedProperties);
             /* Either input or sgds-input. For example, quantity-toggle uses sgds-input */

package/utils/validatorMixin.js.map

@@ -1 +1 @@
-{"version":3,"file":"validatorMixin.js","sources":["../../src/utils/validatorMixin.ts"],"sourcesContent":["import { LitElement, PropertyValueMap } from \"lit\";\nimport { queryAsync } from \"lit/decorators.js\";\nimport { SgdsInput } from \"../components\";\nimport { InputValidationController } from \"./inputValidationController\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype Constructor<T> = new (...args: any[]) => T;\n\n/**\n * @summary The FormValidationMixin used by the form components\n * @param superClass\n * @returns\n */\nexport const SgdsFormValidatorMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n  class ToBeValidatedElement extends superClass {\n    static formAssociated = true;\n    inputValidationController: InputValidationController;\n    input: HTMLInputElement | SgdsInput | HTMLTextAreaElement;\n    private _isTouched = false;\n    @queryAsync(\"sgds-input\") sgdsInput: Promise<SgdsInput>;\n    @queryAsync(\"sgds-datepicker-input\") sgdsDatepickerInput: Promise<SgdsInput>;\n\n    private _internals: ElementInternals;\n    constructor(...args: any[]) {\n      super(...args);\n      this._internals = this.attachInternals();\n      /** Idempotency guarantee */\n      this.inputValidationController ??= new InputValidationController(this, this._internals);\n    }\n    // connectedCallback(): void {\n    //   super.connectedCallback();\n    //   if (this._mixinShouldSkipSgdsValidation()) return;\n    //   console.log('1')\n    //   this._internals = this.attachInternals();\n    //   /** Idempotency guarantee */\n    //   this.inputValidationController ??= new InputValidationController(this, this._internals);\n\n    // }\n    async firstUpdated(changedProperties: PropertyValueMap<this>) {\n      super.firstUpdated(changedProperties);\n\n      /* Either input or sgds-input. For example, quantity-toggle uses sgds-input */\n      this.input =\n        this.shadowRoot.querySelector(\"input\") ||\n        (await this.sgdsInput) ||\n        this.shadowRoot.querySelector(\"textarea\") ||\n        (await this.sgdsDatepickerInput);\n\n      if (this._mixinShouldSkipSgdsValidation()) return;\n\n      this._mixinSetFormValue();\n\n      this._mixinValidate(this.input);\n    }\n\n    /**\n     * Native lifecycle of Form-Associated Custom Element Callbacks\n     */\n    formResetCallback() {\n      if (this._mixinResetFormControl) {\n        this._mixinResetFormControl();\n      } else {\n        this.value = this.defaultValue;\n        this._mixinResetValidity(this.input);\n      }\n      this._mixinSetFormValue();\n    }\n    /**\n     *\n     * Methods use by classes using this mixin\n     */\n\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run change handler\n     */\n    _mixinHandleChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleChange(e);\n    }\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run input handler\n     */\n    _mixinHandleInputChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleInput(e);\n    }\n    /**\n     * During form resetting,\n     * 1. ValidityState is reset\n     * 2. invalid reactive prop is updated after the reset\n     * 3. Revalidates the ValidityState (but do not update invalid prop)\n     * to prepare for the next validity check\n     * 4. Reset touched state to false for a pristine form\n     */\n    _mixinResetValidity(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.resetValidity();\n      this.inputValidationController.updateInvalidState();\n      this.inputValidationController.validateInput(input);\n      this._isTouched ? (this._isTouched = false) : null;\n    }\n\n    _mixinValidate(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.validateInput(input);\n    }\n    _mixinSetFormValue() {\n      this.inputValidationController.setFormValue();\n    }\n    _mixinCheckValidity(): boolean {\n      return this.inputValidationController.checkValidity();\n    }\n    _mixinReportValidity(): boolean {\n      return this.inputValidationController.reportValidity();\n    }\n    _mixinGetValidity(): ValidityState {\n      return this.inputValidationController.validity;\n    }\n    _mixinGetValidationMessage(): string {\n      return this.inputValidationController.validationMessage;\n    }\n    _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void {\n      return this.inputValidationController.setValidity(flags, message, anchor);\n    }\n    // Only check for noValidate prop\n    _mixinShouldSkipSgdsValidation() {\n      const form = this.closest(\"form\");\n\n      return form?.noValidate || this.noValidate;\n    }\n\n    /** DECLARED INSTANCE METHODS AND PROPERTIES*/\n\n    /**\n     * Resets a form control to its initial state\n     */\n    declare _mixinResetFormControl: () => void;\n    declare value: string;\n    declare defaultValue: string;\n    declare defaultChecked: boolean;\n    declare noValidate: boolean;\n  }\n\n  return ToBeValidatedElement as Constructor<ToBeValidatedElementInterface> & T;\n};\n\nexport declare class ToBeValidatedElementInterface {\n  inputValidationController: InputValidationController;\n  input: HTMLInputElement;\n  _mixinHandleChange(e: Event): void;\n  _mixinHandleInputChange(e: Event): void;\n  _mixinResetValidity(input: HTMLInputElement | SgdsInput): void;\n  _mixinValidate(input: HTMLInputElement | SgdsInput): void;\n  _mixinSetFormValue(): void;\n  _mixinCheckValidity(): boolean;\n  _mixinReportValidity(): boolean;\n  _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;\n  _mixinGetValidity(): ValidityState;\n  _mixinGetValidationMessage(): string;\n  _mixinShouldSkipSgdsValidation(): boolean;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"validatorMixin.js","sources":["../../src/utils/validatorMixin.ts"],"sourcesContent":["import { LitElement, PropertyValueMap } from \"lit\";\nimport { queryAsync } from \"lit/decorators.js\";\nimport { SgdsInput } from \"../components\";\nimport { InputValidationController } from \"./inputValidationController\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype Constructor<T> = new (...args: any[]) => T;\n\n/**\n * @summary The FormValidationMixin used by the form components\n * @param superClass\n * @returns\n */\nexport const SgdsFormValidatorMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n  class ToBeValidatedElement extends superClass {\n    static formAssociated = true;\n    inputValidationController: InputValidationController;\n    input: HTMLInputElement | SgdsInput | HTMLTextAreaElement;\n    private _isTouched = false;\n    @queryAsync(\"sgds-input\") sgdsInput: Promise<SgdsInput>;\n    @queryAsync(\"sgds-datepicker-input\") sgdsDatepickerInput: Promise<SgdsInput>;\n\n    connectedCallback(): void {\n      super.connectedCallback();\n      if (this._mixinShouldSkipSgdsValidation()) return;\n\n      /** Idempotency guarantee */\n      this.inputValidationController ??= new InputValidationController(this);\n    }\n    async firstUpdated(changedProperties: PropertyValueMap<this>) {\n      super.firstUpdated(changedProperties);\n\n      /* Either input or sgds-input. For example, quantity-toggle uses sgds-input */\n      this.input =\n        this.shadowRoot.querySelector(\"input\") ||\n        (await this.sgdsInput) ||\n        this.shadowRoot.querySelector(\"textarea\") ||\n        (await this.sgdsDatepickerInput);\n\n      if (this._mixinShouldSkipSgdsValidation()) return;\n\n      this._mixinSetFormValue();\n\n      this._mixinValidate(this.input);\n    }\n\n    /**\n     * Native lifecycle of Form-Associated Custom Element Callbacks\n     */\n    formResetCallback() {\n      if (this._mixinResetFormControl) {\n        this._mixinResetFormControl();\n      } else {\n        this.value = this.defaultValue;\n        this._mixinResetValidity(this.input);\n      }\n      this._mixinSetFormValue();\n    }\n    /**\n     *\n     * Methods use by classes using this mixin\n     */\n\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run change handler\n     */\n    _mixinHandleChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleChange(e);\n    }\n    /**\n     * OnChange of form component\n     * 1. Make value of control accessible via FormData\n     * 2. Run input handler\n     */\n    _mixinHandleInputChange(e: Event): void {\n      this._mixinSetFormValue();\n      this.inputValidationController.handleInput(e);\n    }\n    /**\n     * During form resetting,\n     * 1. ValidityState is reset\n     * 2. invalid reactive prop is updated after the reset\n     * 3. Revalidates the ValidityState (but do not update invalid prop)\n     * to prepare for the next validity check\n     * 4. Reset touched state to false for a pristine form\n     */\n    _mixinResetValidity(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.resetValidity();\n      this.inputValidationController.updateInvalidState();\n      this.inputValidationController.validateInput(input);\n      this._isTouched ? (this._isTouched = false) : null;\n    }\n\n    _mixinValidate(input: HTMLInputElement | SgdsInput | HTMLTextAreaElement) {\n      this.inputValidationController.validateInput(input);\n    }\n    _mixinSetFormValue() {\n      this.inputValidationController.setFormValue();\n    }\n    _mixinCheckValidity(): boolean {\n      return this.inputValidationController.checkValidity();\n    }\n    _mixinReportValidity(): boolean {\n      return this.inputValidationController.reportValidity();\n    }\n    _mixinGetValidity(): ValidityState {\n      return this.inputValidationController.validity;\n    }\n    _mixinGetValidationMessage(): string {\n      return this.inputValidationController.validationMessage;\n    }\n    _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void {\n      return this.inputValidationController.setValidity(flags, message, anchor);\n    }\n    // Only check for noValidate prop\n    _mixinShouldSkipSgdsValidation() {\n      const form = this.closest(\"form\");\n\n      return form?.noValidate || this.noValidate;\n    }\n\n    /** DECLARED INSTANCE METHODS AND PROPERTIES*/\n\n    /**\n     * Resets a form control to its initial state\n     */\n    declare _mixinResetFormControl: () => void;\n    declare value: string;\n    declare defaultValue: string;\n    declare defaultChecked: boolean;\n    declare noValidate: boolean;\n  }\n\n  return ToBeValidatedElement as Constructor<ToBeValidatedElementInterface> & T;\n};\n\nexport declare class ToBeValidatedElementInterface {\n  inputValidationController: InputValidationController;\n  input: HTMLInputElement;\n  _mixinHandleChange(e: Event): void;\n  _mixinHandleInputChange(e: Event): void;\n  _mixinResetValidity(input: HTMLInputElement | SgdsInput): void;\n  _mixinValidate(input: HTMLInputElement | SgdsInput): void;\n  _mixinSetFormValue(): void;\n  _mixinCheckValidity(): boolean;\n  _mixinReportValidity(): boolean;\n  _mixinSetValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;\n  _mixinGetValidity(): ValidityState;\n  _mixinGetValidationMessage(): string;\n  _mixinShouldSkipSgdsValidation(): boolean;\n}\n"],"names":[],"mappings":"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"}