123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132 |
- import { getCurrentInstance, computed, watch, onMounted } from 'vue';
- import { buildProp, definePropType } from '../../utils/vue/props/runtime.mjs';
- import { isBoolean } from '../../utils/types.mjs';
- import { isFunction } from '@vue/shared';
- import { isClient } from '@vueuse/core';
- 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 useModelToggleEmits2 = [updateEventKey];
- const useModelToggleProps2 = {
- [name]: _prop,
- [updateEventKeyRaw]: _event
- };
- const useModelToggle2 = ({
- 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: useModelToggle2,
- useModelToggleProps: useModelToggleProps2,
- useModelToggleEmits: useModelToggleEmits2
- };
- };
- const { useModelToggle, useModelToggleProps, useModelToggleEmits } = createModelToggleComposable("modelValue");
- export { createModelToggleComposable, useModelToggle, useModelToggleEmits, useModelToggleProps };
- //# sourceMappingURL=index.mjs.map
|