bootstrap-vue-next/dist/src/composables/useModal/index.mjs

Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development

import { _ as orchestratorRegistryKey } from "../../../keys-BgLwJbLV.js";
import { buildController, getOrchestratorControllerId } from "../orchestratorShared/index.mjs";
import { n as useSharedModalStack, t as BModal_default } from "../../../BModal-NPsCBNo7.js";
import { computed, getCurrentInstance, inject, markRaw, onScopeDispose, ref, toValue } from "vue";
//#region src/composables/useModal/index.ts
var useModal = () => {
	const orchestratorRegistry = inject(orchestratorRegistryKey, null);
	if (!orchestratorRegistry) throw Error("useModal() must be called within setup(), and BApp, useRegistry or plugin must be installed/provided.");
	const { store, _isOrchestratorInstalled } = orchestratorRegistry;
	/**
	* @returns {ComponentController<typeof BModal, Ref<ModalOrchestratorArrayValue>>}
	*/
	function create(obj = {}) {
		if (!_isOrchestratorInstalled.value) throw new Error("BApp component must be mounted to use the modal controller");
		const modalComp = markRaw(BModal_default);
		const resolvedProps = ref(obj);
		const modalStore = computed(() => store.value.modal);
		const { htmlAttributeId, storeId } = getOrchestratorControllerId(resolvedProps.value.id);
		const { resolve, controller } = buildController(storeId, modalStore);
		const value = computed({
			get: () => {
				const { component = modalComp, options, slots, ...props } = resolvedProps.value;
				return {
					component,
					options,
					slots,
					fns: {
						resolve,
						setRef: (v) => {
							controller.ref = v;
						},
						destroy: controller.destroy
					},
					id: storeId,
					props: {
						...props,
						id: htmlAttributeId
					}
				};
			},
			set: (v) => {
				resolvedProps.value = {
					...resolvedProps.value,
					...v.props
				};
			}
		});
		modalStore.value.set(storeId, value);
		onScopeDispose(async () => {
			await controller[Symbol.asyncDispose]();
		}, true);
		return controller;
	}
	const { lastStack, stack, registry } = useSharedModalStack();
	/**
	* Show a modal
	* @param id - The id of the modal to show
	*/
	const show = (id) => {
		if (id === void 0) {
			if (lastStack?.value) lastStack?.value.exposed?.show();
		} else {
			const stackModal = stack?.value.find((modal) => modal.exposed?.id === id);
			if (stackModal) {
				stackModal.exposed?.show();
				return;
			}
			const modal = store.value.modal.get(id);
			if (modal?.value) modal.value = {
				...modal.value,
				props: {
					...modal.value.props,
					modelValue: true
				}
			};
			else stack?.value.forEach((modal) => {
				if (modal.exposed?.id === id) modal.exposed?.show();
			});
		}
	};
	/**
	* Hide a modal
	* @param trigger - The trigger to hide the modal
	* @param id - The id of the modal to hide
	*/
	const hide = (trigger, id) => {
		if (id === void 0) {
			if (lastStack?.value) lastStack?.value.exposed?.hide(trigger);
		} else {
			const stackModal = stack?.value.find((modal) => modal.exposed?.id === id);
			if (stackModal) {
				stackModal.exposed?.hide(trigger);
				return;
			}
			const modal = store.value.modal.get(id);
			if (modal?.value) modal.value = {
				...modal.value,
				props: {
					...modal.value.props,
					modelValue: false
				}
			};
			else stack?.value.forEach((modal) => {
				if (modal.exposed?.id === id) modal.exposed?.hide(trigger, true);
			});
		}
	};
	/**
	* Hide all modals
	* @param trigger - The trigger to hide all modals
	*/
	const hideAll = (trigger) => {
		stack?.value.forEach((modal) => {
			modal.exposed?.hide(trigger, true);
		});
	};
	const get = (id) => {
		const modal = store.value.modal.get(id);
		if (modal) return {
			modal,
			show() {
				show(id);
			},
			hide(trigger) {
				hide(trigger, id);
			}
		};
		if (registry?.value) {
			for (const [, modal] of registry?.value.entries() ?? []) if (toValue(modal.exposed?.id) === id) return {
				modal,
				show() {
					modal.exposed?.show();
				},
				hide(trigger) {
					modal.exposed?.hide(trigger, true);
				}
			};
		}
		return null;
	};
	const instance = getCurrentInstance();
	const current = () => {
		const findBModal = (component) => {
			if (!component.parent) return null;
			if (component.parent.type === BModal_default) return component.parent;
			return findBModal(component.parent);
		};
		if (!instance) return null;
		const modalComponent = computed(() => findBModal(instance));
		return {
			show() {
				modalComponent.value?.exposed?.show();
			},
			hide(trigger) {
				modalComponent.value?.exposed?.hide(trigger, true);
			},
			modal: computed(() => modalComponent.value?.proxy)
		};
	};
	return {
		show,
		hide,
		hideAll,
		get,
		current,
		create,
		_isOrchestratorInstalled,
		store
	};
};
//#endregion
export { useModal };

//# sourceMappingURL=index.mjs.map