Skip to content
This repository was archived by the owner on Mar 27, 2025. It is now read-only.

Commit 06ef76e

Browse files
authored
Merge pull request bootstrap-vue-next#1170 from sfe-efficy/feature/install-use-options
feat: use options in to install plugin to allow select some component…
2 parents e2e08fe + 319c20e commit 06ef76e

File tree

9 files changed

+86
-46
lines changed

9 files changed

+86
-46
lines changed

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

Lines changed: 24 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
import type {App, Plugin} from 'vue'
2+
import {BToastPlugin} from './components'
23
import type {BootstrapVueOptions} from './types'
34

45
import './styles/styles.scss'
56

67
import * as Components from './components'
78
import * as Directives from './directives'
9+
import type {ComponentType, DirectiveType} from './types/BootstrapVueOptions'
10+
import parseActiveImports from './utils/parseActiveImports'
811

912
declare module '@vue/runtime-core' {
1013
export interface GlobalComponents {
@@ -115,20 +118,31 @@ declare module '@vue/runtime-core' {
115118

116119
// Main app plugin
117120
const plugin: Plugin = {
118-
// TODO: use options in the future
119-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
120-
install(app: App, options: BootstrapVueOptions = {}) {
121-
Object.entries(Components).forEach(([name, component]) => {
121+
install(app: App, options: BootstrapVueOptions = {components: true, directives: true}) {
122+
const selectedComponents =
123+
typeof options.components === 'boolean' || typeof options.components === 'undefined'
124+
? {all: true}
125+
: options.components
126+
127+
const componentKeys = Object.keys(Components) as unknown as ComponentType[]
128+
parseActiveImports(selectedComponents, componentKeys).forEach((name) => {
129+
const component = Components[name]
122130
app.component(name, component)
123131
})
124132

125-
Object.entries(Directives).forEach(([name, component]) => {
126-
if (name.toLowerCase().startsWith('v')) {
127-
app.directive(name.slice(1), component)
128-
} else {
129-
app.directive(name, component)
130-
}
133+
const selectedDirectives =
134+
typeof options?.directives === 'boolean' || typeof options.directives === 'undefined'
135+
? {all: true}
136+
: options?.directives
137+
138+
const directiveKeys = Object.keys(Directives) as unknown as DirectiveType[]
139+
parseActiveImports(selectedDirectives, directiveKeys).forEach((name) => {
140+
const parsedName = name.toLowerCase().startsWith('v') ? name.slice(1) : name
141+
const directive = Directives[name]
142+
app.directive(parsedName, directive)
131143
})
144+
145+
if (options?.BToast) app.use(BToastPlugin, options)
132146
},
133147
}
134148

packages/bootstrap-vue-next/src/components/BToast/plugin.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -223,9 +223,11 @@ export function useToast(vm?: any, key: symbol = injectkey): ToastInstance | und
223223
}
224224

225225
const BToastPlugin: Plugin = {
226-
install: (app: App, options: BootstrapVueOptions = {}) => {
227-
app.provide(fetchKey, options?.BToast?.injectkey ?? injectkey)
228-
app.provide(options?.BToast?.injectkey ?? injectkey, new ToastController())
226+
install: (app: App, options?: BootstrapVueOptions) => {
227+
const key =
228+
typeof options?.BToast === 'object' ? options?.BToast?.injectkey ?? injectkey : injectkey
229+
app.provide(fetchKey, key)
230+
app.provide(key, new ToastController())
229231
},
230232
}
231233

Lines changed: 9 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,16 @@
1-
// TODO: Create the options for every component
1+
import * as Components from '../components'
2+
import * as Directives from '../directives'
23

34
interface BToastPluginOptions {
45
injectkey: symbol
56
}
67

8+
export type ComponentType = keyof typeof Components
9+
export type DirectiveType = keyof typeof Directives
10+
export type ConfigurationOption<T extends string> = Partial<Record<T, boolean>> & {all: boolean}
11+
712
export interface BootstrapVueOptions {
8-
BAccordion?: Record<string, any>
9-
BAlert?: Record<string, any>
10-
BBadge?: Record<string, any>
11-
BButton?: Record<string, any>
12-
BButtonGroup?: Record<string, any>
13-
BButtonToolbar?: Record<string, any>
14-
BCard?: Record<string, any>
15-
BCollapse?: Record<string, any>
16-
BDropdown?: Record<string, any>
17-
BListGroup?: Record<string, any>
18-
BModal?: Record<string, any>
19-
BOffcanvas?: Record<string, any>
20-
BProgress?: Record<string, any>
21-
BSpinner?: Record<string, any>
22-
BTab?: Record<string, any>
23-
BToast?: BToastPluginOptions
13+
components?: boolean | ConfigurationOption<ComponentType>
14+
directives?: boolean | ConfigurationOption<DirectiveType>
15+
BToast?: boolean | BToastPluginOptions
2416
}

packages/bootstrap-vue-next/src/types/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export type {BTableProvider} from './BTableProvider'
1212
export type {BTableProviderContext} from './BTableProviderContext'
1313
export type {BTableSortCompare} from './BTableSortCompare'
1414
export type {Booleanish} from './Booleanish'
15-
export type {BootstrapVueOptions} from './BootstrapVueOptions'
15+
export type {BootstrapVueOptions, ConfigurationOption} from './BootstrapVueOptions'
1616
export type {BreadcrumbItem} from './BreadcrumbItem'
1717
export type {BreadcrumbItemObject} from './BreadcrumbItemObject'
1818
export type {Breakpoint} from './Breakpoint'

packages/bootstrap-vue-next/src/utils/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,3 +17,4 @@ export * from './stringUtils'
1717
export * from './keys'
1818
export {default as getSlotElements} from './getSlotElements'
1919
export * from './floatingUi'
20+
export {default as parseActiveImports} from './parseActiveImports'
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import type {ConfigurationOption} from '../types'
2+
3+
export default <Type extends string, Base extends ConfigurationOption<Type>>(
4+
options: Base,
5+
values: Type[]
6+
): Type[] => {
7+
const {all, ...others} = options
8+
const valuesCopy: Partial<Record<keyof Base, boolean>> = {}
9+
if (all) {
10+
values.forEach((el) => {
11+
valuesCopy[el] = all
12+
})
13+
}
14+
const merge: Record<string, boolean> = {...valuesCopy, ...others}
15+
return (
16+
Object.entries(merge)
17+
// filtering possible invalid keys
18+
.filter(([name, value]) => !!value && values.includes(name as Type))
19+
.map(([name]) => name as Type)
20+
)
21+
}

packages/nuxt/src/module.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,10 +31,10 @@ export default defineNuxtModule<ModuleOptions>({
3131

3232
const arr: Import[] = []
3333
if (Object.values(normalizedComposables).some((el) => el === true)) {
34-
const imports = parseActiveImports(normalizedComposables, {
35-
useBreadcrumb: false,
36-
useColorMode: false,
37-
}).map(
34+
const imports = parseActiveImports(normalizedComposables, [
35+
'useBreadcrumb',
36+
'useColorMode',
37+
]).map(
3838
(el) =>
3939
({
4040
from: resolver.resolve('./runtime/composables'),
Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
import type {Composables} from 'bootstrap-vue-next'
22

3+
export type ComposableType = keyof typeof Composables
4+
export type ConfigurationOption<T extends string> = Partial<Record<T, boolean>> & {all: boolean}
5+
36
export interface ModuleOptions {
4-
composables: (Partial<Record<keyof typeof Composables, boolean>> & {all: boolean}) | boolean
7+
composables: ConfigurationOption<ComposableType> | boolean
58
}
Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,21 @@
1-
export default <Base extends Record<string, boolean> & {all: boolean}>(
1+
import {ConfigurationOption} from '../types/ModuleOptions'
2+
3+
export default <Type extends string, Base extends ConfigurationOption<Type>>(
24
options: Base,
3-
values: Omit<Base, 'all'>
4-
): string[] => {
5+
values: Type[]
6+
): Type[] => {
57
const {all, ...others} = options
6-
const valuesCopy: Record<string, boolean> = {...values}
7-
Object.keys(valuesCopy).forEach((el) => {
8-
valuesCopy[el] = all
9-
})
8+
const valuesCopy: Partial<Record<keyof Base, boolean>> = {}
9+
if (all) {
10+
values.forEach((el) => {
11+
valuesCopy[el] = all
12+
})
13+
}
1014
const merge: Record<string, boolean> = {...valuesCopy, ...others}
11-
return Object.entries(merge)
12-
.filter(([, value]) => value === true)
13-
.map(([name]) => name) as string[]
15+
return (
16+
Object.entries(merge)
17+
// filtering possible invalid keys
18+
.filter(([name, value]) => !!value && values.includes(name as Type))
19+
.map(([name]) => name as Type)
20+
)
1421
}

0 commit comments

Comments
 (0)