index.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. var _typeof = require("@babel/runtime/helpers/typeof");
  4. Object.defineProperty(exports, "__esModule", {
  5. value: true
  6. });
  7. exports.default = exports.TreeSelectNode = void 0;
  8. exports.treeSelectProps = treeSelectProps;
  9. var _vue = require("vue");
  10. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  11. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  12. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  13. var _vcTreeSelect = _interopRequireWildcard(require("../vc-tree-select"));
  14. var _classNames3 = _interopRequireDefault(require("../_util/classNames"));
  15. var _initDefaultProps = _interopRequireDefault(require("../_util/props-util/initDefaultProps"));
  16. var _omit = _interopRequireDefault(require("../_util/omit"));
  17. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  18. var _useConfigInject2 = _interopRequireDefault(require("../_util/hooks/useConfigInject"));
  19. var _devWarning = _interopRequireDefault(require("../vc-util/devWarning"));
  20. var _iconUtil = _interopRequireDefault(require("../select/utils/iconUtil"));
  21. var _iconUtil2 = _interopRequireDefault(require("../tree/utils/iconUtil"));
  22. var _warning = require("../vc-util/warning");
  23. var _propsUtil = require("../_util/props-util");
  24. var _FormItemContext = require("../form/FormItemContext");
  25. function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
  26. function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
  27. var getTransitionName = function getTransitionName(rootPrefixCls, motion, transitionName) {
  28. if (transitionName !== undefined) {
  29. return transitionName;
  30. }
  31. return "".concat(rootPrefixCls, "-").concat(motion);
  32. };
  33. function treeSelectProps() {
  34. return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _omit.default)((0, _vcTreeSelect.treeSelectProps)(), ['showTreeIcon', 'treeMotion', 'inputIcon', 'getInputElement', 'treeLine', 'customSlots'])), {}, {
  35. suffixIcon: _vueTypes.default.any,
  36. size: {
  37. type: String
  38. },
  39. bordered: {
  40. type: Boolean,
  41. default: undefined
  42. },
  43. treeLine: {
  44. type: [Boolean, Object],
  45. default: undefined
  46. },
  47. replaceFields: {
  48. type: Object
  49. },
  50. 'onUpdate:value': {
  51. type: Function
  52. },
  53. 'onUpdate:treeExpandedKeys': {
  54. type: Function
  55. },
  56. 'onUpdate:searchValue': {
  57. type: Function
  58. }
  59. });
  60. }
  61. var TreeSelect = (0, _vue.defineComponent)({
  62. compatConfig: {
  63. MODE: 3
  64. },
  65. name: 'ATreeSelect',
  66. inheritAttrs: false,
  67. props: (0, _initDefaultProps.default)(treeSelectProps(), {
  68. choiceTransitionName: '',
  69. listHeight: 256,
  70. treeIcon: false,
  71. listItemHeight: 26,
  72. bordered: true
  73. }),
  74. slots: ['title', 'titleRender', 'placeholder', 'maxTagPlaceholder', 'treeIcon', 'switcherIcon', 'notFoundContent'],
  75. setup: function setup(props, _ref) {
  76. var attrs = _ref.attrs,
  77. slots = _ref.slots,
  78. expose = _ref.expose,
  79. emit = _ref.emit;
  80. (0, _warning.warning)(!(props.treeData === undefined && slots.default), '`children` of TreeSelect is deprecated. Please use `treeData` instead.');
  81. (0, _vue.watchEffect)(function () {
  82. (0, _devWarning.default)(props.multiple !== false || !props.treeCheckable, 'TreeSelect', '`multiple` will always be `true` when `treeCheckable` is true');
  83. (0, _devWarning.default)(props.replaceFields === undefined, 'TreeSelect', '`replaceFields` is deprecated, please use fieldNames instead');
  84. });
  85. var formItemContext = (0, _FormItemContext.useInjectFormItemContext)();
  86. var _useConfigInject = (0, _useConfigInject2.default)('select', props),
  87. prefixCls = _useConfigInject.prefixCls,
  88. renderEmpty = _useConfigInject.renderEmpty,
  89. direction = _useConfigInject.direction,
  90. virtual = _useConfigInject.virtual,
  91. dropdownMatchSelectWidth = _useConfigInject.dropdownMatchSelectWidth,
  92. size = _useConfigInject.size,
  93. getPopupContainer = _useConfigInject.getPopupContainer,
  94. getPrefixCls = _useConfigInject.getPrefixCls;
  95. var rootPrefixCls = (0, _vue.computed)(function () {
  96. return getPrefixCls();
  97. });
  98. var transitionName = (0, _vue.computed)(function () {
  99. return getTransitionName(rootPrefixCls.value, 'slide-up', props.transitionName);
  100. });
  101. var choiceTransitionName = (0, _vue.computed)(function () {
  102. return getTransitionName(rootPrefixCls.value, '', props.choiceTransitionName);
  103. });
  104. var treePrefixCls = (0, _vue.computed)(function () {
  105. return getPrefixCls('select-tree', props.prefixCls);
  106. });
  107. var treeSelectPrefixCls = (0, _vue.computed)(function () {
  108. return getPrefixCls('tree-select', props.prefixCls);
  109. });
  110. var mergedDropdownClassName = (0, _vue.computed)(function () {
  111. return (0, _classNames3.default)(props.dropdownClassName, "".concat(treeSelectPrefixCls.value, "-dropdown"), (0, _defineProperty2.default)({}, "".concat(treeSelectPrefixCls.value, "-dropdown-rtl"), direction.value === 'rtl'));
  112. });
  113. var isMultiple = (0, _vue.computed)(function () {
  114. return !!(props.treeCheckable || props.multiple);
  115. });
  116. var treeSelectRef = (0, _vue.ref)();
  117. expose({
  118. focus: function focus() {
  119. var _treeSelectRef$value$, _treeSelectRef$value;
  120. (_treeSelectRef$value$ = (_treeSelectRef$value = treeSelectRef.value).focus) === null || _treeSelectRef$value$ === void 0 ? void 0 : _treeSelectRef$value$.call(_treeSelectRef$value);
  121. },
  122. blur: function blur() {
  123. var _treeSelectRef$value$2, _treeSelectRef$value2;
  124. (_treeSelectRef$value$2 = (_treeSelectRef$value2 = treeSelectRef.value).blur) === null || _treeSelectRef$value$2 === void 0 ? void 0 : _treeSelectRef$value$2.call(_treeSelectRef$value2);
  125. }
  126. });
  127. var handleChange = function handleChange() {
  128. for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
  129. args[_key] = arguments[_key];
  130. }
  131. emit('update:value', args[0]);
  132. emit.apply(void 0, ['change'].concat(args));
  133. formItemContext.onFieldChange();
  134. };
  135. var handleTreeExpand = function handleTreeExpand(keys) {
  136. emit('update:treeExpandedKeys', keys);
  137. emit('treeExpand', keys);
  138. };
  139. var handleSearch = function handleSearch(value) {
  140. emit('update:searchValue', value);
  141. emit('search', value);
  142. };
  143. var handleBlur = function handleBlur(e) {
  144. emit('blur', e);
  145. formItemContext.onFieldBlur();
  146. };
  147. return function () {
  148. var _slots$notFoundConten, _slots$switcherIcon, _classNames2;
  149. var _props$notFoundConten = props.notFoundContent,
  150. notFoundContent = _props$notFoundConten === void 0 ? (_slots$notFoundConten = slots.notFoundContent) === null || _slots$notFoundConten === void 0 ? void 0 : _slots$notFoundConten.call(slots) : _props$notFoundConten,
  151. customizePrefixCls = props.prefixCls,
  152. bordered = props.bordered,
  153. listHeight = props.listHeight,
  154. listItemHeight = props.listItemHeight,
  155. multiple = props.multiple,
  156. treeIcon = props.treeIcon,
  157. treeLine = props.treeLine,
  158. _props$switcherIcon = props.switcherIcon,
  159. _switcherIcon = _props$switcherIcon === void 0 ? (_slots$switcherIcon = slots.switcherIcon) === null || _slots$switcherIcon === void 0 ? void 0 : _slots$switcherIcon.call(slots) : _props$switcherIcon,
  160. _props$fieldNames = props.fieldNames,
  161. fieldNames = _props$fieldNames === void 0 ? props.replaceFields : _props$fieldNames,
  162. _props$id = props.id,
  163. id = _props$id === void 0 ? formItemContext.id.value : _props$id;
  164. // ===================== Icons =====================
  165. var _getIcons = (0, _iconUtil.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
  166. multiple: isMultiple.value,
  167. prefixCls: prefixCls.value
  168. }), slots),
  169. suffixIcon = _getIcons.suffixIcon,
  170. removeIcon = _getIcons.removeIcon,
  171. clearIcon = _getIcons.clearIcon;
  172. // ===================== Empty =====================
  173. var mergedNotFound;
  174. if (notFoundContent !== undefined) {
  175. mergedNotFound = notFoundContent;
  176. } else {
  177. mergedNotFound = renderEmpty.value('Select');
  178. }
  179. // ==================== Render =====================
  180. var selectProps = (0, _omit.default)(props, ['suffixIcon', 'itemIcon', 'removeIcon', 'clearIcon', 'switcherIcon', 'bordered', 'onUpdate:value', 'onUpdate:treeExpandedKeys', 'onUpdate:searchValue']);
  181. var mergedClassName = (0, _classNames3.default)(!customizePrefixCls && treeSelectPrefixCls.value, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls.value, "-lg"), size.value === 'large'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls.value, "-sm"), size.value === 'small'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls.value, "-rtl"), direction.value === 'rtl'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls.value, "-borderless"), !bordered), _classNames2), attrs.class);
  182. var otherProps = {};
  183. if (props.treeData === undefined && slots.default) {
  184. otherProps.children = (0, _propsUtil.flattenChildren)(slots.default());
  185. }
  186. return (0, _vue.createVNode)(_vcTreeSelect.default, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, attrs), selectProps), {}, {
  187. "virtual": virtual.value,
  188. "dropdownMatchSelectWidth": dropdownMatchSelectWidth.value,
  189. "id": id,
  190. "fieldNames": fieldNames,
  191. "ref": treeSelectRef,
  192. "prefixCls": prefixCls.value,
  193. "class": mergedClassName,
  194. "listHeight": listHeight,
  195. "listItemHeight": listItemHeight,
  196. "treeLine": !!treeLine,
  197. "inputIcon": suffixIcon,
  198. "multiple": multiple,
  199. "removeIcon": removeIcon,
  200. "clearIcon": clearIcon,
  201. "switcherIcon": function switcherIcon(nodeProps) {
  202. return (0, _iconUtil2.default)(treePrefixCls.value, _switcherIcon, treeLine, nodeProps);
  203. },
  204. "showTreeIcon": treeIcon,
  205. "notFoundContent": mergedNotFound,
  206. "getPopupContainer": getPopupContainer.value,
  207. "treeMotion": null,
  208. "dropdownClassName": mergedDropdownClassName.value,
  209. "choiceTransitionName": choiceTransitionName.value,
  210. "onChange": handleChange,
  211. "onBlur": handleBlur,
  212. "onSearch": handleSearch,
  213. "onTreeExpand": handleTreeExpand
  214. }, otherProps), {}, {
  215. "transitionName": transitionName.value,
  216. "customSlots": (0, _objectSpread2.default)((0, _objectSpread2.default)({}, slots), {}, {
  217. treeCheckable: function treeCheckable() {
  218. return (0, _vue.createVNode)("span", {
  219. "class": "".concat(prefixCls.value, "-tree-checkbox-inner")
  220. }, null);
  221. }
  222. }),
  223. "maxTagPlaceholder": props.maxTagPlaceholder || slots.maxTagPlaceholder
  224. }), (0, _objectSpread2.default)((0, _objectSpread2.default)({}, slots), {}, {
  225. treeCheckable: function treeCheckable() {
  226. return (0, _vue.createVNode)("span", {
  227. "class": "".concat(prefixCls.value, "-tree-checkbox-inner")
  228. }, null);
  229. }
  230. }));
  231. };
  232. }
  233. });
  234. /* istanbul ignore next */
  235. var TreeSelectNode = _vcTreeSelect.TreeNode;
  236. exports.TreeSelectNode = TreeSelectNode;
  237. var _default = (0, _extends2.default)(TreeSelect, {
  238. TreeNode: _vcTreeSelect.TreeNode,
  239. SHOW_ALL: _vcTreeSelect.SHOW_ALL,
  240. SHOW_PARENT: _vcTreeSelect.SHOW_PARENT,
  241. SHOW_CHILD: _vcTreeSelect.SHOW_CHILD,
  242. install: function install(app) {
  243. app.component(TreeSelect.name, TreeSelect);
  244. app.component(TreeSelectNode.displayName, TreeSelectNode);
  245. return app;
  246. }
  247. });
  248. exports.default = _default;