bootstrap-vue-next 0.9.19 → 0.9.21

package/dist/src/components/BPlaceholder/BPlaceholderTable.vue.d.ts

@@ -16,10 +16,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<string | number>;
         default: number;
     };
-    hideHeader: {
-        type: import("vue").PropType<Booleanish>;
-        default: boolean;
-    };
     headerVariant: {
         type: import("vue").PropType<keyof import("../../types").BaseColorVariant | null>;
         default: undefined;
@@ -28,6 +24,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<string | number>;
         default: number;
     };
+    hideHeader: {
+        type: import("vue").PropType<Booleanish>;
+        default: boolean;
+    };
     headerAnimation: {
         type: import("vue").PropType<PlaceholderAnimation>;
         default: undefined;
@@ -89,10 +89,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<string | number>;
         default: number;
     };
-    hideHeader: {
-        type: import("vue").PropType<Booleanish>;
-        default: boolean;
-    };
     headerVariant: {
         type: import("vue").PropType<keyof import("../../types").BaseColorVariant | null>;
         default: undefined;
@@ -101,6 +97,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<string | number>;
         default: number;
     };
+    hideHeader: {
+        type: import("vue").PropType<Booleanish>;
+        default: boolean;
+    };
     headerAnimation: {
         type: import("vue").PropType<PlaceholderAnimation>;
         default: undefined;
@@ -150,9 +150,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     variant: keyof import("../../types").BaseColorVariant | null;
     animation: PlaceholderAnimation;
     columns: string | number;
-    hideHeader: Booleanish;
     headerVariant: keyof import("../../types").BaseColorVariant | null;
     rows: string | number;
+    hideHeader: Booleanish;
     headerAnimation: PlaceholderAnimation;
     headerSize: PlaceholderSize;
     footerVariant: keyof import("../../types").BaseColorVariant | null;

package/dist/src/components/BPopover.vue.d.ts

@@ -127,7 +127,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<Booleanish>;
         default: boolean;
     };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+}, {
+    hideFn: (e: Event) => void;
+    show: () => void;
+    toggle: (e: Event) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     show: (value: BvTriggerableEvent) => void;
     shown: (value: BvTriggerableEvent) => void;
     hide: (value: BvTriggerableEvent) => void;

package/dist/src/components/BTable/BTable.vue.d.ts

@@ -25,10 +25,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<keyof import("../../types").BaseColorVariant | null>;
         default: undefined;
     };
-    busy: {
-        type: import("vue").PropType<Booleanish>;
-        default: boolean;
-    };
     items: {
         type: import("vue").PropType<TableItem[]>;
         default: () => never[];
@@ -41,6 +37,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<boolean | Breakpoint>;
         default: boolean;
     };
+    busy: {
+        type: import("vue").PropType<Booleanish>;
+        default: boolean;
+    };
     perPage: {
         type: import("vue").PropType<number>;
         default: undefined;
@@ -206,10 +206,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<keyof import("../../types").BaseColorVariant | null>;
         default: undefined;
     };
-    busy: {
-        type: import("vue").PropType<Booleanish>;
-        default: boolean;
-    };
     items: {
         type: import("vue").PropType<TableItem[]>;
         default: () => never[];
@@ -222,6 +218,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<boolean | Breakpoint>;
         default: boolean;
     };
+    busy: {
+        type: import("vue").PropType<Booleanish>;
+        default: boolean;
+    };
     perPage: {
         type: import("vue").PropType<number>;
         default: undefined;
@@ -363,10 +363,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     caption: string;
     align: VerticalAlign;
     variant: keyof import("../../types").BaseColorVariant | null;
-    busy: Booleanish;
     items: TableItem[];
     borderVariant: keyof import("../../types").BaseColorVariant | null;
     stacked: boolean | Breakpoint;
+    busy: Booleanish;
     perPage: number;
     bordered: Booleanish;
     borderless: Booleanish;

package/dist/src/components/BTabs/BTabs.vue.d.ts

@@ -41,14 +41,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<Booleanish>;
         default: boolean;
     };
-    contentClass: {
-        type: import("vue").PropType<any>;
-        default: undefined;
-    };
     card: {
         type: import("vue").PropType<Booleanish>;
         default: boolean;
     };
+    contentClass: {
+        type: import("vue").PropType<any>;
+        default: undefined;
+    };
     justified: {
         type: import("vue").PropType<Booleanish>;
         default: boolean;
@@ -122,14 +122,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: import("vue").PropType<Booleanish>;
         default: boolean;
     };
-    contentClass: {
-        type: import("vue").PropType<any>;
-        default: undefined;
-    };
     card: {
         type: import("vue").PropType<Booleanish>;
         default: boolean;
     };
+    contentClass: {
+        type: import("vue").PropType<any>;
+        default: undefined;
+    };
     justified: {
         type: import("vue").PropType<Booleanish>;
         default: boolean;
@@ -173,8 +173,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     modelValue: number;
     noFade: Booleanish;
     vertical: Booleanish;
-    contentClass: any;
     card: Booleanish;
+    contentClass: any;
     justified: Booleanish;
     pills: Booleanish;
     activeNavItemClass: any;

package/dist/src/components/BToast/BToast.vue.d.ts

@@ -269,18 +269,18 @@ declare const _default: import("vue").DefineComponent<{
     static: Booleanish;
     animation: Booleanish;
     solid: Booleanish;
-    autoHide: Booleanish;
-    noCloseButton: Booleanish;
+    headerTag: string;
     activeClass: string;
     append: Booleanish;
     event: string | unknown[];
     routerComponentName: string;
     routerTag: string;
+    noHoverPause: Booleanish;
     bodyClass: string;
     headerClass: string;
-    headerTag: string;
+    autoHide: Booleanish;
+    noCloseButton: Booleanish;
     isStatus: Booleanish;
-    noHoverPause: Booleanish;
     toastClass: string[];
 }, {}>;
 export default _default;

package/dist/src/components/BTooltip.vue.d.ts

@@ -1,4 +1,8 @@
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, Partial<Record<NonNullable<string | number>, (_: any) => any>>>;
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {
+    hide: ((e: Event) => void) | undefined;
+    show: (() => void) | undefined;
+    toggle: ((e: Event) => void) | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, Partial<Record<NonNullable<string | number>, (_: any) => any>>>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {

package/dist/src/types/BootstrapVueOptions.d.ts

@@ -1,22 +1,16 @@
+import * as Components from '../components';
+import * as Directives from '../directives';
 interface BToastPluginOptions {
     injectkey: symbol;
 }
+export type ComponentType = keyof typeof Components;
+export type DirectiveType = keyof typeof Directives;
+export type ConfigurationOption<T extends string> = Partial<Record<T, boolean>> & {
+    all: boolean;
+};
 export interface BootstrapVueOptions {
-    BAccordion?: Record<string, any>;
-    BAlert?: Record<string, any>;
-    BBadge?: Record<string, any>;
-    BButton?: Record<string, any>;
-    BButtonGroup?: Record<string, any>;
-    BButtonToolbar?: Record<string, any>;
-    BCard?: Record<string, any>;
-    BCollapse?: Record<string, any>;
-    BDropdown?: Record<string, any>;
-    BListGroup?: Record<string, any>;
-    BModal?: Record<string, any>;
-    BOffcanvas?: Record<string, any>;
-    BProgress?: Record<string, any>;
-    BSpinner?: Record<string, any>;
-    BTab?: Record<string, any>;
-    BToast?: BToastPluginOptions;
+    components?: boolean | ConfigurationOption<ComponentType>;
+    directives?: boolean | ConfigurationOption<DirectiveType>;
+    BToast?: boolean | BToastPluginOptions;
 }
 export {};

package/dist/src/types/index.d.ts

@@ -12,7 +12,7 @@ export type { BTableProvider } from './BTableProvider';
 export type { BTableProviderContext } from './BTableProviderContext';
 export type { BTableSortCompare } from './BTableSortCompare';
 export type { Booleanish } from './Booleanish';
-export type { BootstrapVueOptions } from './BootstrapVueOptions';
+export type { BootstrapVueOptions, ConfigurationOption } from './BootstrapVueOptions';
 export type { BreadcrumbItem } from './BreadcrumbItem';
 export type { BreadcrumbItemObject } from './BreadcrumbItemObject';
 export type { Breakpoint } from './Breakpoint';

package/dist/src/utils/index.d.ts

@@ -17,3 +17,4 @@ export * from './stringUtils';
 export * from './keys';
 export { default as getSlotElements } from './getSlotElements';
 export * from './floatingUi';
+export { default as parseActiveImports } from './parseActiveImports';

package/dist/src/utils/parseActiveImports.d.ts

@@ -0,0 +1,3 @@
+import type { ConfigurationOption } from '../types';
+declare const _default: <Type extends string, Base extends ConfigurationOption<Type>>(options: Base, values: Type[]) => Type[];
+export default _default;

package/package.json

@@ -2,15 +2,15 @@
   "name": "bootstrap-vue-next",
   "displayName": "BootstrapVueNext",
   "description": "Early (but lovely) implementation of Vue 3, Bootstrap 5 and Typescript",
-  "version": "0.9.19",
+  "version": "0.9.21",
   "license": "MIT",
   "main": "./dist/bootstrap-vue-next.umd.js",
   "module": "./dist/bootstrap-vue-next.mjs",
   "exports": {
     ".": {
+      "types": "./dist/src/BootstrapVue.d.ts",
       "import": "./dist/bootstrap-vue-next.mjs",
-      "require": "./dist/bootstrap-vue-next.umd.js",
-      "types": "./dist/src/BootstrapVue.d.ts"
+      "require": "./dist/bootstrap-vue-next.umd.js"
     },
     "./dist/bootstrap-vue-next.css": "./dist/bootstrap-vue-next.css",
     "./src/styles/styles.scss": "./src/styles/styles.scss"

package/src/BootstrapVue.ts

@@ -1,10 +1,13 @@
 import type {App, Plugin} from 'vue'
+import {BToastPlugin} from './components'
 import type {BootstrapVueOptions} from './types'
 
 import './styles/styles.scss'
 
 import * as Components from './components'
 import * as Directives from './directives'
+import type {ComponentType, DirectiveType} from './types/BootstrapVueOptions'
+import parseActiveImports from './utils/parseActiveImports'
 
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
@@ -115,20 +118,31 @@ declare module '@vue/runtime-core' {
 
 // 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]) => {
+  install(app: App, options: BootstrapVueOptions = {components: true, directives: true}) {
+    const selectedComponents =
+      typeof options.components === 'boolean' || typeof options.components === 'undefined'
+        ? {all: true}
+        : options.components
+
+    const componentKeys = Object.keys(Components) as unknown as ComponentType[]
+    parseActiveImports(selectedComponents, componentKeys).forEach((name) => {
+      const component = Components[name]
       app.component(name, component)
     })
 
-    Object.entries(Directives).forEach(([name, component]) => {
-      if (name.toLowerCase().startsWith('v')) {
-        app.directive(name.slice(1), component)
-      } else {
-        app.directive(name, component)
-      }
+    const selectedDirectives =
+      typeof options?.directives === 'boolean' || typeof options.directives === 'undefined'
+        ? {all: true}
+        : options?.directives
+
+    const directiveKeys = Object.keys(Directives) as unknown as DirectiveType[]
+    parseActiveImports(selectedDirectives, directiveKeys).forEach((name) => {
+      const parsedName = name.toLowerCase().startsWith('v') ? name.slice(1) : name
+      const directive = Directives[name]
+      app.directive(parsedName, directive)
     })
+
+    if (options?.BToast) app.use(BToastPlugin, options)
   },
 }
 

package/src/components/BPopover.vue

@@ -432,6 +432,12 @@ const hideFn = (e: Event) => {
   }, delay)
 }
 
+defineExpose({
+  hideFn,
+  show,
+  toggle,
+})
+
 const bind = () => {
   // TODO: is this the best way to bind the events?
   // we place a span and get the next element sibling fo rthe listeners

package/src/components/BToast/plugin.ts

@@ -223,9 +223,11 @@ export function useToast(vm?: any, key: symbol = injectkey): ToastInstance | und
 }
 
 const BToastPlugin: Plugin = {
-  install: (app: App, options: BootstrapVueOptions = {}) => {
-    app.provide(fetchKey, options?.BToast?.injectkey ?? injectkey)
-    app.provide(options?.BToast?.injectkey ?? injectkey, new ToastController())
+  install: (app: App, options?: BootstrapVueOptions) => {
+    const key =
+      typeof options?.BToast === 'object' ? options?.BToast?.injectkey ?? injectkey : injectkey
+    app.provide(fetchKey, key)
+    app.provide(key, new ToastController())
   },
 }
 

package/src/components/BTooltip.vue

@@ -1,5 +1,5 @@
 <template>
-  <BPopover tooltip>
+  <BPopover ref="popover" tooltip>
     <template v-for="(_, name) in $slots" #[name]="slotData">
       <slot :name="name" v-bind="slotData" />
     </template>
@@ -7,5 +7,14 @@
 </template>
 
 <script setup lang="ts">
+import {ref} from 'vue'
 import BPopover from './BPopover.vue'
+
+const popover = ref<null | InstanceType<typeof BPopover>>(null)
+
+defineExpose({
+  hide: popover.value?.hideFn,
+  show: popover.value?.show,
+  toggle: popover.value?.toggle,
+})
 </script>

package/src/types/BootstrapVueOptions.ts

@@ -1,24 +1,16 @@
-// TODO: Create the options for every component
+import * as Components from '../components'
+import * as Directives from '../directives'
 
 interface BToastPluginOptions {
   injectkey: symbol
 }
 
+export type ComponentType = keyof typeof Components
+export type DirectiveType = keyof typeof Directives
+export type ConfigurationOption<T extends string> = Partial<Record<T, boolean>> & {all: boolean}
+
 export interface BootstrapVueOptions {
-  BAccordion?: Record<string, any>
-  BAlert?: Record<string, any>
-  BBadge?: Record<string, any>
-  BButton?: Record<string, any>
-  BButtonGroup?: Record<string, any>
-  BButtonToolbar?: Record<string, any>
-  BCard?: Record<string, any>
-  BCollapse?: Record<string, any>
-  BDropdown?: Record<string, any>
-  BListGroup?: Record<string, any>
-  BModal?: Record<string, any>
-  BOffcanvas?: Record<string, any>
-  BProgress?: Record<string, any>
-  BSpinner?: Record<string, any>
-  BTab?: Record<string, any>
-  BToast?: BToastPluginOptions
+  components?: boolean | ConfigurationOption<ComponentType>
+  directives?: boolean | ConfigurationOption<DirectiveType>
+  BToast?: boolean | BToastPluginOptions
 }

package/src/types/index.ts

@@ -12,7 +12,7 @@ export type {BTableProvider} from './BTableProvider'
 export type {BTableProviderContext} from './BTableProviderContext'
 export type {BTableSortCompare} from './BTableSortCompare'
 export type {Booleanish} from './Booleanish'
-export type {BootstrapVueOptions} from './BootstrapVueOptions'
+export type {BootstrapVueOptions, ConfigurationOption} from './BootstrapVueOptions'
 export type {BreadcrumbItem} from './BreadcrumbItem'
 export type {BreadcrumbItemObject} from './BreadcrumbItemObject'
 export type {Breakpoint} from './Breakpoint'

package/src/utils/index.ts

@@ -17,3 +17,4 @@ export * from './stringUtils'
 export * from './keys'
 export {default as getSlotElements} from './getSlotElements'
 export * from './floatingUi'
+export {default as parseActiveImports} from './parseActiveImports'

package/src/utils/parseActiveImports.ts

@@ -0,0 +1,21 @@
+import type {ConfigurationOption} from '../types'
+
+export default <Type extends string, Base extends ConfigurationOption<Type>>(
+  options: Base,
+  values: Type[]
+): Type[] => {
+  const {all, ...others} = options
+  const valuesCopy: Partial<Record<keyof Base, boolean>> = {}
+  if (all) {
+    values.forEach((el) => {
+      valuesCopy[el] = all
+    })
+  }
+  const merge: Record<string, boolean> = {...valuesCopy, ...others}
+  return (
+    Object.entries(merge)
+      // filtering possible invalid keys
+      .filter(([name, value]) => !!value && values.includes(name as Type))
+      .map(([name]) => name as Type)
+  )
+}