bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
176 lines (175 loc) • 6 kB
JavaScript
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../../chunk-CoQrYLCe.js");
const require_keys = require("../../../keys-durSVUrO.js");
const require_src_composables_orchestratorShared_index = require("../orchestratorShared/index.umd.js");
const require_BModal = require("../../../BModal-D0LB339D.js");
require("../../components/index.umd.js");
let vue = require("vue");
//#region src/composables/useModal/index.ts
var useModal = () => {
const orchestratorRegistry = (0, vue.inject)(require_keys.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 {PromiseWithComponent} Returns a promise object with methods to control the modal (show, hide, toggle, get, set, destroy)
*/
const create = (obj = {}, options = {}) => {
if (!_isOrchestratorInstalled.value) throw new Error("BApp component must be mounted to use the modal controller");
const resolvedProps = (0, vue.isRef)(obj) ? obj : (0, vue.shallowRef)(obj);
const _self = resolvedProps.value?.id || Symbol("Modals controller");
const promise = require_src_composables_orchestratorShared_index.buildPromise(_self, store);
promise.stop = (0, vue.watch)(resolvedProps, (_newValue) => {
const newValue = { ...(0, vue.toValue)(_newValue) };
const previousIndex = store.value.findIndex((el) => el._self === _self);
const v = {
type: "modal",
_self,
position: "modal",
...previousIndex === -1 ? { _component: (0, vue.markRaw)(require_BModal.BModal_default) } : store.value[previousIndex],
options,
promise
};
for (const key in newValue) if (key.startsWith("on")) v[key] = newValue[key];
else if (key === "component" && newValue.component) v._component = (0, vue.markRaw)(newValue.component);
else if (key === "slots" && newValue.slots) v.slots = (0, vue.markRaw)(newValue.slots);
else v[key] = (0, vue.toValue)(newValue[key]);
v.modelValue = v.modelValue ?? false;
v["onUpdate:modelValue"] = (val) => {
const onUpdateModelValue = newValue["onUpdate:modelValue"];
onUpdateModelValue?.(val);
const { modelValue } = (0, vue.toValue)(obj);
if ((0, vue.isRef)(obj) && !(0, vue.isRef)(modelValue)) obj.value.modelValue = val;
if ((0, vue.isRef)(modelValue) && !(0, vue.isReadonly)(modelValue)) modelValue.value = val;
const modal = store.value.find((el) => el._self === _self);
if (modal) modal.modelValue = val;
};
if (previousIndex === -1) store.value.push(v);
else store.value.splice(previousIndex, 1, v);
}, {
immediate: true,
deep: true
});
(0, vue.onScopeDispose)(() => {
const modal = store.value.find((el) => el._self === _self);
if (modal) modal.promise.value.destroy?.();
}, true);
return promise.value;
};
const { lastStack, stack, registry } = require_BModal.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.find((el) => el._self === id);
if (modal) {
modal.modelValue = true;
modal["onUpdate: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.find((el) => el._self === id);
if (modal) {
modal.modelValue = false;
modal["onUpdate: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.find((el) => el._self === id);
if (modal) return {
modal,
show() {
modal?.promise.value.show();
},
hide(trigger) {
modal?.promise.value.hide(trigger);
}
};
if (registry?.value) {
for (const [, modal] of registry?.value.entries() ?? []) if ((0, vue.toValue)(modal.exposed?.id) === id) return {
modal,
show() {
modal.exposed?.show();
},
hide(trigger) {
modal.exposed?.hide(trigger, true);
}
};
}
return null;
};
const instance = (0, vue.getCurrentInstance)();
const current = () => {
const findBModal = (component) => {
if (!component.parent) return null;
if (component.parent.type === require_BModal.BModal_default) return component.parent;
return findBModal(component.parent);
};
if (!instance) return null;
const modalComponent = (0, vue.computed)(() => findBModal(instance));
return {
show() {
modalComponent.value?.exposed?.show();
},
hide(trigger) {
modalComponent.value?.exposed?.hide(trigger, true);
},
modal: (0, vue.computed)(() => modalComponent.value?.proxy)
};
};
return {
show,
hide,
hideAll,
get,
current,
create,
_isOrchestratorInstalled,
store
};
};
/**
* @deprecated use useModal() instead.
* @returns {ReturnType<typeof useModal>} The modal controller
*/
var useModalController = useModal;
//#endregion
exports.useModal = useModal;
exports.useModalController = useModalController;
//# sourceMappingURL=index.umd.js.map