ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(validate): remove deprecated CssClassMixin

Browse source
This commit is contained in:
Thomas Allmer 2019-07-14 21:28:10 +02:00
parent adc3613728
commit b9012fe2ba
1 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
packages/validate/src/ValidateMixin.js
View file

@ -2,7 +2,6 @@
import { dedupeMixin, SlotMixin } from '@lion/core'; import { dedupeMixin, SlotMixin } from '@lion/core';
import { ObserverMixin } from '@lion/core/src/ObserverMixin.js'; import { ObserverMixin } from '@lion/core/src/ObserverMixin.js';
import { CssClassMixin } from '@lion/core/src/CssClassMixin.js';
import { localize, LocalizeMixin } from '@lion/localize'; import { localize, LocalizeMixin } from '@lion/localize';
import { Unparseable } from './Unparseable.js'; import { Unparseable } from './Unparseable.js';
import { randomOk } from './validators.js'; import { randomOk } from './validators.js';
@ -15,7 +14,7 @@ const pascalCase = str => str.charAt(0).toUpperCase() + str.slice(1);
export const ValidateMixin = dedupeMixin( export const ValidateMixin = dedupeMixin(
superclass => superclass =>
// eslint-disable-next-line no-unused-vars, no-shadow, max-len // eslint-disable-next-line no-unused-vars, no-shadow, max-len
class ValidateMixin extends CssClassMixin(ObserverMixin(LocalizeMixin(SlotMixin(superclass)))) { class ValidateMixin extends ObserverMixin(LocalizeMixin(SlotMixin(superclass))) {
/* * * * * * * * * * /* * * * * * * * * *
Configuration */ Configuration */
@ -120,11 +119,9 @@ export const ValidateMixin = dedupeMixin(
}, },
errorState: { errorState: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-error',
}, },
errorShow: { errorShow: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-error-show',
}, },
warningValidators: { warningValidators: {
type: Object, type: Object,
@ -134,11 +131,9 @@ export const ValidateMixin = dedupeMixin(
}, },
warningState: { warningState: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-warning',
}, },
warningShow: { warningShow: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-warning-show',
}, },
infoValidators: { infoValidators: {
type: Object, type: Object,
@ -148,11 +143,9 @@ export const ValidateMixin = dedupeMixin(
}, },
infoState: { infoState: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-info',
}, },
infoShow: { infoShow: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-info-show',
}, },
successValidators: { successValidators: {
type: Object, type: Object,
@ -162,15 +155,12 @@ export const ValidateMixin = dedupeMixin(
}, },
successState: { successState: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-success',
}, },
successShow: { successShow: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-success-show',
}, },
invalid: { invalid: {
type: Boolean, type: Boolean,
nonEmptyToClass: 'state-invalid',
}, },
message: { message: {
type: Boolean, type: Boolean,
@ -236,6 +226,23 @@ export const ValidateMixin = dedupeMixin(
return (this.$$slot && this.$$slot('feedback')) || this.querySelector('[slot="feedback"]'); return (this.$$slot && this.$$slot('feedback')) || this.querySelector('[slot="feedback"]');
} }
updated(changedProperties) {
super.updated(changedProperties);
// @deprecated adding css classes for backwards compatibility
this.constructor.validationTypes.forEach(name => {
if (changedProperties.has(`${name}State`)) {
this.classList[this[`${name}State`] ? 'add' : 'remove'](`state-${name}`);
}
if (changedProperties.has(`${name}Show`)) {
this.classList[this[`${name}Show`] ? 'add' : 'remove'](`state-${name}-show`);
}
});
if (changedProperties.has('invalid')) {
this.classList[this.invalid ? 'add' : 'remove'](`state-invalid`);
}
}
getFieldName(validatorParams) { getFieldName(validatorParams) {
const label = const label =
this.label || (this.$$slot && this.$$slot('label') && this.$$slot('label').textContent); this.label || (this.$$slot && this.$$slot('label') && this.$$slot('label').textContent);