fix: clean up props inheritance (#6265)

jacobmllr95 · web-flow · commit 79784ae6e03f · 2020-12-29T10:48:42.000+01:00
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -23,10 +23,7 @@ export const BIconstack = /*#__PURE__*/ Vue.extend({
       BVIconBase,
       mergeData(data, {
         staticClass: 'b-iconstack',
-        props: {
-          ...props,
-          stacked: false
-        }
+        props
       }),
       children
     )
