index.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.inputNumberProps = exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  10. var _classNames = _interopRequireDefault(require("../_util/classNames"));
  11. var _UpOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/UpOutlined"));
  12. var _DownOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/DownOutlined"));
  13. var _InputNumber = _interopRequireWildcard(require("./src/InputNumber"));
  14. var _FormItemContext = require("../form/FormItemContext");
  15. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  16. var _vnode = require("../_util/vnode");
  17. var _omit = _interopRequireDefault(require("../_util/omit"));
  18. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  19. var _isValidValue = _interopRequireDefault(require("../_util/isValidValue"));
  20. var _statusUtils = require("../_util/statusUtils");
  21. var _type = require("../_util/type");
  22. var _style = _interopRequireDefault(require("./style"));
  23. var _Compact = require("../space/Compact");
  24. var _DisabledContext = require("../config-provider/DisabledContext");
  25. function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
  26. function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
  27. var __rest = void 0 && (void 0).__rest || function (s, e) {
  28. var t = {};
  29. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  30. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  31. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  32. }
  33. return t;
  34. };
  35. // CSSINJS
  36. const baseProps = (0, _InputNumber.inputNumberProps)();
  37. const inputNumberProps = () => (0, _extends2.default)((0, _extends2.default)({}, baseProps), {
  38. size: (0, _type.stringType)(),
  39. bordered: (0, _type.booleanType)(true),
  40. placeholder: String,
  41. name: String,
  42. id: String,
  43. type: String,
  44. addonBefore: _vueTypes.default.any,
  45. addonAfter: _vueTypes.default.any,
  46. prefix: _vueTypes.default.any,
  47. 'onUpdate:value': baseProps.onChange,
  48. valueModifiers: Object,
  49. status: (0, _type.stringType)()
  50. });
  51. exports.inputNumberProps = inputNumberProps;
  52. const InputNumber = (0, _vue.defineComponent)({
  53. compatConfig: {
  54. MODE: 3
  55. },
  56. name: 'AInputNumber',
  57. inheritAttrs: false,
  58. props: inputNumberProps(),
  59. // emits: ['focus', 'blur', 'change', 'input', 'update:value'],
  60. slots: Object,
  61. setup(props, _ref) {
  62. let {
  63. emit,
  64. expose,
  65. attrs,
  66. slots
  67. } = _ref;
  68. var _a;
  69. const formItemContext = (0, _FormItemContext.useInjectFormItemContext)();
  70. const formItemInputContext = _FormItemContext.FormItemInputContext.useInject();
  71. const mergedStatus = (0, _vue.computed)(() => (0, _statusUtils.getMergedStatus)(formItemInputContext.status, props.status));
  72. const {
  73. prefixCls,
  74. size,
  75. direction,
  76. disabled
  77. } = (0, _useConfigInject.default)('input-number', props);
  78. const {
  79. compactSize,
  80. compactItemClassnames
  81. } = (0, _Compact.useCompactItemContext)(prefixCls, direction);
  82. const disabledContext = (0, _DisabledContext.useInjectDisabled)();
  83. const mergedDisabled = (0, _vue.computed)(() => {
  84. var _a;
  85. return (_a = disabled.value) !== null && _a !== void 0 ? _a : disabledContext.value;
  86. });
  87. // Style
  88. const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
  89. const mergedSize = (0, _vue.computed)(() => compactSize.value || size.value);
  90. const mergedValue = (0, _vue.shallowRef)((_a = props.value) !== null && _a !== void 0 ? _a : props.defaultValue);
  91. const focused = (0, _vue.shallowRef)(false);
  92. (0, _vue.watch)(() => props.value, () => {
  93. mergedValue.value = props.value;
  94. });
  95. const inputNumberRef = (0, _vue.shallowRef)(null);
  96. const focus = () => {
  97. var _a;
  98. (_a = inputNumberRef.value) === null || _a === void 0 ? void 0 : _a.focus();
  99. };
  100. const blur = () => {
  101. var _a;
  102. (_a = inputNumberRef.value) === null || _a === void 0 ? void 0 : _a.blur();
  103. };
  104. expose({
  105. focus,
  106. blur
  107. });
  108. const handleChange = val => {
  109. if (props.value === undefined) {
  110. mergedValue.value = val;
  111. }
  112. emit('update:value', val);
  113. emit('change', val);
  114. formItemContext.onFieldChange();
  115. };
  116. const handleBlur = e => {
  117. focused.value = false;
  118. emit('blur', e);
  119. formItemContext.onFieldBlur();
  120. };
  121. const handleFocus = e => {
  122. focused.value = true;
  123. emit('focus', e);
  124. };
  125. return () => {
  126. var _a, _b, _c, _d;
  127. const {
  128. hasFeedback,
  129. isFormItemInput,
  130. feedbackIcon
  131. } = formItemInputContext;
  132. const id = (_a = props.id) !== null && _a !== void 0 ? _a : formItemContext.id.value;
  133. const _e = (0, _extends2.default)((0, _extends2.default)((0, _extends2.default)({}, attrs), props), {
  134. id,
  135. disabled: mergedDisabled.value
  136. }),
  137. {
  138. class: className,
  139. bordered,
  140. readonly,
  141. style,
  142. addonBefore = (_b = slots.addonBefore) === null || _b === void 0 ? void 0 : _b.call(slots),
  143. addonAfter = (_c = slots.addonAfter) === null || _c === void 0 ? void 0 : _c.call(slots),
  144. prefix = (_d = slots.prefix) === null || _d === void 0 ? void 0 : _d.call(slots),
  145. valueModifiers = {}
  146. } = _e,
  147. others = __rest(_e, ["class", "bordered", "readonly", "style", "addonBefore", "addonAfter", "prefix", "valueModifiers"]);
  148. const preCls = prefixCls.value;
  149. const inputNumberClass = (0, _classNames.default)({
  150. [`${preCls}-lg`]: mergedSize.value === 'large',
  151. [`${preCls}-sm`]: mergedSize.value === 'small',
  152. [`${preCls}-rtl`]: direction.value === 'rtl',
  153. [`${preCls}-readonly`]: readonly,
  154. [`${preCls}-borderless`]: !bordered,
  155. [`${preCls}-in-form-item`]: isFormItemInput
  156. }, (0, _statusUtils.getStatusClassNames)(preCls, mergedStatus.value), className, compactItemClassnames.value, hashId.value);
  157. let element = (0, _vue.createVNode)(_InputNumber.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _omit.default)(others, ['size', 'defaultValue'])), {}, {
  158. "ref": inputNumberRef,
  159. "lazy": !!valueModifiers.lazy,
  160. "value": mergedValue.value,
  161. "class": inputNumberClass,
  162. "prefixCls": preCls,
  163. "readonly": readonly,
  164. "onChange": handleChange,
  165. "onBlur": handleBlur,
  166. "onFocus": handleFocus
  167. }), {
  168. upHandler: slots.upIcon ? () => (0, _vue.createVNode)("span", {
  169. "class": `${preCls}-handler-up-inner`
  170. }, [slots.upIcon()]) : () => (0, _vue.createVNode)(_UpOutlined.default, {
  171. "class": `${preCls}-handler-up-inner`
  172. }, null),
  173. downHandler: slots.downIcon ? () => (0, _vue.createVNode)("span", {
  174. "class": `${preCls}-handler-down-inner`
  175. }, [slots.downIcon()]) : () => (0, _vue.createVNode)(_DownOutlined.default, {
  176. "class": `${preCls}-handler-down-inner`
  177. }, null)
  178. });
  179. const hasAddon = (0, _isValidValue.default)(addonBefore) || (0, _isValidValue.default)(addonAfter);
  180. const hasPrefix = (0, _isValidValue.default)(prefix);
  181. if (hasPrefix || hasFeedback) {
  182. const affixWrapperCls = (0, _classNames.default)(`${preCls}-affix-wrapper`, (0, _statusUtils.getStatusClassNames)(`${preCls}-affix-wrapper`, mergedStatus.value, hasFeedback), {
  183. [`${preCls}-affix-wrapper-focused`]: focused.value,
  184. [`${preCls}-affix-wrapper-disabled`]: mergedDisabled.value,
  185. [`${preCls}-affix-wrapper-sm`]: mergedSize.value === 'small',
  186. [`${preCls}-affix-wrapper-lg`]: mergedSize.value === 'large',
  187. [`${preCls}-affix-wrapper-rtl`]: direction.value === 'rtl',
  188. [`${preCls}-affix-wrapper-readonly`]: readonly,
  189. [`${preCls}-affix-wrapper-borderless`]: !bordered,
  190. // className will go to addon wrapper
  191. [`${className}`]: !hasAddon && className
  192. }, hashId.value);
  193. element = (0, _vue.createVNode)("div", {
  194. "class": affixWrapperCls,
  195. "style": style,
  196. "onClick": focus
  197. }, [hasPrefix && (0, _vue.createVNode)("span", {
  198. "class": `${preCls}-prefix`
  199. }, [prefix]), element, hasFeedback && (0, _vue.createVNode)("span", {
  200. "class": `${preCls}-suffix`
  201. }, [feedbackIcon])]);
  202. }
  203. if (hasAddon) {
  204. const wrapperClassName = `${preCls}-group`;
  205. const addonClassName = `${wrapperClassName}-addon`;
  206. const addonBeforeNode = addonBefore ? (0, _vue.createVNode)("div", {
  207. "class": addonClassName
  208. }, [addonBefore]) : null;
  209. const addonAfterNode = addonAfter ? (0, _vue.createVNode)("div", {
  210. "class": addonClassName
  211. }, [addonAfter]) : null;
  212. const mergedWrapperClassName = (0, _classNames.default)(`${preCls}-wrapper`, wrapperClassName, {
  213. [`${wrapperClassName}-rtl`]: direction.value === 'rtl'
  214. }, hashId.value);
  215. const mergedGroupClassName = (0, _classNames.default)(`${preCls}-group-wrapper`, {
  216. [`${preCls}-group-wrapper-sm`]: mergedSize.value === 'small',
  217. [`${preCls}-group-wrapper-lg`]: mergedSize.value === 'large',
  218. [`${preCls}-group-wrapper-rtl`]: direction.value === 'rtl'
  219. }, (0, _statusUtils.getStatusClassNames)(`${prefixCls}-group-wrapper`, mergedStatus.value, hasFeedback), className, hashId.value);
  220. element = (0, _vue.createVNode)("div", {
  221. "class": mergedGroupClassName,
  222. "style": style
  223. }, [(0, _vue.createVNode)("div", {
  224. "class": mergedWrapperClassName
  225. }, [addonBeforeNode && (0, _vue.createVNode)(_Compact.NoCompactStyle, null, {
  226. default: () => [(0, _vue.createVNode)(_FormItemContext.NoFormStatus, null, {
  227. default: () => [addonBeforeNode]
  228. })]
  229. }), element, addonAfterNode && (0, _vue.createVNode)(_Compact.NoCompactStyle, null, {
  230. default: () => [(0, _vue.createVNode)(_FormItemContext.NoFormStatus, null, {
  231. default: () => [addonAfterNode]
  232. })]
  233. })])]);
  234. }
  235. return wrapSSR((0, _vnode.cloneElement)(element, {
  236. style
  237. }));
  238. };
  239. }
  240. });
  241. var _default = exports.default = (0, _extends2.default)(InputNumber, {
  242. install: app => {
  243. app.component(InputNumber.name, InputNumber);
  244. return app;
  245. }
  246. });