diff --git a/components/checkbox/demo/api.min.js b/components/checkbox/demo/api.min.js index 999c7968..3310d3dd 100644 --- a/components/checkbox/demo/api.min.js +++ b/components/checkbox/demo/api.min.js @@ -441,7 +441,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -458,14 +457,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); diff --git a/components/checkbox/demo/index.min.js b/components/checkbox/demo/index.min.js index 999c7968..3310d3dd 100644 --- a/components/checkbox/demo/index.min.js +++ b/components/checkbox/demo/index.min.js @@ -441,7 +441,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -458,14 +457,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); diff --git a/components/combobox/demo/api.min.js b/components/combobox/demo/api.min.js index d6e896e6..ba2e255b 100644 --- a/components/combobox/demo/api.min.js +++ b/components/combobox/demo/api.min.js @@ -408,7 +408,6 @@ let AuroFormValidation$1 = class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -425,14 +424,10 @@ let AuroFormValidation$1 = class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -5278,7 +5273,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -5295,14 +5289,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -5392,7 +5382,6 @@ class AuroFormValidation { * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -5437,8 +5426,6 @@ class BaseInput extends r { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -5559,10 +5546,6 @@ class BaseInput extends r { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/combobox/demo/index.min.js b/components/combobox/demo/index.min.js index 09a2780f..5e222e09 100644 --- a/components/combobox/demo/index.min.js +++ b/components/combobox/demo/index.min.js @@ -312,7 +312,6 @@ let AuroFormValidation$1 = class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -329,14 +328,10 @@ let AuroFormValidation$1 = class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -5182,7 +5177,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -5199,14 +5193,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -5296,7 +5286,6 @@ class AuroFormValidation { * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -5341,8 +5330,6 @@ class BaseInput extends r { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -5463,10 +5450,6 @@ class BaseInput extends r { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/datepicker/demo/api.min.js b/components/datepicker/demo/api.min.js index 9210ef1f..50b555d9 100644 --- a/components/datepicker/demo/api.min.js +++ b/components/datepicker/demo/api.min.js @@ -501,7 +501,6 @@ let AuroFormValidation$1 = class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -518,14 +517,10 @@ let AuroFormValidation$1 = class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -15457,7 +15452,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -15474,14 +15468,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -15571,7 +15561,6 @@ class AuroFormValidation { * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -15616,8 +15605,6 @@ class BaseInput extends r { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -15738,10 +15725,6 @@ class BaseInput extends r { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/datepicker/demo/index.min.js b/components/datepicker/demo/index.min.js index 36e44691..47e038b8 100644 --- a/components/datepicker/demo/index.min.js +++ b/components/datepicker/demo/index.min.js @@ -249,7 +249,6 @@ let AuroFormValidation$1 = class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -266,14 +265,10 @@ let AuroFormValidation$1 = class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -15205,7 +15200,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -15222,14 +15216,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -15319,7 +15309,6 @@ class AuroFormValidation { * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -15364,8 +15353,6 @@ class BaseInput extends r { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -15486,10 +15473,6 @@ class BaseInput extends r { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/input/demo/api.md b/components/input/demo/api.md index 198a768c..a26b86dc 100644 --- a/components/input/demo/api.md +++ b/components/input/demo/api.md @@ -44,7 +44,6 @@ Generate unique names for dependency components. | [helpText](#helpText) | `helpText` | `String` | | Deprecated, see `slot`. | | [icon](#icon) | `icon` | `Boolean` | false | If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. | | [id](#id) | `id` | `String` | | Sets the unique ID of the element. | -| [isValid](#isValid) | `isValid` | `String` | false | (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. | | [label](#label) | `label` | `String` | "Input label is undefined" | Deprecated, see `slot`. | | [lang](#lang) | `lang` | `String` | | defines the language of an element. | | [max](#max) | `max` | `String` | "undefined" | The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. | diff --git a/components/input/demo/api.min.js b/components/input/demo/api.min.js index 1e5f9fc8..13da1776 100644 --- a/components/input/demo/api.min.js +++ b/components/input/demo/api.min.js @@ -2018,7 +2018,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -2035,14 +2034,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -2132,7 +2127,6 @@ class AuroFormValidation { * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -2177,8 +2171,6 @@ class BaseInput extends r { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -2299,10 +2291,6 @@ class BaseInput extends r { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/input/demo/index.min.js b/components/input/demo/index.min.js index bdd7ba6c..f906582c 100644 --- a/components/input/demo/index.min.js +++ b/components/input/demo/index.min.js @@ -1964,7 +1964,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -1981,14 +1980,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); @@ -2078,7 +2073,6 @@ class AuroFormValidation { * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -2123,8 +2117,6 @@ class BaseInput extends r { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -2245,10 +2237,6 @@ class BaseInput extends r { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/input/docs/api.md b/components/input/docs/api.md index 4802ab70..bc676b99 100644 --- a/components/input/docs/api.md +++ b/components/input/docs/api.md @@ -24,7 +24,6 @@ Generate unique names for dependency components. | `helpText` | `helpText` | `String` | | Deprecated, see `slot`. | | `icon` | `icon` | `Boolean` | false | If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. | | `id` | `id` | `String` | | Sets the unique ID of the element. | -| `isValid` | `isValid` | `String` | false | (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. | | `label` | `label` | `String` | "Input label is undefined" | Deprecated, see `slot`. | | `lang` | `lang` | `String` | | defines the language of an element. | | `max` | `max` | `String` | "undefined" | The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. | diff --git a/components/input/src/base-input.js b/components/input/src/base-input.js index 8d87cdbe..a91e9cf9 100644 --- a/components/input/src/base-input.js +++ b/components/input/src/base-input.js @@ -33,7 +33,6 @@ import AuroFormValidation from '@auro-formkit/form-validation'; * @attr {String} helpText - Deprecated, see `slot`. * @attr {Boolean} icon - If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format. * @attr {String} id - Sets the unique ID of the element. - * @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. * @attr {String} label - Deprecated, see `slot`. * @attr {String} lang - defines the language of an element. * @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. @@ -78,8 +77,6 @@ export default class BaseInput extends LitElement { constructor() { super(); - this.isValid = false; - this.icon = false; this.disabled = false; this.required = false; @@ -200,10 +197,6 @@ export default class BaseInput extends LitElement { reflect: true }, errorMessage: { type: String }, - isValid: { - type: String, - reflect: true - }, validity: { type: String, reflect: true diff --git a/components/input/test/auro-input.test.js b/components/input/test/auro-input.test.js index e0991fe4..f9803392 100644 --- a/components/input/test/auro-input.test.js +++ b/components/input/test/auro-input.test.js @@ -49,7 +49,6 @@ describe('auro-input', () => { await elementUpdated(el); - expect(el.isValid).to.not.be.true; expect(text).to.contain(`that is not a valid entry`); input.focus(); @@ -58,7 +57,7 @@ describe('auro-input', () => { await elementUpdated(el); - expect(el.isValid).to.be.true; + expect(el.getAttribute('validity')).to.equal('valid'); }); it('clears the value when clicked', async () => { diff --git a/components/radio/demo/api.min.js b/components/radio/demo/api.min.js index a42b05a1..60cf51bd 100644 --- a/components/radio/demo/api.min.js +++ b/components/radio/demo/api.min.js @@ -523,7 +523,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -540,14 +539,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); diff --git a/components/radio/demo/index.min.js b/components/radio/demo/index.min.js index 701217b6..388810ee 100644 --- a/components/radio/demo/index.min.js +++ b/components/radio/demo/index.min.js @@ -506,7 +506,6 @@ class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -523,14 +522,10 @@ class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem); diff --git a/packages/form-validation/src/validation.js b/packages/form-validation/src/validation.js index 95815640..2ebadc9f 100644 --- a/packages/form-validation/src/validation.js +++ b/packages/form-validation/src/validation.js @@ -151,7 +151,6 @@ export default class AuroFormValidation { } else if (elem.value === undefined) { // Reset the validity state if input is programmatically reset elem.validity = undefined; - elem.isValid = false; } if (this.auroInputElements && this.auroInputElements.length > 0) { @@ -168,14 +167,10 @@ export default class AuroFormValidation { if (validationShouldRun || elem.hasAttribute('error')) { if (elem.validity && elem.validity !== 'valid') { - elem.isValid = false; - // Use the validity message override if it is declared if (elem.ValidityMessageOverride) { elem.setCustomValidity = elem.ValidityMessageOverride; } - } else { - elem.isValid = true; } this.getErrorMessage(elem);