index.js 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  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. var __rest = this && this.__rest || function (s, e) {
  5. var t = {};
  6. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  7. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  8. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  9. }
  10. return t;
  11. };
  12. import { computed, ref, toRef, defineComponent } from 'vue';
  13. import Popover from '../popover';
  14. import abstractTooltipProps from '../tooltip/abstractTooltipProps';
  15. import { initDefaultProps } from '../_util/props-util';
  16. import { convertLegacyProps } from '../button/buttonTypes';
  17. import ExclamationCircleFilled from "@ant-design/icons-vue/es/icons/ExclamationCircleFilled";
  18. import Button from '../button';
  19. import { useLocaleReceiver } from '../locale-provider/LocaleReceiver';
  20. import defaultLocale from '../locale/en_US';
  21. import { anyType, objectType, stringType, withInstall } from '../_util/type';
  22. import useMergedState from '../_util/hooks/useMergedState';
  23. import KeyCode from '../_util/KeyCode';
  24. import useConfigInject from '../config-provider/hooks/useConfigInject';
  25. import classNames from '../_util/classNames';
  26. import { getTransitionName } from '../_util/transition';
  27. import { cloneVNodes } from '../_util/vnode';
  28. import omit from '../_util/omit';
  29. import { tooltipDefaultProps } from '../tooltip/Tooltip';
  30. import ActionButton from '../_util/ActionButton';
  31. import usePopconfirmStyle from './style';
  32. import warning from '../_util/warning';
  33. export const popconfirmProps = () => _extends(_extends({}, abstractTooltipProps()), {
  34. prefixCls: String,
  35. content: anyType(),
  36. title: anyType(),
  37. description: anyType(),
  38. okType: stringType('primary'),
  39. disabled: {
  40. type: Boolean,
  41. default: false
  42. },
  43. okText: anyType(),
  44. cancelText: anyType(),
  45. icon: anyType(),
  46. okButtonProps: objectType(),
  47. cancelButtonProps: objectType(),
  48. showCancel: {
  49. type: Boolean,
  50. default: true
  51. },
  52. onConfirm: Function,
  53. onCancel: Function
  54. });
  55. const Popconfirm = defineComponent({
  56. compatConfig: {
  57. MODE: 3
  58. },
  59. name: 'APopconfirm',
  60. inheritAttrs: false,
  61. props: initDefaultProps(popconfirmProps(), _extends(_extends({}, tooltipDefaultProps()), {
  62. trigger: 'click',
  63. placement: 'top',
  64. mouseEnterDelay: 0.1,
  65. mouseLeaveDelay: 0.1,
  66. arrowPointAtCenter: false,
  67. autoAdjustOverflow: true,
  68. okType: 'primary',
  69. disabled: false
  70. })),
  71. slots: Object,
  72. // emits: ['update:open', 'visibleChange'],
  73. setup(props, _ref) {
  74. let {
  75. slots,
  76. emit,
  77. expose,
  78. attrs
  79. } = _ref;
  80. const rootRef = ref();
  81. warning(props.visible === undefined, 'Popconfirm', `\`visible\` will be removed in next major version, please use \`open\` instead.`);
  82. expose({
  83. getPopupDomNode: () => {
  84. var _a, _b;
  85. return (_b = (_a = rootRef.value) === null || _a === void 0 ? void 0 : _a.getPopupDomNode) === null || _b === void 0 ? void 0 : _b.call(_a);
  86. }
  87. });
  88. const [open, setOpen] = useMergedState(false, {
  89. value: toRef(props, 'open')
  90. });
  91. const settingOpen = (value, e) => {
  92. if (props.open === undefined) {
  93. setOpen(value);
  94. }
  95. emit('update:open', value);
  96. emit('openChange', value, e);
  97. };
  98. const close = e => {
  99. settingOpen(false, e);
  100. };
  101. const onConfirm = e => {
  102. var _a;
  103. return (_a = props.onConfirm) === null || _a === void 0 ? void 0 : _a.call(props, e);
  104. };
  105. const onCancel = e => {
  106. var _a;
  107. settingOpen(false, e);
  108. (_a = props.onCancel) === null || _a === void 0 ? void 0 : _a.call(props, e);
  109. };
  110. const onKeyDown = e => {
  111. if (e.keyCode === KeyCode.ESC && open) {
  112. settingOpen(false, e);
  113. }
  114. };
  115. const onOpenChange = value => {
  116. const {
  117. disabled
  118. } = props;
  119. if (disabled) {
  120. return;
  121. }
  122. settingOpen(value);
  123. };
  124. const {
  125. prefixCls: prefixClsConfirm,
  126. getPrefixCls
  127. } = useConfigInject('popconfirm', props);
  128. const rootPrefixCls = computed(() => getPrefixCls());
  129. const btnPrefixCls = computed(() => getPrefixCls('btn'));
  130. const [wrapSSR] = usePopconfirmStyle(prefixClsConfirm);
  131. const [popconfirmLocale] = useLocaleReceiver('Popconfirm', defaultLocale.Popconfirm);
  132. const renderOverlay = () => {
  133. var _a, _b, _c, _d, _e;
  134. const {
  135. okButtonProps,
  136. cancelButtonProps,
  137. title = (_a = slots.title) === null || _a === void 0 ? void 0 : _a.call(slots),
  138. description = (_b = slots.description) === null || _b === void 0 ? void 0 : _b.call(slots),
  139. cancelText = (_c = slots.cancel) === null || _c === void 0 ? void 0 : _c.call(slots),
  140. okText = (_d = slots.okText) === null || _d === void 0 ? void 0 : _d.call(slots),
  141. okType,
  142. icon = ((_e = slots.icon) === null || _e === void 0 ? void 0 : _e.call(slots)) || _createVNode(ExclamationCircleFilled, null, null),
  143. showCancel = true
  144. } = props;
  145. const {
  146. cancelButton,
  147. okButton
  148. } = slots;
  149. const cancelProps = _extends({
  150. onClick: onCancel,
  151. size: 'small'
  152. }, cancelButtonProps);
  153. const okProps = _extends(_extends(_extends({
  154. onClick: onConfirm
  155. }, convertLegacyProps(okType)), {
  156. size: 'small'
  157. }), okButtonProps);
  158. return _createVNode("div", {
  159. "class": `${prefixClsConfirm.value}-inner-content`
  160. }, [_createVNode("div", {
  161. "class": `${prefixClsConfirm.value}-message`
  162. }, [icon && _createVNode("span", {
  163. "class": `${prefixClsConfirm.value}-message-icon`
  164. }, [icon]), _createVNode("div", {
  165. "class": [`${prefixClsConfirm.value}-message-title`, {
  166. [`${prefixClsConfirm.value}-message-title-only`]: !!description
  167. }]
  168. }, [title])]), description && _createVNode("div", {
  169. "class": `${prefixClsConfirm.value}-description`
  170. }, [description]), _createVNode("div", {
  171. "class": `${prefixClsConfirm.value}-buttons`
  172. }, [showCancel ? cancelButton ? cancelButton(cancelProps) : _createVNode(Button, cancelProps, {
  173. default: () => [cancelText || popconfirmLocale.value.cancelText]
  174. }) : null, okButton ? okButton(okProps) : _createVNode(ActionButton, {
  175. "buttonProps": _extends(_extends({
  176. size: 'small'
  177. }, convertLegacyProps(okType)), okButtonProps),
  178. "actionFn": onConfirm,
  179. "close": close,
  180. "prefixCls": btnPrefixCls.value,
  181. "quitOnNullishReturnValue": true,
  182. "emitEvent": true
  183. }, {
  184. default: () => [okText || popconfirmLocale.value.okText]
  185. })])]);
  186. };
  187. return () => {
  188. var _a;
  189. const {
  190. placement,
  191. overlayClassName,
  192. trigger = 'click'
  193. } = props,
  194. restProps = __rest(props, ["placement", "overlayClassName", "trigger"]);
  195. const otherProps = omit(restProps, ['title', 'content', 'cancelText', 'okText', 'onUpdate:open', 'onConfirm', 'onCancel', 'prefixCls']);
  196. const overlayClassNames = classNames(prefixClsConfirm.value, overlayClassName);
  197. return wrapSSR(_createVNode(Popover, _objectSpread(_objectSpread(_objectSpread({}, otherProps), attrs), {}, {
  198. "trigger": trigger,
  199. "placement": placement,
  200. "onOpenChange": onOpenChange,
  201. "open": open.value,
  202. "overlayClassName": overlayClassNames,
  203. "transitionName": getTransitionName(rootPrefixCls.value, 'zoom-big', props.transitionName),
  204. "ref": rootRef,
  205. "data-popover-inject": true
  206. }), {
  207. default: () => [cloneVNodes(((_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)) || [], {
  208. onKeydown: e => {
  209. onKeyDown(e);
  210. }
  211. }, false)],
  212. content: renderOverlay
  213. }));
  214. };
  215. }
  216. });
  217. export default withInstall(Popconfirm);