index.js 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import _extends from "@babel/runtime/helpers/esm/extends";
  3. import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
  4. import { defineComponent, ref } from 'vue';
  5. import Select, { selectProps } from '../select';
  6. import { isValidElement, flattenChildren } from '../_util/props-util';
  7. import warning from '../_util/warning';
  8. import Option from './Option';
  9. import OptGroup from './OptGroup';
  10. import omit from '../_util/omit';
  11. import useConfigInject from '../config-provider/hooks/useConfigInject';
  12. function isSelectOptionOrSelectOptGroup(child) {
  13. var _a, _b;
  14. return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.isSelectOption) || ((_b = child === null || child === void 0 ? void 0 : child.type) === null || _b === void 0 ? void 0 : _b.isSelectOptGroup);
  15. }
  16. export const autoCompleteProps = () => _extends(_extends({}, omit(selectProps(), ['loading', 'mode', 'optionLabelProp', 'labelInValue'])), {
  17. dataSource: Array,
  18. dropdownMenuStyle: {
  19. type: Object,
  20. default: undefined
  21. },
  22. // optionLabelProp: String,
  23. dropdownMatchSelectWidth: {
  24. type: [Number, Boolean],
  25. default: true
  26. },
  27. prefixCls: String,
  28. showSearch: {
  29. type: Boolean,
  30. default: undefined
  31. },
  32. transitionName: String,
  33. choiceTransitionName: {
  34. type: String,
  35. default: 'zoom'
  36. },
  37. autofocus: {
  38. type: Boolean,
  39. default: undefined
  40. },
  41. backfill: {
  42. type: Boolean,
  43. default: undefined
  44. },
  45. // optionLabelProp: PropTypes.string.def('children'),
  46. filterOption: {
  47. type: [Boolean, Function],
  48. default: false
  49. },
  50. defaultActiveFirstOption: {
  51. type: Boolean,
  52. default: true
  53. },
  54. status: String
  55. });
  56. export const AutoCompleteOption = Option;
  57. export const AutoCompleteOptGroup = OptGroup;
  58. const AutoComplete = defineComponent({
  59. compatConfig: {
  60. MODE: 3
  61. },
  62. name: 'AAutoComplete',
  63. inheritAttrs: false,
  64. props: autoCompleteProps(),
  65. // emits: ['change', 'select', 'focus', 'blur'],
  66. slots: Object,
  67. setup(props, _ref) {
  68. let {
  69. slots,
  70. attrs,
  71. expose
  72. } = _ref;
  73. warning(!('dataSource' in slots), 'AutoComplete', '`dataSource` slot is deprecated, please use props `options` instead.');
  74. warning(!('options' in slots), 'AutoComplete', '`options` slot is deprecated, please use props `options` instead.');
  75. warning(!props.dropdownClassName, 'AutoComplete', '`dropdownClassName` is deprecated, please use `popupClassName` instead.');
  76. const selectRef = ref();
  77. const getInputElement = () => {
  78. var _a;
  79. const children = flattenChildren((_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots));
  80. const element = children.length ? children[0] : undefined;
  81. return element;
  82. };
  83. const focus = () => {
  84. var _a;
  85. (_a = selectRef.value) === null || _a === void 0 ? void 0 : _a.focus();
  86. };
  87. const blur = () => {
  88. var _a;
  89. (_a = selectRef.value) === null || _a === void 0 ? void 0 : _a.blur();
  90. };
  91. expose({
  92. focus,
  93. blur
  94. });
  95. const {
  96. prefixCls
  97. } = useConfigInject('select', props);
  98. return () => {
  99. var _a, _b, _c;
  100. const {
  101. size,
  102. dataSource,
  103. notFoundContent = (_a = slots.notFoundContent) === null || _a === void 0 ? void 0 : _a.call(slots)
  104. } = props;
  105. let optionChildren;
  106. const {
  107. class: className
  108. } = attrs;
  109. const cls = {
  110. [className]: !!className,
  111. [`${prefixCls.value}-lg`]: size === 'large',
  112. [`${prefixCls.value}-sm`]: size === 'small',
  113. [`${prefixCls.value}-show-search`]: true,
  114. [`${prefixCls.value}-auto-complete`]: true
  115. };
  116. if (props.options === undefined) {
  117. const childArray = ((_b = slots.dataSource) === null || _b === void 0 ? void 0 : _b.call(slots)) || ((_c = slots.options) === null || _c === void 0 ? void 0 : _c.call(slots)) || [];
  118. if (childArray.length && isSelectOptionOrSelectOptGroup(childArray[0])) {
  119. optionChildren = childArray;
  120. } else {
  121. optionChildren = dataSource ? dataSource.map(item => {
  122. if (isValidElement(item)) {
  123. return item;
  124. }
  125. switch (typeof item) {
  126. case 'string':
  127. return _createVNode(Option, {
  128. "key": item,
  129. "value": item
  130. }, {
  131. default: () => [item]
  132. });
  133. case 'object':
  134. return _createVNode(Option, {
  135. "key": item.value,
  136. "value": item.value
  137. }, {
  138. default: () => [item.text]
  139. });
  140. default:
  141. throw new Error('AutoComplete[dataSource] only supports type `string[] | Object[]`.');
  142. }
  143. }) : [];
  144. }
  145. }
  146. const selectProps = omit(_extends(_extends(_extends({}, props), attrs), {
  147. mode: Select.SECRET_COMBOBOX_MODE_DO_NOT_USE,
  148. // optionLabelProp,
  149. getInputElement,
  150. notFoundContent,
  151. // placeholder: '',
  152. class: cls,
  153. popupClassName: props.popupClassName || props.dropdownClassName,
  154. ref: selectRef
  155. }), ['dataSource', 'loading']);
  156. return _createVNode(Select, selectProps, _objectSpread({
  157. default: () => [optionChildren]
  158. }, omit(slots, ['default', 'dataSource', 'options'])));
  159. };
  160. }
  161. });
  162. /* istanbul ignore next */
  163. export default _extends(AutoComplete, {
  164. Option,
  165. OptGroup,
  166. install(app) {
  167. app.component(AutoComplete.name, AutoComplete);
  168. app.component(Option.displayName, Option);
  169. app.component(OptGroup.displayName, OptGroup);
  170. return app;
  171. }
  172. });