element-plus
Version:
A Component Library for Vue 3
1 lines • 8.79 kB
Source Map (JSON)
{"version":3,"file":"index.mjs","sources":["../../../../../packages/hooks/use-model-toggle/index.ts"],"sourcesContent":["import { computed, getCurrentInstance, onMounted, watch } from 'vue'\nimport {\n buildProp,\n definePropType,\n isBoolean,\n isClient,\n isFunction,\n} from '@element-plus/utils'\n\nimport type { ExtractPropType } from '@element-plus/utils'\nimport type { RouteLocationNormalizedLoaded } from 'vue-router'\nimport type {\n ComponentPublicInstance,\n ExtractPropTypes,\n ExtractPublicPropTypes,\n Ref,\n} from 'vue'\n\nconst _prop = buildProp({\n type: definePropType<boolean | null>(Boolean),\n default: null,\n} as const)\nconst _event = buildProp({\n type: definePropType<(val: boolean) => void>(Function),\n} as const)\n\nexport type UseModelTogglePropsRaw<T extends string> = {\n [K in T]: typeof _prop\n} & {\n [K in `onUpdate:${T}`]: typeof _event\n}\n\nexport type UseModelTogglePropsGeneric<T extends string> = {\n [K in T]: ExtractPropType<typeof _prop>\n} & {\n [K in `onUpdate:${T}`]: ExtractPropType<typeof _event>\n}\n\nexport const createModelToggleComposable = <T extends string>(name: T) => {\n const updateEventKey = `update:${name}` as const\n const updateEventKeyRaw = `onUpdate:${name}` as const\n const useModelToggleEmits = [updateEventKey]\n\n const useModelToggleProps = {\n [name]: _prop,\n [updateEventKeyRaw]: _event,\n } as UseModelTogglePropsRaw<T>\n\n const useModelToggle = ({\n indicator,\n toggleReason,\n shouldHideWhenRouteChanges,\n shouldProceed,\n onShow,\n onHide,\n }: ModelToggleParams) => {\n const instance = getCurrentInstance()!\n const { emit } = instance\n const props = instance.props as UseModelTogglePropsGeneric<T> & {\n disabled: boolean\n }\n const hasUpdateHandler = computed(() =>\n isFunction(props[updateEventKeyRaw])\n )\n // when it matches the default value we say this is absent\n // though this could be mistakenly passed from the user but we need to rule out that\n // condition\n const isModelBindingAbsent = computed(() => props[name] === null)\n\n const doShow = (event?: Event) => {\n if (indicator.value === true) {\n return\n }\n\n indicator.value = true\n if (toggleReason) {\n toggleReason.value = event\n }\n if (isFunction(onShow)) {\n onShow(event)\n }\n }\n\n const doHide = (event?: Event) => {\n if (indicator.value === false) {\n return\n }\n\n indicator.value = false\n if (toggleReason) {\n toggleReason.value = event\n }\n if (isFunction(onHide)) {\n onHide(event)\n }\n }\n\n const show = (event?: Event) => {\n if (\n props.disabled === true ||\n (isFunction(shouldProceed) && !shouldProceed())\n )\n return\n\n const shouldEmit = hasUpdateHandler.value && isClient\n\n if (shouldEmit) {\n emit(updateEventKey, true)\n }\n\n if (isModelBindingAbsent.value || !shouldEmit) {\n doShow(event)\n }\n }\n\n const hide = (event?: Event) => {\n if (props.disabled === true || !isClient) return\n\n const shouldEmit = hasUpdateHandler.value && isClient\n\n if (shouldEmit) {\n emit(updateEventKey, false)\n }\n\n if (isModelBindingAbsent.value || !shouldEmit) {\n doHide(event)\n }\n }\n\n const onChange = (val: boolean) => {\n if (!isBoolean(val)) return\n if (props.disabled && val) {\n if (hasUpdateHandler.value) {\n emit(updateEventKey, false)\n }\n } else if (indicator.value !== val) {\n if (val) {\n doShow()\n } else {\n doHide()\n }\n }\n }\n\n const toggle = () => {\n if (indicator.value) {\n hide()\n } else {\n show()\n }\n }\n\n watch(() => props[name], onChange)\n\n if (\n shouldHideWhenRouteChanges &&\n instance.appContext.config.globalProperties.$route !== undefined\n ) {\n watch(\n () => ({\n ...(\n instance.proxy as ComponentPublicInstance<{\n $route: RouteLocationNormalizedLoaded\n }>\n ).$route,\n }),\n () => {\n if (shouldHideWhenRouteChanges.value && indicator.value) {\n hide()\n }\n }\n )\n }\n\n onMounted(() => {\n onChange(props[name])\n })\n\n return {\n hide,\n show,\n toggle,\n hasUpdateHandler,\n }\n }\n\n return {\n useModelToggle,\n useModelToggleProps,\n useModelToggleEmits,\n }\n}\n\nconst { useModelToggle, useModelToggleProps, useModelToggleEmits } =\n createModelToggleComposable('modelValue')\n\nexport { useModelToggle, useModelToggleEmits, useModelToggleProps }\n\nexport type UseModelToggleProps = ExtractPropTypes<typeof useModelToggleProps>\nexport type UseModelTogglePropsPublic = ExtractPublicPropTypes<\n typeof useModelToggleProps\n>\n\nexport type ModelToggleParams = {\n indicator: Ref<boolean>\n toggleReason?: Ref<Event | undefined>\n shouldHideWhenRouteChanges?: Ref<boolean>\n shouldProceed?: () => boolean\n onShow?: (event?: Event) => void\n onHide?: (event?: Event) => void\n}\n"],"names":["useModelToggleEmits","useModelToggleProps","useModelToggle"],"mappings":"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"}