1 line
44 KiB
Plaintext
1 line
44 KiB
Plaintext
|
{"version":3,"file":"useSelect.mjs","names":["isUndefined"],"sources":["../../../../../../packages/components/select-v2/src/useSelect.ts"],"sourcesContent":["import {\n computed,\n nextTick,\n onMounted,\n reactive,\n ref,\n useSlots,\n watch,\n watchEffect,\n} from 'vue'\nimport { findLastIndex, get, isEqual } from 'lodash-unified'\nimport { useDebounceFn, useResizeObserver } from '@vueuse/core'\nimport {\n NOOP,\n ValidateComponentsMap,\n debugWarn,\n escapeStringRegexp,\n getEventCode,\n isArray,\n isEmpty,\n isFunction,\n isNumber,\n isObject,\n isUndefined,\n} from '@element-plus/utils'\nimport {\n useComposition,\n useEmptyValues,\n useFocusController,\n useLocale,\n useNamespace,\n} from '@element-plus/hooks'\nimport {\n CHANGE_EVENT,\n EVENT_CODE,\n MINIMUM_INPUT_WIDTH,\n UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport {\n useFormDisabled,\n useFormItem,\n useFormItemInputId,\n useFormSize,\n} from '@element-plus/components/form'\nimport { useAllowCreate } from './useAllowCreate'\nimport { useProps } from './useProps'\n\nimport type { Option, OptionType, SelectStates } from './select.types'\nimport type { SelectV2Props } from './token'\nimport type { SelectV2EmitFn } from './defaults'\nimport type { ScrollbarDirection } from '@element-plus/components/scrollbar'\nimport type { TooltipInstance } from '@element-plus/components/tooltip'\nimport type { SelectDropdownInstance } from './select-dropdown'\n\nconst useSelect = (props: SelectV2Props, emit: SelectV2EmitFn) => {\n // inject\n const { t } = useLocale()\n const slots = useSlots()\n const nsSelect = useNamespace('select')\n const nsInput = useNamespace('input')\n const { form: elForm, formItem: elFormItem } = useFormItem()\n const { inputId } = useFormItemInputId(props, {\n formItemContext: elFormItem,\n })\n const { aliasProps, getLabel, getValue, getDisabled, getOptions } =\n useProps(props)\n const { valueOnClear, isEmptyValue } = useEmptyValues(props)\n\n const states: SelectStates = reactive({\n inputValue: '',\n cachedOptions: [],\n createdOptions: [],\n hoveringIndex: -1,\n inputHovering: false,\n selectionWidth: 0,\n collapseItemWidth: 0,\n previousQuery: null,\n previousValue: undefined,\n selectedLabel: '',\n menuVisibleOnFocus: false,\n isBeforeHide: false,\n })\n\n // data refs\n const popperSize = ref(-1)\n const debouncing = ref(false)\n\n // DOM & Component refs\n const selectRef = ref<HTMLElement>()\n const selectionRef = ref<HTMLElement>()\n const tooltipRef = ref<TooltipInstance>()\n const tagTooltipRef = ref<TooltipInstance>()\n const inputRef = ref<HTMLElement>()\n const prefixRef = ref<HTMLElement>()\n const suffixRef = ref<HTMLElement>()\n const menuRef = ref<SelectDropdownInstance>()\n const tagMenuRef = ref<HTMLElement>()\n const collapseItemRef = ref<HTMLElement>()\n\n const {\n isComposing,\n handleCompositionStart,\n handleCompositionEnd,\n handleCompositionUpdate,\n } = useComposition({\n afterComposition: (e) => onInput(e),\n })\n\n const selectDisabled = useFormDisabled()\n\n const { wrapperRef, isFocused, handleBlur } = useFocusController(inputRef, {\n disabled: selectDisabled,\n afterFocus() {\n if (props.automaticDropdown && !expanded.value) {\n expanded.value = true\n states.menuVisibleOnFocus = true\n }\n },\n beforeBlur(event) {\n return (\n tooltipRef.value?.isFocusInsideContent(event) ||\n tagTooltipRef.value?.isFocusInsideContent(event)\n )\n },\n afterBlur() {\n expanded.value = false\n states.menuVisibleOnFocus = false\n if (props.validateEvent) {\n elFormItem?.validate?.('blur').catch(NOOP)\n }\n },\n })\n\n const allOptions = computed(() => filterOptions(''))\n\n const hasOptions = computed(() => {\n if (props.loading) return false\n return props.options.length > 0 || states.createdOptions.length > 0\n })\n\n const filteredOptions = ref<OptionType[]>([])\n // the controller of the
|