revert: direct import from components

The previous should have worked, but it didn't, which is odd. Also contains accidental fixes in other components

Author: VividLemon

packages/bootstrap-vue-3/src/BootstrapVue.ts

@@ -1,14 +1,125 @@
 import {App, Plugin} from 'vue'
 import Components from './components'
 import Directives from './directives'
-
 import {BootstrapVueOptions} from './types'
-import {createBreadcrumb} from './composables'
+import {createBreadcrumb, useBreadcrumb} from './composables'
 import './styles/styles.scss'
-
 // All available components
 // Keep this list in sync with /components/index.ts please
-const {
+import BAccordion from './components/BAccordion/BAccordion.vue'
+import BAccordionItem from './components/BAccordion/BAccordionItem.vue'
+import BAlert from './components/BAlert.vue'
+import BAvatar from './components/BAvatar/BAvatar.vue'
+import BAvatarGroup from './components/BAvatar/BAvatarGroup.vue'
+import BBadge from './components/BBadge/BBadge.vue'
+import BBreadcrumb from './components/BBreadcrumb/BBreadcrumb.vue'
+import BBreadcrumbItem from './components/BBreadcrumb/BBreadcrumbItem.vue'
+import BButton from './components/BButton/BButton.vue'
+import BButtonGroup from './components/BButton/BButtonGroup.vue'
+import BButtonToolbar from './components/BButton/BButtonToolbar.vue'
+import BCard from './components/BCard/BCard.vue'
+import BCardBody from './components/BCard/BCardBody.vue'
+import BCardFooter from './components/BCard/BCardFooter.vue'
+import BCardGroup from './components/BCard/BCardGroup.vue'
+import BCardHeader from './components/BCard/BCardHeader.vue'
+import BCardImg from './components/BCard/BCardImg.vue'
+import BCardSubTitle from './components/BCard/BCardSubTitle.vue'
+import BCardText from './components/BCard/BCardText.vue'
+import BCardTitle from './components/BCard/BCardTitle.vue'
+import BCarousel from './components/BCarousel/BCarousel.vue'
+import BCarouselSlide from './components/BCarousel/BCarouselSlide.vue'
+import BCloseButton from './components/BButton/BCloseButton.vue'
+import BCol from './components/BCol.vue'
+import BCollapse from './components/BCollapse.vue'
+import BContainer from './components/BContainer.vue'
+import BDropdown from './components/BDropdown/BDropdown.vue'
+import BDropdownDivider from './components/BDropdown/BDropdownDivider.vue'
+import BDropdownForm from './components/BDropdown/BDropdownForm.vue'
+import BDropdownGroup from './components/BDropdown/BDropdownGroup.vue'
+import BDropdownHeader from './components/BDropdown/BDropdownHeader.vue'
+import BDropdownItem from './components/BDropdown/BDropdownItem.vue'
+import BDropdownItemButton from './components/BDropdown/BDropdownItemButton.vue'
+import BDropdownText from './components/BDropdown/BDropdownText.vue'
+import BForm from './components/BForm/BForm.vue'
+import BFormFloatingLabel from './components/BForm/BFormFloatingLabel.vue'
+import BFormInvalidFeedback from './components/BForm/BFormInvalidFeedback.vue'
+import BFormRow from './components/BForm/BFormRow.vue'
+import BFormText from './components/BForm/BFormText.vue'
+import BFormValidFeedback from './components/BForm/BFormValidFeedback.vue'
+import BFormCheckbox from './components/BFormCheckbox/BFormCheckbox.vue'
+import BFormCheckboxGroup from './components/BFormCheckbox/BFormCheckboxGroup.vue'
+import BFormGroup from './components/BFormGroup/BFormGroup.vue'
+import BFormInput from './components/BFormInput/BFormInput.vue'
+import BFormRadio from './components/BFormRadio'
+import BFormRadioGroup from './components/BFormRadio/BFormRadioGroup.vue'
+import BFormSelect from './components/BFormSelect/BFormSelect.vue'
+import BFormSelectOption from './components/BFormSelect/BFormSelectOption.vue'
+import BFormSelectOptionGroup from './components/BFormSelect/BFormSelectOptionGroup.vue'
+import BFormTag from './components/BFormTags/BFormTag.vue'
+import BFormTags from './components/BFormTags/BFormTags.vue'
+import BFormTextarea from './components/BFormTextarea/BFormTextarea.vue'
+import BImg from './components/BImg.vue'
+import BInputGroup from './components/BInputGroup/BInputGroup.vue'
+import BInputGroupAddon from './components/BInputGroup/BInputGroupAddon.vue'
+import BInputGroupAppend from './components/BInputGroup/BInputGroupAppend.vue'
+import BInputGroupPrepend from './components/BInputGroup/BInputGroupPrepend.vue'
+import BInputGroupText from './components/BInputGroup/BInputGroupText.vue'
+import BLink from './components/BLink/BLink.vue'
+import BListGroup from './components/BListGroup/BListGroup.vue'
+import BListGroupItem from './components/BListGroup/BListGroupItem.vue'
+import BModal from './components/BModal.vue'
+import BNav from './components/BNav.vue'
+import BNavItem from './components/BNavItem.vue'
+import BNavItemDropdown from './components/BNavItemDropdown.vue'
+import BOffcanvas from './components/BOffcanvas.vue'
+import BOverlay from './components/BOverlay/BOverlay.vue'
+import BPagination from './components/BPagination/BPagination.vue'
+import BPopover from './components/BPopover.vue'
+import BProgress from './components/BProgress.vue'
+import BProgressBar from './components/BProgressBar.vue'
+import BRow from './components/BRow.vue'
+import BSkeleton from './components/BSkeleton/BSkeleton.vue'
+import BSkeletonIcon from './components/BSkeleton/BSkeletonIcon.vue'
+import BSkeletonTable from './components/BSkeleton/BSkeletonTable.vue'
+import BSkeletonWrapper from './components/BSkeleton/BSkeletonWrapper.vue'
+import BSpinner from './components/BSpinner.vue'
+import BTab from './components/BTabs/BTab.vue'
+import BTable from './components/BTable/BTable.vue'
+import BTableSimple from './components/BTable/BTableSimple.vue'
+import BTbody from './components/BTable/BTbody.vue'
+import BTd from './components/BTable/BTd.vue'
+import BTfoot from './components/BTable/BTfoot.vue'
+import BTh from './components/BTable/BTh.vue'
+import BThead from './components/BTable/BThead.vue'
+import BTr from './components/BTable/BTr.vue'
+import BTabs from './components/BTabs/BTabs.vue'
+import {BToast, BToaster, BToastPlugin, useToast} from './components/BToast/'
+import BToastContainer from './components/BToast/BToaster.vue'
+import BTransition from './components/BTransition/BTransition.vue'
+
+// Export available composables
+export {useToast}
+
+// Export available plugins
+// Not to be confused with the above main app plugin
+export {BToastPlugin}
+
+// Export available composables
+export {useBreadcrumb}
+
+// Export available directives
+export {
+  BPopover as VBPopover,
+  BToggle as VBToggle,
+  BTooltip as VBTooltip,
+  BVisible as VBVisible,
+} from './directives'
+
+// Export available utils
+export {BvEvent} from './utils'
+
+// Export components
+export {
   BAccordion,
   BAccordionItem,
   BAlert,
@@ -96,51 +207,38 @@ const {
   BThead,
   BTr,
   BTabs,
-  BToastContainer,
-  BTransition,
   BToast,
   BToaster,
-  BToastPlugin,
-} = Components
-
-// Export available composables
-export {useToast} from './components/BToast/'
-
-// Export available plugins
-// Not to be confused with the above main app plugin
-export {BToastPlugin}
-
-// Export utils
-export {BvEvent} from './utils'
-
-// Export available directives
-const {
-  BPopover: VBPopover,
-  BToggle: VBToggle,
-  BTooltip: VBTooltip,
-  BVisible: VBVisible,
-} = Directives
-export {VBPopover, VBToggle, VBTooltip, VBVisible}
-
-// Main app plugin
-const plugin: Plugin = {
-  // TODO: use options in the future
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  install(app: App, options: BootstrapVueOptions = {}) {
-    Object.entries(Components).forEach(([name, component]) => {
-      app.component(name, component)
-    })
-
-    Object.entries(Directives).forEach(([name, component]) => {
-      app.directive(name, component)
-    })
-
-    createBreadcrumb(app)
-  },
+  BToastContainer,
+  BTransition,
 }
 
-export {plugin as BootstrapVue3}
-export default plugin
+// Export types
+export type {
+  InputSize,
+  ColorVariant,
+  Booleanish,
+  BreadcrumbItem,
+  LinkTarget,
+  ButtonVariant,
+  Alignment,
+  TextColorVariant,
+  Size,
+  ButtonType,
+  InputType,
+  Breakpoint,
+  SkeletonAnimation,
+  SkeletonType,
+  VerticalAlign,
+  TableField,
+  TableItem,
+  ContainerPosition,
+  TransitionMode,
+  Position,
+  SpinnerType,
+} from './types'
+export type {BodyProp} from './components/BToast/plugin'
+export type {BPopoverDelayObject} from './types/components'
 
 // Inject all components into the global @vue/runtime-core
 // This allows intellisense in templates w/out direct importing
@@ -241,136 +339,22 @@ declare module '@vue/runtime-core' {
   }
 }
 
-// Export types
-export type {
-  Alignment,
-  Animation,
-  BootstrapVueOptions,
-  BreadcrumbItem,
-  BreadcrumbItemObject,
-  Breakpoint,
-  ColBreakpointProps,
-  RowColsBreakpointProps,
-  OffsetBreakpointProps,
-  OrderBreakpointProps,
-  ButtonType,
-  ButtonVariant,
-  ColorVariant,
-  ContainerVerticalAlign,
-  ContainerHorizontalAlign,
-  ContainerPosition,
-  InputSize,
-  InputType,
-  LinkTarget,
-  LiteralUnion,
-  Pagination,
-  PaginationPage,
-  Position,
-  RadioOption,
-  SelectOption,
-  Size,
-  SkeletonAnimation,
-  SkeletonType,
-  SpinnerType,
-  TableFieldObject,
-  TableField,
-  TableItem,
-  TextColorVariant,
-  TransitionMode,
-  VerticalAlign,
-} from './types'
+// Main app plugin
+const plugin: Plugin = {
+  // TODO: use options in the future
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  install(app: App, options: BootstrapVueOptions = {}) {
+    Object.entries(Components).forEach(([name, component]) => {
+      app.component(name, component)
+    })
 
-// Finally export components
-export {
-  BAccordion,
-  BAccordionItem,
-  BAlert,
-  BAvatar,
-  BAvatarGroup,
-  BBadge,
-  BBreadcrumb,
-  BBreadcrumbItem,
-  BButton,
-  BButtonGroup,
-  BButtonToolbar,
-  BCard,
-  BCardBody,
-  BCardFooter,
-  BCardGroup,
-  BCardHeader,
-  BCardImg,
-  BCardSubTitle,
-  BCardText,
-  BCardTitle,
-  BCarousel,
-  BCarouselSlide,
-  BCloseButton,
-  BCol,
-  BCollapse,
-  BContainer,
-  BDropdown,
-  BDropdownDivider,
-  BDropdownForm,
-  BDropdownGroup,
-  BDropdownHeader,
-  BDropdownItem,
-  BDropdownItemButton,
-  BDropdownText,
-  BForm,
-  BFormFloatingLabel,
-  BFormInvalidFeedback,
-  BFormRow,
-  BFormText,
-  BFormValidFeedback,
-  BFormCheckbox,
-  BFormCheckboxGroup,
-  BFormGroup,
-  BFormInput,
-  BFormRadio,
-  BFormRadioGroup,
-  BFormSelect,
-  BFormSelectOption,
-  BFormSelectOptionGroup,
-  BFormTag,
-  BFormTags,
-  BFormTextarea,
-  BImg,
-  BInputGroup,
-  BInputGroupAddon,
-  BInputGroupAppend,
-  BInputGroupPrepend,
-  BInputGroupText,
-  BLink,
-  BListGroup,
-  BListGroupItem,
-  BModal,
-  BNav,
-  BNavItem,
-  BNavItemDropdown,
-  BOffcanvas,
-  BOverlay,
-  BPagination,
-  BPopover,
-  BProgress,
-  BProgressBar,
-  BRow,
-  BSkeleton,
-  BSkeletonIcon,
-  BSkeletonTable,
-  BSkeletonWrapper,
-  BSpinner,
-  BTab,
-  BTable,
-  BTableSimple,
-  BTbody,
-  BTd,
-  BTfoot,
-  BTh,
-  BThead,
-  BTr,
-  BTabs,
-  BToast,
-  BToaster,
-  BToastContainer,
-  BTransition,
+    Object.entries(Directives).forEach(([name, component]) => {
+      app.directive(name, component)
+    })
+
+    createBreadcrumb(app)
+  },
 }
+
+export {plugin as BootstrapVue3}
+export default plugin

packages/bootstrap-vue-3/src/composables/useBooleanish.ts

@@ -1,4 +1,4 @@
-import {resolveBooleanish} from 'src/utils'
+import {resolveBooleanish} from '../utils'
 import {computed, ComputedRef} from 'vue'
 import {Booleanish} from '../types'
 

packages/bootstrap-vue-3/src/utils/getBreakpointProps.ts

@@ -3,7 +3,7 @@ type PropDefinition = {
   default: any
 }
 
-interface ComponentProps {
+export interface ComponentProps {
   [key: string]: PropDefinition
 }
 

packages/bootstrap-vue-3/src/utils/getClasses.ts

@@ -1,4 +1,4 @@
-interface ComponentProps {
+export interface ComponentProps {
   [key: string]: {type: any[]; default: any}
 }