From ad1e828d51e90257e78bbed13a47e4da92cf45dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C5=82awek=20Amielucha?= Date: Mon, 2 Mar 2020 14:35:01 +0100 Subject: [PATCH] chore: unify the naming of changedProperties param (#620) --- packages/calendar/src/LionCalendar.js | 4 ++-- packages/choice-input/src/ChoiceInputMixin.js | 12 ++++++------ packages/field/src/FormControlMixin.js | 12 ++++++------ packages/field/src/LionField.js | 14 +++++++------- packages/fieldset/src/FormGroupMixin.js | 8 ++++---- .../form-system/stories/helper-wc/h-output.js | 4 ++-- packages/input-amount/src/LionInputAmount.js | 6 +++--- packages/input-date/src/LionInputDate.js | 6 +++--- .../input-datepicker/src/LionInputDatepicker.js | 14 +++++++------- packages/input/src/LionInput.js | 12 ++++++------ packages/select-rich/src/LionSelectRich.js | 16 ++++++++-------- packages/steps/src/LionSteps.js | 11 +++++++---- packages/validate/src/ValidateMixin.js | 13 ++++++++----- .../validate/src/utils/SyncUpdatableMixin.js | 4 ++-- .../validate/test/SyncUpdatableMixin.test.js | 4 ++-- 15 files changed, 73 insertions(+), 67 deletions(-) diff --git a/packages/calendar/src/LionCalendar.js b/packages/calendar/src/LionCalendar.js index af212983a..a3faa67ad 100644 --- a/packages/calendar/src/LionCalendar.js +++ b/packages/calendar/src/LionCalendar.js @@ -217,8 +217,8 @@ export class LionCalendar extends LocalizeMixin(LitElement) { this.__addEventForKeyboardNavigation(); } - updated(changed) { - if (changed.has('__focusedDate') && this.__focusedDate) { + updated(changedProperties) { + if (changedProperties.has('__focusedDate') && this.__focusedDate) { this.focusCentralDate(); } } diff --git a/packages/choice-input/src/ChoiceInputMixin.js b/packages/choice-input/src/ChoiceInputMixin.js index 9ef59f1d7..787c8cd7e 100644 --- a/packages/choice-input/src/ChoiceInputMixin.js +++ b/packages/choice-input/src/ChoiceInputMixin.js @@ -62,18 +62,18 @@ export const ChoiceInputMixin = superclass => } } - firstUpdated(c) { - super.firstUpdated(c); - if (c.has('checked')) { + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); + if (changedProperties.has('checked')) { // Here we set the initial value for our [slot=input] content, // which has been set by our SlotMixin this.__syncCheckedToInputElement(); } } - updated(c) { - super.updated(c); - if (c.has('modelValue')) { + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has('modelValue')) { this.__syncCheckedToInputElement(); } } diff --git a/packages/field/src/FormControlMixin.js b/packages/field/src/FormControlMixin.js index 7c22c5f7f..75e06e879 100644 --- a/packages/field/src/FormControlMixin.js +++ b/packages/field/src/FormControlMixin.js @@ -102,10 +102,10 @@ export const FormControlMixin = dedupeMixin( }; } - updated(changedProps) { - super.updated(changedProps); + updated(changedProperties) { + super.updated(changedProperties); - if (changedProps.has('_ariaLabelledNodes')) { + if (changedProperties.has('_ariaLabelledNodes')) { this.__reflectAriaAttr( 'aria-labelledby', this._ariaLabelledNodes, @@ -113,7 +113,7 @@ export const FormControlMixin = dedupeMixin( ); } - if (changedProps.has('_ariaDescribedNodes')) { + if (changedProperties.has('_ariaDescribedNodes')) { this.__reflectAriaAttr( 'aria-describedby', this._ariaDescribedNodes, @@ -121,11 +121,11 @@ export const FormControlMixin = dedupeMixin( ); } - if (changedProps.has('label')) { + if (changedProperties.has('label')) { this._onLabelChanged({ label: this.label }); } - if (changedProps.has('helpText')) { + if (changedProperties.has('helpText')) { this._onHelpTextChanged({ helpText: this.helpText }); } } diff --git a/packages/field/src/LionField.js b/packages/field/src/LionField.js index 4615bd28a..868d0e0a6 100644 --- a/packages/field/src/LionField.js +++ b/packages/field/src/LionField.js @@ -93,8 +93,8 @@ export class LionField extends FormControlMixin( this.submitted = false; } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); this._initialModelValue = this.modelValue; } @@ -118,19 +118,19 @@ export class LionField extends FormControlMixin( this._inputNode.removeEventListener('change', this._onChange); } - updated(changedProps) { - super.updated(changedProps); + updated(changedProperties) { + super.updated(changedProperties); - if (changedProps.has('disabled')) { + if (changedProperties.has('disabled')) { this._inputNode.disabled = this.disabled; this.validate(); } - if (changedProps.has('name')) { + if (changedProperties.has('name')) { this._inputNode.name = this.name; } - if (changedProps.has('autocomplete')) { + if (changedProperties.has('autocomplete')) { this._inputNode.autocomplete = this.autocomplete; } } diff --git a/packages/fieldset/src/FormGroupMixin.js b/packages/fieldset/src/FormGroupMixin.js index e39815392..bc29d8174 100644 --- a/packages/fieldset/src/FormGroupMixin.js +++ b/packages/fieldset/src/FormGroupMixin.js @@ -145,10 +145,10 @@ export const FormGroupMixin = dedupeMixin( }); } - updated(changedProps) { - super.updated(changedProps); + updated(changedProperties) { + super.updated(changedProperties); - if (changedProps.has('disabled')) { + if (changedProperties.has('disabled')) { if (this.disabled) { this.__requestChildrenToBeDisabled(); } else { @@ -156,7 +156,7 @@ export const FormGroupMixin = dedupeMixin( } } - if (changedProps.has('focused')) { + if (changedProperties.has('focused')) { if (this.focused === true) { this.__setupOutsideClickHandling(); } diff --git a/packages/form-system/stories/helper-wc/h-output.js b/packages/form-system/stories/helper-wc/h-output.js index c8354ab93..ee09355cb 100644 --- a/packages/form-system/stories/helper-wc/h-output.js +++ b/packages/form-system/stories/helper-wc/h-output.js @@ -37,8 +37,8 @@ export class HelperOutput extends LitElement { ]; } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); if (!this.field) { // Fuzzy logic, but... practical const prev = this.previousElementSibling; diff --git a/packages/input-amount/src/LionInputAmount.js b/packages/input-amount/src/LionInputAmount.js index 6cf95df27..24139559d 100644 --- a/packages/input-amount/src/LionInputAmount.js +++ b/packages/input-amount/src/LionInputAmount.js @@ -87,9 +87,9 @@ export class LionInputAmount extends LocalizeMixin(LionInput) { } } - updated(changedProps) { - super.updated(changedProps); - if (changedProps.has('currency')) { + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has('currency')) { this._onCurrencyChanged({ currency: this.currency }); } } diff --git a/packages/input-date/src/LionInputDate.js b/packages/input-date/src/LionInputDate.js index dcaab505d..f95af7cff 100644 --- a/packages/input-date/src/LionInputDate.js +++ b/packages/input-date/src/LionInputDate.js @@ -23,9 +23,9 @@ export class LionInputDate extends LocalizeMixin(LionInput) { this.defaultValidators.push(new IsDate()); } - updated(c) { - super.updated(c); - if (c.has('locale')) { + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has('locale')) { this._calculateValues(); } } diff --git a/packages/input-datepicker/src/LionInputDatepicker.js b/packages/input-datepicker/src/LionInputDatepicker.js index d4ab9e0c8..785536ae4 100644 --- a/packages/input-datepicker/src/LionInputDatepicker.js +++ b/packages/input-datepicker/src/LionInputDatepicker.js @@ -178,22 +178,22 @@ export class LionInputDatepicker extends OverlayMixin(LionInputDate) { } } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); this.__toggleInvokerDisabled(); } /** * @override - * @param {Map} c - changed properties + * @param {Map} changedProperties - changed properties */ - updated(c) { - super.updated(c); - if (c.has('validators')) { + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has('validators')) { const validators = [...(this.validators || [])]; this.__syncDisabledDates(validators); } - if (c.has('label')) { + if (changedProperties.has('label')) { this.calendarHeading = this.calendarHeading || this.label; } } diff --git a/packages/input/src/LionInput.js b/packages/input/src/LionInput.js index 048d902fe..b4f36dbdc 100644 --- a/packages/input/src/LionInput.js +++ b/packages/input/src/LionInput.js @@ -60,17 +60,17 @@ export class LionInput extends LionField { } } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); this.__delegateReadOnly(); } - updated(changedProps) { - super.updated(changedProps); - if (changedProps.has('type')) { + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has('type')) { this._inputNode.type = this.type; } - if (changedProps.has('placeholder')) { + if (changedProperties.has('placeholder')) { this._inputNode.placeholder = this.placeholder; } } diff --git a/packages/select-rich/src/LionSelectRich.js b/packages/select-rich/src/LionSelectRich.js index e6812ae22..40b2a1bb0 100644 --- a/packages/select-rich/src/LionSelectRich.js +++ b/packages/select-rich/src/LionSelectRich.js @@ -200,8 +200,8 @@ export class LionSelectRich extends ChoiceGroupMixin( this.__teardownListboxNode(); } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); this.__setupOverlay(); this.__setupInvokerNode(); this.__setupListboxNode(); @@ -245,10 +245,10 @@ export class LionSelectRich extends ChoiceGroupMixin( `; } - updated(changedProps) { - super.updated(changedProps); + updated(changedProperties) { + super.updated(changedProperties); - if (changedProps.has('disabled')) { + if (changedProperties.has('disabled')) { if (this.disabled) { this._invokerNode.makeRequestToBeDisabled(); this.__requestOptionsToBeDisabled(); @@ -259,21 +259,21 @@ export class LionSelectRich extends ChoiceGroupMixin( } if (this._inputNode && this._invokerNode) { - if (changedProps.has('_ariaLabelledNodes')) { + if (changedProperties.has('_ariaLabelledNodes')) { this._invokerNode.setAttribute( 'aria-labelledby', `${this._inputNode.getAttribute('aria-labelledby')} ${this._invokerNode.id}`, ); } - if (changedProps.has('_ariaDescribedNodes')) { + if (changedProperties.has('_ariaDescribedNodes')) { this._invokerNode.setAttribute( 'aria-describedby', this._inputNode.getAttribute('aria-describedby'), ); } - if (changedProps.has('showsFeedbackFor')) { + if (changedProperties.has('showsFeedbackFor')) { // The ValidateMixin sets aria-invalid on the inputNode, but in this component we also need it on the invoker this._invokerNode.setAttribute('aria-invalid', this._hasFeedbackVisibleFor('error')); } diff --git a/packages/steps/src/LionSteps.js b/packages/steps/src/LionSteps.js index fafa064c9..69a529a32 100644 --- a/packages/steps/src/LionSteps.js +++ b/packages/steps/src/LionSteps.js @@ -31,10 +31,13 @@ export class LionSteps extends LitElement { }; } - updated(changedProps) { - super.updated(changedProps); - if (changedProps.has('current')) { - this._onCurrentChanged({ current: this.current }, { current: changedProps.get('current') }); + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has('current')) { + this._onCurrentChanged( + { current: this.current }, + { current: changedProperties.get('current') }, + ); } } diff --git a/packages/validate/src/ValidateMixin.js b/packages/validate/src/ValidateMixin.js index e1f8f2425..1a2a24ca7 100644 --- a/packages/validate/src/ValidateMixin.js +++ b/packages/validate/src/ValidateMixin.js @@ -188,8 +188,8 @@ export const ValidateMixin = dedupeMixin( await import('../lion-validation-feedback.js'); } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); this.__validateInitialized = true; this.validate(); this._loadFeedbackComponent(); @@ -591,10 +591,13 @@ export const ValidateMixin = dedupeMixin( ); } - updated(c) { - super.updated(c); + updated(changedProperties) { + super.updated(changedProperties); - if (c.has('shouldShowFeedbackFor') || c.has('hasFeedbackFor')) { + if ( + changedProperties.has('shouldShowFeedbackFor') || + changedProperties.has('hasFeedbackFor') + ) { this.showsFeedbackFor = this.constructor.validationTypes .map(type => (this._hasFeedbackVisibleFor(type) ? type : undefined)) .filter(_ => !!_); diff --git a/packages/validate/src/utils/SyncUpdatableMixin.js b/packages/validate/src/utils/SyncUpdatableMixin.js index b8f16485a..6234e8455 100644 --- a/packages/validate/src/utils/SyncUpdatableMixin.js +++ b/packages/validate/src/utils/SyncUpdatableMixin.js @@ -25,8 +25,8 @@ export const SyncUpdatableMixin = dedupeMixin( this.__SyncUpdatableNamespace = {}; } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); this.__SyncUpdatableNamespace.connected = true; this.__syncUpdatableInitialize(); } diff --git a/packages/validate/test/SyncUpdatableMixin.test.js b/packages/validate/test/SyncUpdatableMixin.test.js index 4c25c1326..f02c2023d 100644 --- a/packages/validate/test/SyncUpdatableMixin.test.js +++ b/packages/validate/test/SyncUpdatableMixin.test.js @@ -27,8 +27,8 @@ describe('SyncUpdatableMixin', () => { this.propB = 'init-b'; } - firstUpdated(c) { - super.firstUpdated(c); + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); hasCalledFirstUpdated = true; }