index.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. var _typeof3 = require("@babel/runtime/helpers/typeof");
  4. Object.defineProperty(exports, "__esModule", {
  5. value: true
  6. });
  7. exports.cascaderProps = cascaderProps;
  8. exports.default = void 0;
  9. var _vue = require("vue");
  10. var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
  11. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  12. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  13. var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
  14. var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
  15. var _vcCascader = _interopRequireWildcard(require("../vc-cascader"));
  16. var _RightOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/RightOutlined"));
  17. var _LoadingOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/LoadingOutlined"));
  18. var _LeftOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/LeftOutlined"));
  19. var _iconUtil = _interopRequireDefault(require("../select/utils/iconUtil"));
  20. var _type = require("../_util/type");
  21. var _omit = _interopRequireDefault(require("../_util/omit"));
  22. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  23. var _propsUtil = require("../_util/props-util");
  24. var _useConfigInject2 = _interopRequireDefault(require("../_util/hooks/useConfigInject"));
  25. var _classNames2 = _interopRequireDefault(require("../_util/classNames"));
  26. var _devWarning = _interopRequireDefault(require("../vc-util/devWarning"));
  27. var _transition = require("../_util/transition");
  28. var _form = require("../form");
  29. var _excluded = ["notFoundContent", "expandIcon", "multiple", "bordered", "allowClear", "choiceTransitionName", "transitionName", "id"];
  30. 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); }
  31. function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(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; }
  32. function highlightKeyword(str, lowerKeyword, prefixCls) {
  33. var cells = str.toLowerCase().split(lowerKeyword).reduce(function (list, cur, index) {
  34. return index === 0 ? [cur] : [].concat((0, _toConsumableArray2.default)(list), [lowerKeyword, cur]);
  35. }, []);
  36. var fillCells = [];
  37. var start = 0;
  38. cells.forEach(function (cell, index) {
  39. var end = start + cell.length;
  40. var originWorld = str.slice(start, end);
  41. start = end;
  42. if (index % 2 === 1) {
  43. var _originWorld = function () {
  44. return originWorld;
  45. }();
  46. originWorld = (0, _vue.createVNode)("span", {
  47. "class": "".concat(prefixCls, "-menu-item-keyword"),
  48. "key": "seperator"
  49. }, [originWorld]);
  50. }
  51. fillCells.push(originWorld);
  52. });
  53. return fillCells;
  54. }
  55. var defaultSearchRender = function defaultSearchRender(_ref) {
  56. var inputValue = _ref.inputValue,
  57. path = _ref.path,
  58. prefixCls = _ref.prefixCls,
  59. fieldNames = _ref.fieldNames;
  60. var optionList = [];
  61. // We do lower here to save perf
  62. var lower = inputValue.toLowerCase();
  63. path.forEach(function (node, index) {
  64. if (index !== 0) {
  65. optionList.push(' / ');
  66. }
  67. var label = node[fieldNames.label];
  68. var type = (0, _typeof2.default)(label);
  69. if (type === 'string' || type === 'number') {
  70. label = highlightKeyword(String(label), lower, prefixCls);
  71. }
  72. optionList.push(label);
  73. });
  74. return optionList;
  75. };
  76. function cascaderProps() {
  77. return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _omit.default)((0, _vcCascader.cascaderProps)(), ['customSlots', 'checkable', 'options'])), {}, {
  78. multiple: {
  79. type: Boolean,
  80. default: undefined
  81. },
  82. size: String,
  83. bordered: {
  84. type: Boolean,
  85. default: undefined
  86. },
  87. placement: {
  88. type: String
  89. },
  90. suffixIcon: _vueTypes.default.any,
  91. options: Array,
  92. 'onUpdate:value': Function
  93. });
  94. }
  95. var Cascader = (0, _vue.defineComponent)({
  96. compatConfig: {
  97. MODE: 3
  98. },
  99. name: 'ACascader',
  100. inheritAttrs: false,
  101. props: (0, _propsUtil.initDefaultProps)(cascaderProps(), {
  102. bordered: true,
  103. choiceTransitionName: '',
  104. allowClear: true
  105. }),
  106. setup: function setup(props, _ref2) {
  107. var attrs = _ref2.attrs,
  108. expose = _ref2.expose,
  109. slots = _ref2.slots,
  110. emit = _ref2.emit;
  111. var formItemContext = (0, _form.useInjectFormItemContext)();
  112. var _useConfigInject = (0, _useConfigInject2.default)('cascader', props),
  113. cascaderPrefixCls = _useConfigInject.prefixCls,
  114. rootPrefixCls = _useConfigInject.rootPrefixCls,
  115. getPrefixCls = _useConfigInject.getPrefixCls,
  116. direction = _useConfigInject.direction,
  117. getPopupContainer = _useConfigInject.getPopupContainer,
  118. renderEmpty = _useConfigInject.renderEmpty,
  119. size = _useConfigInject.size;
  120. var prefixCls = (0, _vue.computed)(function () {
  121. return getPrefixCls('select', props.prefixCls);
  122. });
  123. var isRtl = (0, _vue.computed)(function () {
  124. return direction.value === 'rtl';
  125. });
  126. // =================== Warning =====================
  127. if (process.env.NODE_ENV !== 'production') {
  128. (0, _vue.watchEffect)(function () {
  129. (0, _devWarning.default)(!props.multiple || !props.displayRender || !slots.displayRender, 'Cascader', '`displayRender` not work on `multiple`. Please use `tagRender` instead.');
  130. });
  131. }
  132. // ==================== Search =====================
  133. var mergedShowSearch = (0, _vue.computed)(function () {
  134. if (!props.showSearch) {
  135. return props.showSearch;
  136. }
  137. var searchConfig = {
  138. render: defaultSearchRender
  139. };
  140. if ((0, _typeof2.default)(props.showSearch) === 'object') {
  141. searchConfig = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, searchConfig), props.showSearch);
  142. }
  143. return searchConfig;
  144. });
  145. // =================== Dropdown ====================
  146. var mergedDropdownClassName = (0, _vue.computed)(function () {
  147. return (0, _classNames2.default)(props.dropdownClassName || props.popupClassName, "".concat(cascaderPrefixCls.value, "-dropdown"), (0, _defineProperty2.default)({}, "".concat(cascaderPrefixCls.value, "-dropdown-rtl"), isRtl.value));
  148. });
  149. var selectRef = (0, _vue.ref)();
  150. expose({
  151. focus: function focus() {
  152. var _selectRef$value;
  153. (_selectRef$value = selectRef.value) === null || _selectRef$value === void 0 ? void 0 : _selectRef$value.focus();
  154. },
  155. blur: function blur() {
  156. var _selectRef$value2;
  157. (_selectRef$value2 = selectRef.value) === null || _selectRef$value2 === void 0 ? void 0 : _selectRef$value2.blur();
  158. }
  159. });
  160. var handleChange = function handleChange() {
  161. for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
  162. args[_key] = arguments[_key];
  163. }
  164. emit('update:value', args[0]);
  165. emit.apply(void 0, ['change'].concat(args));
  166. formItemContext.onFieldChange();
  167. };
  168. var handleBlur = function handleBlur() {
  169. for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
  170. args[_key2] = arguments[_key2];
  171. }
  172. emit.apply(void 0, ['blur'].concat(args));
  173. formItemContext.onFieldBlur();
  174. };
  175. var mergedShowArrow = (0, _vue.computed)(function () {
  176. return props.showArrow !== undefined ? props.showArrow : props.loading || !props.multiple;
  177. });
  178. var placement = (0, _vue.computed)(function () {
  179. if (props.placement !== undefined) {
  180. return props.placement;
  181. }
  182. return direction.value === 'rtl' ? 'bottomRight' : 'bottomLeft';
  183. });
  184. return function () {
  185. var _slots$notFoundConten, _slots$expandIcon, _ref3;
  186. var _props$notFoundConten = props.notFoundContent,
  187. notFoundContent = _props$notFoundConten === void 0 ? (_slots$notFoundConten = slots.notFoundContent) === null || _slots$notFoundConten === void 0 ? void 0 : _slots$notFoundConten.call(slots) : _props$notFoundConten,
  188. _props$expandIcon = props.expandIcon,
  189. expandIcon = _props$expandIcon === void 0 ? (_slots$expandIcon = slots.expandIcon) === null || _slots$expandIcon === void 0 ? void 0 : _slots$expandIcon.call(slots) : _props$expandIcon,
  190. multiple = props.multiple,
  191. bordered = props.bordered,
  192. allowClear = props.allowClear,
  193. choiceTransitionName = props.choiceTransitionName,
  194. transitionName = props.transitionName,
  195. _props$id = props.id,
  196. id = _props$id === void 0 ? formItemContext.id.value : _props$id,
  197. restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
  198. // =================== No Found ====================
  199. var mergedNotFoundContent = notFoundContent || renderEmpty.value('Cascader');
  200. // ===================== Icon ======================
  201. var mergedExpandIcon = expandIcon;
  202. if (!expandIcon) {
  203. mergedExpandIcon = isRtl.value ? (0, _vue.createVNode)(_LeftOutlined.default, null, null) : (0, _vue.createVNode)(_RightOutlined.default, null, null);
  204. }
  205. var loadingIcon = (0, _vue.createVNode)("span", {
  206. "class": "".concat(prefixCls.value, "-menu-item-loading-icon")
  207. }, [(0, _vue.createVNode)(_LoadingOutlined.default, {
  208. "spin": true
  209. }, null)]);
  210. // ===================== Icons =====================
  211. var _getIcons = (0, _iconUtil.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
  212. multiple: multiple,
  213. prefixCls: prefixCls.value,
  214. showArrow: mergedShowArrow.value
  215. }), slots),
  216. suffixIcon = _getIcons.suffixIcon,
  217. removeIcon = _getIcons.removeIcon,
  218. clearIcon = _getIcons.clearIcon;
  219. return (0, _vue.createVNode)(_vcCascader.default, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), attrs), {}, {
  220. "id": id,
  221. "prefixCls": prefixCls.value,
  222. "class": [cascaderPrefixCls.value, (_ref3 = {}, (0, _defineProperty2.default)(_ref3, "".concat(prefixCls.value, "-lg"), size.value === 'large'), (0, _defineProperty2.default)(_ref3, "".concat(prefixCls.value, "-sm"), size.value === 'small'), (0, _defineProperty2.default)(_ref3, "".concat(prefixCls.value, "-rtl"), isRtl.value), (0, _defineProperty2.default)(_ref3, "".concat(prefixCls.value, "-borderless"), !bordered), _ref3), attrs.class],
  223. "direction": direction.value,
  224. "placement": placement.value,
  225. "notFoundContent": mergedNotFoundContent,
  226. "allowClear": allowClear,
  227. "showSearch": mergedShowSearch.value,
  228. "expandIcon": mergedExpandIcon,
  229. "inputIcon": suffixIcon,
  230. "removeIcon": removeIcon,
  231. "clearIcon": clearIcon,
  232. "loadingIcon": loadingIcon,
  233. "checkable": !!multiple,
  234. "dropdownClassName": mergedDropdownClassName.value,
  235. "dropdownPrefixCls": cascaderPrefixCls.value,
  236. "choiceTransitionName": (0, _transition.getTransitionName)(rootPrefixCls.value, '', choiceTransitionName),
  237. "transitionName": (0, _transition.getTransitionName)(rootPrefixCls.value, (0, _transition.getTransitionDirection)(placement.value), transitionName),
  238. "getPopupContainer": getPopupContainer.value,
  239. "customSlots": (0, _objectSpread2.default)((0, _objectSpread2.default)({}, slots), {}, {
  240. checkable: function checkable() {
  241. return (0, _vue.createVNode)("span", {
  242. "class": "".concat(cascaderPrefixCls.value, "-checkbox-inner")
  243. }, null);
  244. }
  245. }),
  246. "tagRender": props.tagRender || slots.tagRender,
  247. "displayRender": props.displayRender || slots.displayRender,
  248. "maxTagPlaceholder": props.maxTagPlaceholder || slots.maxTagPlaceholder,
  249. "showArrow": props.showArrow,
  250. "onChange": handleChange,
  251. "onBlur": handleBlur,
  252. "ref": selectRef
  253. }), slots);
  254. };
  255. }
  256. });
  257. var _default = (0, _type.withInstall)(Cascader);
  258. exports.default = _default;