element-plus
Version:
A Component Library for Vue 3
1 lines • 4.1 kB
Source Map (JSON)
{"version":3,"file":"use-form-item.mjs","names":[],"sources":["../../../../../../../packages/components/form/src/hooks/use-form-item.ts"],"sourcesContent":["import {\n computed,\n getCurrentInstance,\n inject,\n onMounted,\n onUnmounted,\n ref,\n toRef,\n watch,\n} from 'vue'\nimport { useId } from '@element-plus/hooks/use-id'\nimport { formContextKey, formItemContextKey } from '../constants'\n\nimport type { ComputedRef, Ref, WatchStopHandle } from 'vue'\nimport type { FormItemContext } from '../types'\n\nexport const useFormItem = () => {\n const form = inject(formContextKey, undefined)\n const formItem = inject(formItemContextKey, undefined)\n return {\n form,\n formItem,\n }\n}\n\nexport type IUseFormItemInputCommonProps = {\n id?: string\n label?: string | number | boolean | Record<string, any>\n ariaLabel?: string | number | boolean | Record<string, any>\n}\n\nexport const useFormItemInputId = (\n props: Partial<IUseFormItemInputCommonProps>,\n {\n formItemContext,\n disableIdGeneration,\n disableIdManagement,\n }: {\n formItemContext?: FormItemContext\n disableIdGeneration?: ComputedRef<boolean> | Ref<boolean>\n disableIdManagement?: ComputedRef<boolean> | Ref<boolean>\n }\n) => {\n if (!disableIdGeneration) {\n disableIdGeneration = ref<boolean>(false)\n }\n if (!disableIdManagement) {\n disableIdManagement = ref<boolean>(false)\n }\n\n const instance = getCurrentInstance()\n\n const inLabel = () => {\n let parent = instance?.parent\n while (parent) {\n if (parent.type.name === 'ElFormItem') {\n return false\n }\n if (parent.type.name === 'ElLabelWrap') {\n return true\n }\n parent = parent.parent\n }\n return false\n }\n\n const inputId = ref<string>()\n let idUnwatch: WatchStopHandle | undefined = undefined\n\n const isLabeledByFormItem = computed<boolean>(() => {\n return !!(\n !(props.label || props.ariaLabel) &&\n formItemContext &&\n formItemContext.inputIds &&\n formItemContext.inputIds?.length <= 1\n )\n })\n\n // Generate id for ElFormItem label if not provided as prop\n onMounted(() => {\n idUnwatch = watch(\n [toRef(props, 'id'), disableIdGeneration] as any,\n ([id, disableIdGeneration]: [string, boolean]) => {\n const newId = id ?? (!disableIdGeneration ? useId().value : undefined)\n if (newId !== inputId.value) {\n if (formItemContext?.removeInputId && !inLabel()) {\n inputId.value && formItemContext.removeInputId(inputId.value)\n if (!disableIdManagement?.value && !disableIdGeneration && newId) {\n formItemContext.addInputId(newId)\n }\n }\n inputId.value = newId\n }\n },\n { immediate: true }\n )\n })\n\n onUnmounted(() => {\n idUnwatch && idUnwatch()\n if (formItemContext?.removeInputId) {\n inputId.value && formItemContext.removeInputId(inputId.value)\n }\n })\n\n return {\n isLabeledByFormItem,\n inputId,\n }\n}\n"],"mappings":";;;;;AAgBA,MAAa,oBAAoB;AAG/B,QAAO;EACL,MAHW,OAAO,gBAAgB,OAAU;EAI5C,UAHe,OAAO,oBAAoB,OAAU;EAIrD;;AASH,MAAa,sBACX,OACA,EACE,iBACA,qBACA,0BAMC;AACH,KAAI,CAAC,oBACH,uBAAsB,IAAa,MAAM;AAE3C,KAAI,CAAC,oBACH,uBAAsB,IAAa,MAAM;CAG3C,MAAM,WAAW,oBAAoB;CAErC,MAAM,gBAAgB;EACpB,IAAI,SAAS,UAAU;AACvB,SAAO,QAAQ;AACb,OAAI,OAAO,KAAK,SAAS,aACvB,QAAO;AAET,OAAI,OAAO,KAAK,SAAS,cACvB,QAAO;AAET,YAAS,OAAO;;AAElB,SAAO;;CAGT,MAAM,UAAU,KAAa;CAC7B,IAAI,YAAyC;CAE7C,MAAM,sBAAsB,eAAwB;AAClD,SAAO,CAAC,EACN,EAAE,MAAM,SAAS,MAAM,cACvB,mBACA,gBAAgB,YAChB,gBAAgB,UAAU,UAAU;GAEtC;AAGF,iBAAgB;AACd,cAAY,MACV,CAAC,MAAM,OAAO,KAAK,EAAE,oBAAoB,GACxC,CAAC,IAAI,yBAA4C;GAChD,MAAM,QAAQ,OAAO,CAAC,sBAAsB,OAAO,CAAC,QAAQ;AAC5D,OAAI,UAAU,QAAQ,OAAO;AAC3B,QAAI,iBAAiB,iBAAiB,CAAC,SAAS,EAAE;AAChD,aAAQ,SAAS,gBAAgB,cAAc,QAAQ,MAAM;AAC7D,SAAI,CAAC,qBAAqB,SAAS,CAAC,uBAAuB,MACzD,iBAAgB,WAAW,MAAM;;AAGrC,YAAQ,QAAQ;;KAGpB,EAAE,WAAW,MAAM,CACpB;GACD;AAEF,mBAAkB;AAChB,eAAa,WAAW;AACxB,MAAI,iBAAiB,cACnB,SAAQ,SAAS,gBAAgB,cAAc,QAAQ,MAAM;GAE/D;AAEF,QAAO;EACL;EACA;EACD"}