From bcd0a2f6bdf995e56aa0d62c395caf6922424502 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jacob=20M=C3=BCller?= Date: Wed, 22 May 2019 15:22:07 +0200 Subject: [PATCH] fix: remove underscore form variable and method names (#3352) --- .../form-checkbox/form-checkbox-group.js | 2 +- src/components/form-checkbox/form-checkbox.js | 8 +- src/components/form-radio/form-radio-group.js | 2 +- src/components/form-radio/form-radio.js | 8 +- src/components/modal/modal.js | 110 ++++++++-------- src/components/modal/package.json | 2 +- src/mixins/form-radio-check-group.js | 4 +- src/mixins/form-radio-check.js | 122 +++++++++--------- 8 files changed, 129 insertions(+), 129 deletions(-) diff --git a/src/components/form-checkbox/form-checkbox-group.js b/src/components/form-checkbox/form-checkbox-group.js index 3bcdc0c7aed..a8b495ec32d 100644 --- a/src/components/form-checkbox/form-checkbox-group.js +++ b/src/components/form-checkbox/form-checkbox-group.js @@ -41,7 +41,7 @@ export default Vue.extend({ } }, computed: { - is_RadioGroup() { + isRadioGroup() { return false } } diff --git a/src/components/form-checkbox/form-checkbox.js b/src/components/form-checkbox/form-checkbox.js index c09895a2108..e909a39d476 100644 --- a/src/components/form-checkbox/form-checkbox.js +++ b/src/components/form-checkbox/form-checkbox.js @@ -51,7 +51,7 @@ export default Vue.extend({ } }, computed: { - is_Checked() { + isChecked() { const checked = this.computedLocalChecked const value = this.value if (isArray(checked)) { @@ -60,10 +60,10 @@ export default Vue.extend({ return looseEqual(checked, value) } }, - is_Radio() { + isRadio() { return false }, - is_Check() { + isCheck() { return true } }, @@ -105,7 +105,7 @@ export default Vue.extend({ // Change is only emitted on user interaction this.$emit('change', checked ? value : uncheckedValue) // If this is a child of form-checkbox-group, we emit a change event on it as well - if (this.is_Group) { + if (this.isGroup) { this.bvGroup.$emit('change', localChecked) } this.$emit('update:indeterminate', indeterminate) diff --git a/src/components/form-radio/form-radio-group.js b/src/components/form-radio/form-radio-group.js index 417d3153010..9a808fac1ca 100644 --- a/src/components/form-radio/form-radio-group.js +++ b/src/components/form-radio/form-radio-group.js @@ -36,7 +36,7 @@ export default Vue.extend({ } }, computed: { - is_RadioGroup() { + isRadioGroup() { return true } } diff --git a/src/components/form-radio/form-radio.js b/src/components/form-radio/form-radio.js index d22246d486f..0e47fd90338 100644 --- a/src/components/form-radio/form-radio.js +++ b/src/components/form-radio/form-radio.js @@ -31,14 +31,14 @@ export default Vue.extend({ }, computed: { // Radio Groups can only have a single value, so determining if checked is simple - is_Checked() { + isChecked() { return looseEqual(this.value, this.computedLocalChecked) }, // Flags for form-radio-check mixin - is_Radio() { + isRadio() { return true }, - is_Check() { + isCheck() { return false } }, @@ -55,7 +55,7 @@ export default Vue.extend({ // Change is only emitted on user interaction this.$emit('change', checked ? value : null) // If this is a child of form-radio-group, we emit a change event on it as well - if (this.is_Group) { + if (this.isGroup) { this.bvGroup.$emit('change', checked ? value : null) } } diff --git a/src/components/modal/modal.js b/src/components/modal/modal.js index 7458232df80..656d8a99972 100644 --- a/src/components/modal/modal.js +++ b/src/components/modal/modal.js @@ -228,13 +228,13 @@ export default Vue.extend({ props, data() { return { - is_hidden: true, // If modal should not be in document - is_visible: false, // Controls modal visible state - is_transitioning: false, // Used for style control - is_show: false, // Used for style control - is_block: false, // Used for style control - is_opening: false, // To signal that the modal is in the process of opening - is_closing: false, // To signal that the modal is in the process of closing + isHidden: true, // If modal should not be in document + isVisible: false, // Controls modal visible state + isTransitioning: false, // Used for style control + isShow: false, // Used for style control + isBlock: false, // Used for style control + isOpening: false, // To signal that the modal is in the process of opening + isClosing: false, // To signal that the modal is in the process of closing ignoreBackdropClick: false, // Used to signify if click out listener should ignore the click isModalOverflowing: false, return_focus: this.returnFocus || null, @@ -250,8 +250,8 @@ export default Vue.extend({ return [ { fade: !this.noFade, - show: this.is_show, - 'd-block': this.is_block + show: this.isShow, + 'd-block': this.isBlock }, this.modalClass ] @@ -315,7 +315,7 @@ export default Vue.extend({ cancel: this.onCancel, close: this.onClose, hide: this.hide, - visible: this.is_visible + visible: this.isVisible } } }, @@ -354,10 +354,10 @@ export default Vue.extend({ } this.setEnforceFocus(false) this.setResizeEvent(false) - if (this.is_visible) { - this.is_visible = false - this.is_show = false - this.is_transitioning = false + if (this.isVisible) { + this.isVisible = false + this.isShow = false + this.isTransitioning = false } }, methods: { @@ -368,19 +368,19 @@ export default Vue.extend({ }, // Public Methods show() { - if (this.is_visible || this.is_opening) { + if (this.isVisible || this.isOpening) { // If already open, on in the process of opening, do nothing /* istanbul ignore next */ return } - if (this.is_closing) { + if (this.isClosing) { // If we are in the process of closing, wait until hidden before re-opening /* istanbul ignore next: very difficult to test */ this.$once('hidden', this.show) /* istanbul ignore next */ return } - this.is_opening = true + this.isOpening = true // Set the element to return focus to when closed this.return_focus = this.return_focus || this.getActiveElement() const showEvt = new BvModalEvent('show', { @@ -392,8 +392,8 @@ export default Vue.extend({ }) this.emitEvent(showEvt) // Don't show if canceled - if (showEvt.defaultPrevented || this.is_visible) { - this.is_opening = false + if (showEvt.defaultPrevented || this.isVisible) { + this.isOpening = false // Ensure the v-model reflects the current state this.updateModel(false) return @@ -402,11 +402,11 @@ export default Vue.extend({ this.doShow() }, hide(trigger = '') { - if (!this.is_visible || this.is_closing) { + if (!this.isVisible || this.isClosing) { /* istanbul ignore next */ return } - this.is_closing = true + this.isClosing = true const hideEvt = new BvModalEvent('hide', { cancelable: trigger !== 'FORCE', vueTarget: this, @@ -425,8 +425,8 @@ export default Vue.extend({ } this.emitEvent(hideEvt) // Hide if not canceled - if (hideEvt.defaultPrevented || !this.is_visible) { - this.is_closing = false + if (hideEvt.defaultPrevented || !this.isVisible) { + this.isClosing = false // Ensure v-model reflects current state this.updateModel(true) return @@ -437,7 +437,7 @@ export default Vue.extend({ this._observer = null } // Trigger the hide transition - this.is_visible = false + this.isVisible = false // Update the v-model this.updateModel(false) }, @@ -446,7 +446,7 @@ export default Vue.extend({ if (triggerEl) { this.return_focus = triggerEl } - if (this.is_visible) { + if (this.isVisible) { this.hide('toggle') } else { this.show() @@ -456,8 +456,8 @@ export default Vue.extend({ getActiveElement() { if (isBrowser) { const activeElement = document.activeElement - // Note: On IE11, `document.activeElement` may be null. So we test it for - // truthyness first. + // Note: On IE11, `document.activeElement` may be null. + // So we test it for truthiness first. // https://github.com/bootstrap-vue/bootstrap-vue/issues/3206 // Returning focus to document.body may cause unwanted scrolls, so we // exclude setting focus on body @@ -481,12 +481,12 @@ export default Vue.extend({ } modalManager.registerModal(this) // Place modal in DOM - this.is_hidden = false + this.isHidden = false this.$nextTick(() => { // We do this in `$nextTick()` to ensure the modal is in DOM first // before we show it - this.is_visible = true - this.is_opening = false + this.isVisible = true + this.isOpening = false // Update the v-model this.updateModel(true) this.$nextTick(() => { @@ -502,16 +502,16 @@ export default Vue.extend({ }, // Transition handlers onBeforeEnter() { - this.is_transitioning = true + this.isTransitioning = true this.setResizeEvent(true) }, onEnter() { - this.is_block = true + this.isBlock = true }, onAfterEnter() { this.checkModalOverflow() - this.is_show = true - this.is_transitioning = false + this.isShow = true + this.isTransitioning = false this.$nextTick(() => { const shownEvt = new BvModalEvent('shown', { cancelable: false, @@ -526,22 +526,22 @@ export default Vue.extend({ }) }, onBeforeLeave() { - this.is_transitioning = true + this.isTransitioning = true this.setResizeEvent(false) }, onLeave() { // Remove the 'show' class - this.is_show = false + this.isShow = false }, onAfterLeave() { - this.is_block = false - this.is_transitioning = false + this.isBlock = false + this.isTransitioning = false this.setEnforceFocus(false) this.isModalOverflowing = false - this.is_hidden = true + this.isHidden = true this.$nextTick(() => { this.returnFocusTo() - this.is_closing = false + this.isClosing = false this.return_focus = null modalManager.unregisterModal(this) // TODO: Need to find a way to pass the `trigger` property @@ -580,7 +580,7 @@ export default Vue.extend({ onClickOut(evt) { // Do nothing if not visible, backdrop click disabled, or element // that generated click event is no longer in document body - if (!this.is_visible || this.noCloseOnBackdrop || !contains(document.body, evt.target)) { + if (!this.isVisible || this.noCloseOnBackdrop || !contains(document.body, evt.target)) { return } if (this.ignoreBackdropClick) { @@ -605,7 +605,7 @@ export default Vue.extend({ }, onEsc(evt) { // If ESC pressed, hide modal - if (evt.keyCode === KeyCodes.ESC && this.is_visible && !this.noCloseOnEsc) { + if (evt.keyCode === KeyCodes.ESC && this.isVisible && !this.noCloseOnEsc) { this.hide('esc') } }, @@ -616,7 +616,7 @@ export default Vue.extend({ if ( !this.noEnforceFocus && this.isTop && - this.is_visible && + this.isVisible && modal && document !== evt.target && !contains(modal, evt.target) @@ -694,7 +694,7 @@ export default Vue.extend({ } }, checkModalOverflow() { - if (this.is_visible) { + if (this.isVisible) { const modal = this.$refs.modal this.isModalOverflowing = modal.scrollHeight > document.documentElement.clientHeight } @@ -711,7 +711,7 @@ export default Vue.extend({ BButtonClose, { props: { - disabled: this.is_transitioning, + disabled: this.isTransitioning, ariaLabel: this.headerCloseLabel, textVariant: this.headerCloseVariant || this.headerTextVariant }, @@ -766,7 +766,7 @@ export default Vue.extend({ props: { variant: this.cancelVariant, size: this.buttonSize, - disabled: this.cancelDisabled || this.busy || this.is_transitioning + disabled: this.cancelDisabled || this.busy || this.isTransitioning }, on: { click: this.onCancel } }, @@ -783,7 +783,7 @@ export default Vue.extend({ props: { variant: this.okVariant, size: this.buttonSize, - disabled: this.okDisabled || this.busy || this.is_transitioning + disabled: this.okDisabled || this.busy || this.isTransitioning }, on: { click: this.onOk } }, @@ -840,14 +840,14 @@ export default Vue.extend({ class: this.modalClasses, style: this.modalStyles, directives: [ - { name: 'show', rawName: 'v-show', value: this.is_visible, expression: 'is_visible' } + { name: 'show', rawName: 'v-show', value: this.isVisible, expression: 'isVisible' } ], attrs: { id: this.safeId(), role: 'dialog', tabindex: '-1', - 'aria-hidden': this.is_visible ? null : 'true', - 'aria-modal': this.is_visible ? 'true' : null + 'aria-hidden': this.isVisible ? null : 'true', + 'aria-modal': this.isVisible ? 'true' : null }, on: { keydown: this.onEsc, click: this.onClickOut } }, @@ -856,7 +856,7 @@ export default Vue.extend({ // Wrap modal in transition // Sadly, we can't use BVTransition here due to the differences in - // transtion durations for .modal and .modal-dialog. Not until + // transition durations for .modal and .modal-dialog. Not until // issue https://github.com/vuejs/vue/issues/9986 is resolved modal = h( 'transition', @@ -883,7 +883,7 @@ export default Vue.extend({ // Modal backdrop let backdrop = h(false) - if (!this.hideBackdrop && this.is_visible) { + if (!this.hideBackdrop && this.isVisible) { backdrop = h( 'div', { staticClass: 'modal-backdrop', attrs: { id: this.safeId('__BV_modal_backdrop_') } }, @@ -895,7 +895,7 @@ export default Vue.extend({ // Tab trap to prevent page from scrolling to next element in // tab index during enforce focus tab cycle let tabTrap = h(false) - if (this.is_visible && this.isTop && !this.noEnforceFocus) { + if (this.isVisible && this.isTop && !this.noEnforceFocus) { tabTrap = h('div', { attrs: { tabindex: '0' } }) } // Assemble modal and backdrop in an outer
@@ -912,9 +912,9 @@ export default Vue.extend({ }, render(h) { if (this.static) { - return this.lazy && this.is_hidden ? h(false) : this.makeModal(h) + return this.lazy && this.isHidden ? h(false) : this.makeModal(h) } else { - return this.is_hidden ? h(false) : h(BTransporterSingle, {}, [this.makeModal(h)]) + return this.isHidden ? h(false) : h(BTransporterSingle, {}, [this.makeModal(h)]) } } }) diff --git a/src/components/modal/package.json b/src/components/modal/package.json index cda89a9b447..57ce16275aa 100644 --- a/src/components/modal/package.json +++ b/src/components/modal/package.json @@ -17,7 +17,7 @@ "description": "New modal visibility state. Used to update the v-model", "args": [ { - "arg": "is_visible", + "arg": "isVisible", "description": "true if modal is visible, false otherwise" } ] diff --git a/src/mixins/form-radio-check-group.js b/src/mixins/form-radio-check-group.js index 487fd561ccf..7a241d3447a 100644 --- a/src/mixins/form-radio-check-group.js +++ b/src/mixins/form-radio-check-group.js @@ -78,7 +78,7 @@ export default { const inputs = this.formOptions.map((option, idx) => { const uid = `_BV_option_${idx}_` return h( - this.is_RadioGroup ? BFormRadio : BFormCheckbox, + this.isRadioGroup ? BFormRadio : BFormCheckbox, { key: uid, props: { @@ -101,7 +101,7 @@ export default { class: this.groupClasses, attrs: { id: this.safeId(), - role: this.is_RadioGroup ? 'radiogroup' : 'group', + role: this.isRadioGroup ? 'radiogroup' : 'group', // Tabindex to allow group to be focused if needed tabindex: '-1', 'aria-required': this.required ? 'true' : null, diff --git a/src/mixins/form-radio-check.js b/src/mixins/form-radio-check.js index 638273c3caf..18dc56a0a64 100644 --- a/src/mixins/form-radio-check.js +++ b/src/mixins/form-radio-check.js @@ -49,76 +49,76 @@ export default { }, data() { return { - localChecked: this.is_Group ? this.bvGroup.checked : this.checked, + localChecked: this.isGroup ? this.bvGroup.checked : this.checked, hasFocus: false } }, computed: { computedLocalChecked: { get() { - return this.is_Group ? this.bvGroup.localChecked : this.localChecked + return this.isGroup ? this.bvGroup.localChecked : this.localChecked }, set(val) { - if (this.is_Group) { + if (this.isGroup) { this.bvGroup.localChecked = val } else { this.localChecked = val } } }, - is_Group() { + isGroup() { // Is this check/radio a child of check-group or radio-group? return Boolean(this.bvGroup) }, - is_BtnMode() { + isBtnMode() { // Support button style in single input mode - return this.is_Group ? this.bvGroup.buttons : this.button + return this.isGroup ? this.bvGroup.buttons : this.button }, - is_Plain() { - return this.is_BtnMode ? false : this.is_Group ? this.bvGroup.plain : this.plain + isPlain() { + return this.isBtnMode ? false : this.isGroup ? this.bvGroup.plain : this.plain }, - is_Custom() { - return this.is_BtnMode ? false : !this.is_Plain + isCustom() { + return this.isBtnMode ? false : !this.isPlain }, - is_Switch() { + isSwitch() { // Custom switch styling (checkboxes only) - return this.is_BtnMode || this.is_Radio || this.is_Plain + return this.isBtnMode || this.isRadio || this.isPlain ? false - : this.is_Group + : this.isGroup ? this.bvGroup.switches : this.switch }, - is_Inline() { - return this.is_Group ? this.bvGroup.inline : this.inline + isInline() { + return this.isGroup ? this.bvGroup.inline : this.inline }, - is_Disabled() { + isDisabled() { // Child can be disabled while parent isn't, but is always disabled if group is - return this.is_Group ? this.bvGroup.disabled || this.disabled : this.disabled + return this.isGroup ? this.bvGroup.disabled || this.disabled : this.disabled }, - is_Required() { + isRequired() { // Required only works when a name is provided for the input(s) // Child can only be required when parent is // Groups will always have a name (either user supplied or auto generated) - return Boolean(this.get_Name && (this.is_Group ? this.bvGroup.required : this.required)) + return Boolean(this.getName && (this.isGroup ? this.bvGroup.required : this.required)) }, - get_Name() { + getName() { // Group name preferred over local name - return (this.is_Group ? this.bvGroup.groupName : this.name) || null + return (this.isGroup ? this.bvGroup.groupName : this.name) || null }, - get_Form() { - return (this.is_Group ? this.bvGroup.form : this.form) || null + getForm() { + return (this.isGroup ? this.bvGroup.form : this.form) || null }, - get_Size() { - return (this.is_Group ? this.bvGroup.size : this.size) || '' + getSize() { + return (this.isGroup ? this.bvGroup.size : this.size) || '' }, - get_State() { - return this.is_Group ? this.bvGroup.computedState : this.computedState + getState() { + return this.isGroup ? this.bvGroup.computedState : this.computedState }, - get_ButtonVariant() { + getButtonVariant() { // Local variant preferred over group variant if (this.buttonVariant) { return this.buttonVariant - } else if (this.is_Group && this.bvGroup.buttonVariant) { + } else if (this.isGroup && this.bvGroup.buttonVariant) { return this.bvGroup.buttonVariant } // default variant @@ -128,12 +128,12 @@ export default { // Same for radio & check return [ 'btn', - `btn-${this.get_ButtonVariant}`, - this.get_Size ? `btn-${this.get_Size}` : '', + `btn-${this.getButtonVariant}`, + this.getSize ? `btn-${this.getSize}` : '', // 'disabled' class makes "button" look disabled - this.is_Disabled ? 'disabled' : '', + this.isDisabled ? 'disabled' : '', // 'active' class makes "button" look pressed - this.is_Checked ? 'active' : '', + this.isChecked ? 'active' : '', // Focus class makes button look focused this.hasFocus ? 'focus' : '' ] @@ -158,12 +158,12 @@ export default { }, // Convenience methods for focusing the input focus() { - if (!this.is_Disabled && this.$refs.input && this.$refs.input.focus) { + if (!this.isDisabled && this.$refs.input && this.$refs.input.focus) { this.$refs.input.focus() } }, blur() { - if (!this.is_Disabled && this.$refs.input && this.$refs.input.blur) { + if (!this.isDisabled && this.$refs.input && this.$refs.input.blur) { this.$refs.input.blur() } } @@ -173,7 +173,7 @@ export default { // Generate the input element const on = { change: this.handleChange } - if (this.is_BtnMode) { + if (this.isBtnMode) { // Handlers for focus styling when in button mode on.focus = on.blur = this.handleFocus } @@ -182,12 +182,12 @@ export default { key: 'input', on, class: { - 'form-check-input': this.is_Plain, - 'custom-control-input': this.is_Custom, - 'is-valid': this.get_State === true && !this.is_BtnMode, - 'is-invalid': this.get_State === false && !this.is_BtnMode, + 'form-check-input': this.isPlain, + 'custom-control-input': this.isCustom, + 'is-valid': this.getState === true && !this.isBtnMode, + 'is-invalid': this.getState === false && !this.isBtnMode, // https://github.com/bootstrap-vue/bootstrap-vue/issues/2911 - 'position-static': this.is_Plain && !defaultSlot + 'position-static': this.isPlain && !defaultSlot }, directives: [ { @@ -199,26 +199,26 @@ export default { ], attrs: { id: this.safeId(), - type: this.is_Radio ? 'radio' : 'checkbox', - name: this.get_Name, - form: this.get_Form, - disabled: this.is_Disabled, - required: this.is_Required, + type: this.isRadio ? 'radio' : 'checkbox', + name: this.getName, + form: this.getForm, + disabled: this.isDisabled, + required: this.isRequired, autocomplete: 'off', - 'aria-required': this.is_Required || null, + 'aria-required': this.isRequired || null, 'aria-label': this.ariaLabel || null, 'aria-labelledby': this.ariaLabelledby || null }, domProps: { value: this.value, - checked: this.is_Checked + checked: this.isChecked } }) - if (this.is_BtnMode) { + if (this.isBtnMode) { // Button mode let button = h('label', { class: this.buttonClasses }, [input, defaultSlot]) - if (!this.is_Group) { + if (!this.isGroup) { // Standalone button mode, so wrap in 'btn-group-toggle' // and flag it as inline-block to mimic regular buttons button = h('div', { class: ['btn-group-toggle', 'd-inline-block'] }, [button]) @@ -229,13 +229,13 @@ export default { let label = h(false) // If no label content in plain mode we dont render the label // https://github.com/bootstrap-vue/bootstrap-vue/issues/2911 - if (!(this.is_Plain && !defaultSlot)) { + if (!(this.isPlain && !defaultSlot)) { label = h( 'label', { class: { - 'form-check-label': this.is_Plain, - 'custom-control-label': this.is_Custom + 'form-check-label': this.isPlain, + 'custom-control-label': this.isCustom }, attrs: { for: this.safeId() } }, @@ -247,15 +247,15 @@ export default { 'div', { class: { - 'form-check': this.is_Plain, - 'form-check-inline': this.is_Plain && this.is_Inline, - 'custom-control': this.is_Custom, - 'custom-control-inline': this.is_Custom && this.is_Inline, - 'custom-checkbox': this.is_Custom && this.is_Check && !this.is_Switch, - 'custom-switch': this.is_Switch, - 'custom-radio': this.is_Custom && this.is_Radio, + 'form-check': this.isPlain, + 'form-check-inline': this.isPlain && this.isInline, + 'custom-control': this.isCustom, + 'custom-control-inline': this.isCustom && this.isInline, + 'custom-checkbox': this.isCustom && this.isCheck && !this.isSwitch, + 'custom-switch': this.isSwitch, + 'custom-radio': this.isCustom && this.isRadio, // Temporary until BS V4 supports sizing (most likely in V5) - [`form-control-${this.get_Size}`]: Boolean(this.get_Size && !this.is_BtnMode) + [`form-control-${this.getSize}`]: Boolean(this.getSize && !this.isBtnMode) } }, [input, label]