| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485 |
- import { isClient } from "../../utils/browser.mjs";
- import { isBoolean, isFunction } from "../../utils/types.mjs";
- import { buildProp, definePropType } from "../../utils/vue/props/runtime.mjs";
- import { computed, getCurrentInstance, onMounted, watch } from "vue";
- //#region ../../packages/hooks/use-model-toggle/index.ts
- const _prop = buildProp({
- type: definePropType(Boolean),
- default: null
- });
- const _event = buildProp({ type: definePropType(Function) });
- const createModelToggleComposable = (name) => {
- const updateEventKey = `update:${name}`;
- const updateEventKeyRaw = `onUpdate:${name}`;
- const useModelToggleEmits = [updateEventKey];
- const useModelToggleProps = {
- [name]: _prop,
- [updateEventKeyRaw]: _event
- };
- const useModelToggle = ({ indicator, toggleReason, shouldHideWhenRouteChanges, shouldProceed, onShow, onHide }) => {
- const instance = getCurrentInstance();
- const { emit } = instance;
- const props = instance.props;
- const hasUpdateHandler = computed(() => isFunction(props[updateEventKeyRaw]));
- const isModelBindingAbsent = computed(() => props[name] === null);
- const doShow = (event) => {
- if (indicator.value === true) return;
- indicator.value = true;
- if (toggleReason) toggleReason.value = event;
- if (isFunction(onShow)) onShow(event);
- };
- const doHide = (event) => {
- if (indicator.value === false) return;
- indicator.value = false;
- if (toggleReason) toggleReason.value = event;
- if (isFunction(onHide)) onHide(event);
- };
- const show = (event) => {
- if (props.disabled === true || isFunction(shouldProceed) && !shouldProceed()) return;
- const shouldEmit = hasUpdateHandler.value && isClient;
- if (shouldEmit) emit(updateEventKey, true);
- if (isModelBindingAbsent.value || !shouldEmit) doShow(event);
- };
- const hide = (event) => {
- if (props.disabled === true || !isClient) return;
- const shouldEmit = hasUpdateHandler.value && isClient;
- if (shouldEmit) emit(updateEventKey, false);
- if (isModelBindingAbsent.value || !shouldEmit) doHide(event);
- };
- const onChange = (val) => {
- if (!isBoolean(val)) return;
- if (props.disabled && val) {
- if (hasUpdateHandler.value) emit(updateEventKey, false);
- } else if (indicator.value !== val) if (val) doShow();
- else doHide();
- };
- const toggle = () => {
- if (indicator.value) hide();
- else show();
- };
- watch(() => props[name], onChange);
- if (shouldHideWhenRouteChanges && instance.appContext.config.globalProperties.$route !== void 0) watch(() => ({ ...instance.proxy.$route }), () => {
- if (shouldHideWhenRouteChanges.value && indicator.value) hide();
- });
- onMounted(() => {
- onChange(props[name]);
- });
- return {
- hide,
- show,
- toggle,
- hasUpdateHandler
- };
- };
- return {
- useModelToggle,
- useModelToggleProps,
- useModelToggleEmits
- };
- };
- const { useModelToggle, useModelToggleProps, useModelToggleEmits } = createModelToggleComposable("modelValue");
- //#endregion
- export { createModelToggleComposable, useModelToggle, useModelToggleEmits, useModelToggleProps };
- //# sourceMappingURL=index.mjs.map
|