xdesign-vue-next/es/auto-complete/auto-complete.mjs.map

XDesign Component for vue-next

{"version":3,"file":"auto-complete.mjs","sources":["../../src/auto-complete/auto-complete.tsx"],"sourcesContent":["import { computed, ref, defineComponent, toRefs, nextTick } from 'vue';\nimport props from './props';\nimport { TdAutoCompleteProps } from './type';\nimport Input, { InputProps, TdInputProps } from '../input';\nimport Popup, { PopupProps } from '../popup';\nimport useCommonClassName from '../hooks/useCommonClassName';\nimport AutoCompleteOptionList from './option-list';\nimport useVModel from '../hooks/useVModel';\nimport { useConfig } from '../config-provider/useConfig';\nimport { ClassName } from '../common';\nimport { useContent, useTNodeJSX } from '../hooks';\n\nexport default defineComponent({\n  name: 'XAutoComplete',\n\n  props,\n\n  setup(props: TdAutoCompleteProps, { slots }) {\n    const { value, modelValue } = toRefs(props);\n    const [tValue, setTValue] = useVModel(value, modelValue, props.defaultValue, props.onChange);\n    const renderContent = useContent();\n    const renderTNodeJSX = useTNodeJSX();\n    const { classPrefix, sizeClassNames } = useCommonClassName();\n    const { globalConfig: global } = useConfig('input');\n\n    const popupVisible = ref();\n    const optionListRef = ref();\n\n    const getOverlayStyle = (trigger: HTMLElement, popupElement: HTMLElement) => {\n      const triggerWidth = trigger.getBoundingClientRect().width || trigger.offsetWidth || trigger.clientWidth;\n      const popupWidth =\n        popupElement.getBoundingClientRect().width || popupElement.offsetWidth || popupElement.clientWidth;\n      return {\n        width: triggerWidth >= popupWidth ? `${triggerWidth}px` : 'auto',\n        ...props.popupProps?.overlayInnerStyle,\n      };\n    };\n\n    const classes = computed(() => [`${classPrefix.value}-auto-complete`]);\n    const popupClasses = computed(() => {\n      let classes: ClassName = [`${classPrefix.value}-select__dropdown`];\n      if (props.popupProps?.overlayClassName) {\n        classes = classes.concat(props.popupProps.overlayClassName);\n      }\n      return classes;\n    });\n    const popupInnerClasses = computed(() => {\n      let classes: ClassName = [`${classPrefix.value}-select__dropdown-inner`];\n      if (props.popupProps?.overlayInnerClassName) {\n        classes = classes.concat(props.popupProps.overlayInnerClassName);\n      }\n      return classes;\n    });\n\n    const onInputChange: TdInputProps['onChange'] = (value, context) => {\n      setTValue(value, context);\n    };\n\n    const innerInputProps = computed(() => {\n      const tProps: InputProps = {\n        value: tValue.value,\n        size: props.size,\n        ...props.inputProps,\n      };\n      return tProps;\n    });\n\n    const onInnerFocus: InputProps['onFocus'] = (value, context) => {\n      popupVisible.value = true;\n      props.onFocus?.({ ...context, value });\n      nextTick(() => {\n        optionListRef.value?.addKeyboardListener();\n      });\n    };\n\n    const onInnerBlur: InputProps['onBlur'] = (value, context) => {\n      props.onBlur?.({ ...context, value });\n    };\n\n    const onInnerCompositionend: InputProps['onCompositionend'] = (value, context) => {\n      props.onCompositionend?.({ ...context, value });\n    };\n\n    const onInnerCompositionstart: InputProps['onCompositionstart'] = (value, context) => {\n      props.onCompositionstart?.({ ...context, value });\n    };\n\n    const onInnerEnter: InputProps['onEnter'] = (value, context) => {\n      props.onEnter?.({ ...context, value });\n    };\n\n    const onInnerSelect: TdAutoCompleteProps['onSelect'] = (value, context) => {\n      if (props.readonly || props.disabled) return;\n      popupVisible.value = false;\n      setTValue(value, context);\n      props.onSelect?.(value, context);\n    };\n\n    const onPopupVisibleChange: PopupProps['onVisibleChange'] = (visible, { trigger }) => {\n      if (trigger !== 'trigger-element-click') {\n        popupVisible.value = visible;\n      }\n    };\n\n    return () => {\n      // 触发元素\n      const triggerNode = renderContent('default', 'triggerElement') || (\n        <Input\n          placeholder={props.placeholder ?? global.value.placeholder}\n          tips={props.tips}\n          status={props.status}\n          readonly={props.readonly}\n          disabled={props.disabled}\n          autofocus={props.autofocus}\n          clearable={props.clearable}\n          onChange={onInputChange}\n          onFocus={onInnerFocus}\n          onBlur={onInnerBlur}\n          onClear={props.onClear}\n          onCompositionend={onInnerCompositionend}\n          onCompositionstart={onInnerCompositionstart}\n          onEnter={onInnerEnter}\n          {...innerInputProps.value}\n          v-slots={slots}\n        />\n      );\n      // 联想词列表\n      const listContent = (\n        <AutoCompleteOptionList\n          ref={optionListRef}\n          value={tValue.value}\n          options={props.options}\n          size={props.size}\n          sizeClassNames={sizeClassNames}\n          onSelect={onInnerSelect}\n          popupVisible={popupVisible.value}\n          highlightKeyword={props.highlightKeyword}\n          filterable={props.filterable}\n          filter={props.filter}\n          v-slots={{ option: slots.option }}\n        />\n      );\n      const topContent = renderTNodeJSX('panelTopContent');\n      const bottomContent = renderTNodeJSX('panelBottomContent');\n      const panelContent = Boolean(topContent || props.options?.length || bottomContent) ? (\n        <div class={`${classPrefix.value}-autocomplete__panel`}>\n          {topContent}\n          {listContent}\n          {bottomContent}\n        </div>\n      ) : null;\n      const popupProps = {\n        ...props.popupProps,\n        overlayInnerStyle: getOverlayStyle,\n        overlayInnerClassName: popupInnerClasses.value,\n        overlayClassName: popupClasses.value,\n      };\n      return (\n        <div class={classes.value}>\n          <Popup\n            visible={popupVisible.value}\n            onVisibleChange={onPopupVisibleChange}\n            trigger=\"focus\"\n            placement=\"bottom-left\"\n            hideEmptyPopup={true}\n            content={panelContent ? () => panelContent : null}\n            {...popupProps}\n          >\n            {triggerNode}\n          </Popup>\n        </div>\n      );\n    };\n  },\n});\n"],"names":["_isVNode","name","props","setup","tValue","setTValue","classes","value","nextTick","_createVNode","_mergeProps","overlayInnerStyle"],"mappings":"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"}