diff --git a/src/components/collapse/helpers/bv-collapse.js b/src/components/collapse/helpers/bv-collapse.js index 208366dca75..5b4b6806379 100644 --- a/src/components/collapse/helpers/bv-collapse.js +++ b/src/components/collapse/helpers/bv-collapse.js @@ -7,7 +7,9 @@ // in-place after the transition completes import { Vue, mergeData } from '../../../vue' import { NAME_COLLAPSE_HELPER } from '../../../constants/components' +import { PROP_TYPE_BOOLEAN } from '../../../constants/props' import { getBCR, reflow, removeStyle, requestAF, setStyle } from '../../../utils/dom' +import { makeProp } from '../../../utils/props' // --- Helper methods --- @@ -62,17 +64,18 @@ const TRANSITION_HANDLERS = { // --- Main component --- +export const props = { + // // If `true` (and `visible` is `true` on mount), animate initially visible + appear: makeProp(PROP_TYPE_BOOLEAN, false) +} + +// --- Main component --- + // @vue/component export const BVCollapse = /*#__PURE__*/ Vue.extend({ name: NAME_COLLAPSE_HELPER, functional: true, - props: { - appear: { - // If `true` (and `visible` is `true` on mount), animate initially visible - type: Boolean, - default: false - } - }, + props, render(h, { props, data, children }) { return h( 'transition', diff --git a/src/components/dropdown/dropdown-item.js b/src/components/dropdown/dropdown-item.js index eed521e809a..d2bb1da1d58 100644 --- a/src/components/dropdown/dropdown-item.js +++ b/src/components/dropdown/dropdown-item.js @@ -4,16 +4,18 @@ import { EVENT_NAME_CLICK } from '../../constants/events' import { PROP_TYPE_ARRAY_OBJECT_STRING, PROP_TYPE_STRING } from '../../constants/props' import { requestAF } from '../../utils/dom' import { omit, sortKeys } from '../../utils/object' -import { makeProp, makePropsConfigurable } from '../../utils/props' +import { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props' import { attrsMixin } from '../../mixins/attrs' import { normalizeSlotMixin } from '../../mixins/normalize-slot' import { BLink, props as BLinkProps } from '../link/link' // --- Props --- +const linkProps = omit(BLinkProps, ['event', 'routerTag']) + export const props = makePropsConfigurable( sortKeys({ - ...omit(BLinkProps, ['event', 'routerTag']), + ...linkProps, linkClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING), variant: makeProp(PROP_TYPE_STRING) }), @@ -69,7 +71,7 @@ export const BDropdownItem = /*#__PURE__*/ Vue.extend({ { staticClass: 'dropdown-item', class: [linkClass, { [`text-${variant}`]: variant && !(active || disabled) }], - props: this.$props, + props: pluckProps(linkProps, this.$props), attrs: this.computedAttrs, on: { click: onClick }, ref: 'item' diff --git a/src/components/nav/nav-form.js b/src/components/nav/nav-form.js index 5f530858e55..2a95547019f 100644 --- a/src/components/nav/nav-form.js +++ b/src/components/nav/nav-form.js @@ -2,14 +2,16 @@ import { Vue, mergeData } from '../../vue' import { NAME_NAV_FORM } from '../../constants/components' import { PROP_TYPE_ARRAY_OBJECT_STRING } from '../../constants/props' import { omit, sortKeys } from '../../utils/object' -import { makeProp, makePropsConfigurable } from '../../utils/props' +import { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props' import { BForm, props as BFormProps } from '../form/form' // --- Props --- +const formProps = omit(BFormProps, ['inline']) + export const props = makePropsConfigurable( sortKeys({ - ...omit(BFormProps, ['inline']), + ...formProps, formClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING) }), NAME_NAV_FORM @@ -28,7 +30,7 @@ export const BNavForm = /*#__PURE__*/ Vue.extend({ { class: props.formClass, props: { - ...props, + ...pluckProps(formProps, props), inline: true }, attrs: data.attrs, diff --git a/src/components/nav/nav-item.js b/src/components/nav/nav-item.js index 4a8a54b19b6..c634f9c556b 100644 --- a/src/components/nav/nav-item.js +++ b/src/components/nav/nav-item.js @@ -2,14 +2,16 @@ import { Vue, mergeData } from '../../vue' import { NAME_NAV_ITEM } from '../../constants/components' import { PROP_TYPE_ARRAY_OBJECT_STRING, PROP_TYPE_OBJECT } from '../../constants/props' import { omit, sortKeys } from '../../utils/object' -import { makeProp, makePropsConfigurable } from '../../utils/props' +import { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props' import { BLink, props as BLinkProps } from '../link/link' // --- Props --- +const linkProps = omit(BLinkProps, ['event', 'routerTag']) + export const props = makePropsConfigurable( sortKeys({ - ...omit(BLinkProps, ['event', 'routerTag']), + ...linkProps, linkAttrs: makeProp(PROP_TYPE_OBJECT, {}), linkClasses: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING) }), @@ -36,7 +38,7 @@ export const BNavItem = /*#__PURE__*/ Vue.extend({ staticClass: 'nav-link', class: props.linkClasses, attrs: props.linkAttrs, - props, + props: pluckProps(linkProps, props), on: listeners }, children diff --git a/src/icons/helpers/make-icon.js b/src/icons/helpers/make-icon.js index 5bdfd96d016..c536bf50250 100644 --- a/src/icons/helpers/make-icon.js +++ b/src/icons/helpers/make-icon.js @@ -1,7 +1,5 @@ import { Vue, mergeData } from '../../vue' -import { PROP_TYPE_BOOLEAN } from '../../constants/props' import { omit } from '../../utils/object' -import { makeProp } from '../../utils/props' import { kebabCase, pascalCase, trim } from '../../utils/string' import { BVIconBase, props as BVIconBaseProps } from './icon-base' @@ -24,10 +22,7 @@ export const makeIcon = (name, content) => { return /*#__PURE__*/ Vue.extend({ name: iconName, functional: true, - props: { - ...omit(BVIconBaseProps, ['content', 'stacked']), - stacked: makeProp(PROP_TYPE_BOOLEAN, false) - }, + props: omit(BVIconBaseProps, ['content']), render(h, { data, props }) { return h( BVIconBase, diff --git a/src/icons/icon.js b/src/icons/icon.js index 36510b48e1e..49c7f9d7bac 100644 --- a/src/icons/icon.js +++ b/src/icons/icon.js @@ -1,9 +1,9 @@ import { Vue, mergeData } from '../vue' import { NAME_ICON } from '../constants/components' -import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../constants/props' +import { PROP_TYPE_STRING } from '../constants/props' import { RX_ICON_PREFIX } from '../constants/regex' import { omit, sortKeys } from '../utils/object' -import { makeProp, makePropsConfigurable } from '../utils/props' +import { makeProp, makePropsConfigurable, pluckProps } from '../utils/props' import { pascalCase, trim } from '../utils/string' import { BIconBlank } from './icons' import { props as BVIconBaseProps } from './helpers/icon-base' @@ -21,11 +21,12 @@ const findIconComponent = (ctx, iconName) => { // --- Props --- +const iconProps = omit(BVIconBaseProps, ['content']) + export const props = makePropsConfigurable( sortKeys({ - ...omit(BVIconBaseProps, ['content', 'stacked']), - icon: makeProp(PROP_TYPE_STRING), - stacked: makeProp(PROP_TYPE_BOOLEAN, false) + ...iconProps, + icon: makeProp(PROP_TYPE_STRING) }), NAME_ICON ) @@ -47,7 +48,7 @@ export const BIcon = /*#__PURE__*/ Vue.extend({ // If not registered, we render a blank icon return h( icon ? findIconComponent(parent, `BIcon${icon}`) || BIconBlank : BIconBlank, - mergeData(data, { props: { ...props, icon: null } }) + mergeData(data, { props: pluckProps(iconProps, props) }) ) } }) diff --git a/src/icons/iconstack.js b/src/icons/iconstack.js index d8fe50a0390..f0411fc74a8 100644 --- a/src/icons/iconstack.js +++ b/src/icons/iconstack.js @@ -23,10 +23,7 @@ export const BIconstack = /*#__PURE__*/ Vue.extend({ BVIconBase, mergeData(data, { staticClass: 'b-iconstack', - props: { - ...props, - stacked: false - } + props }), children )