Password.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. 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 _propsUtil = require("../_util/props-util");
  12. var _vnode = require("../_util/vnode");
  13. var _Input = _interopRequireDefault(require("./Input"));
  14. var _EyeOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/EyeOutlined"));
  15. var _EyeInvisibleOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/EyeInvisibleOutlined"));
  16. var _inputProps = _interopRequireDefault(require("./inputProps"));
  17. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  18. var _omit = _interopRequireDefault(require("../_util/omit"));
  19. var __rest = void 0 && (void 0).__rest || function (s, e) {
  20. var t = {};
  21. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  22. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  23. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  24. }
  25. return t;
  26. };
  27. const ActionMap = {
  28. click: 'onClick',
  29. hover: 'onMouseover'
  30. };
  31. const defaultIconRender = visible => visible ? (0, _vue.createVNode)(_EyeOutlined.default, null, null) : (0, _vue.createVNode)(_EyeInvisibleOutlined.default, null, null);
  32. var _default = exports.default = (0, _vue.defineComponent)({
  33. compatConfig: {
  34. MODE: 3
  35. },
  36. name: 'AInputPassword',
  37. inheritAttrs: false,
  38. props: (0, _extends2.default)((0, _extends2.default)({}, (0, _inputProps.default)()), {
  39. prefixCls: String,
  40. inputPrefixCls: String,
  41. action: {
  42. type: String,
  43. default: 'click'
  44. },
  45. visibilityToggle: {
  46. type: Boolean,
  47. default: true
  48. },
  49. visible: {
  50. type: Boolean,
  51. default: undefined
  52. },
  53. 'onUpdate:visible': Function,
  54. iconRender: Function
  55. }),
  56. setup(props, _ref) {
  57. let {
  58. slots,
  59. attrs,
  60. expose,
  61. emit
  62. } = _ref;
  63. const visible = (0, _vue.shallowRef)(false);
  64. const onVisibleChange = () => {
  65. const {
  66. disabled
  67. } = props;
  68. if (disabled) {
  69. return;
  70. }
  71. visible.value = !visible.value;
  72. emit('update:visible', visible.value);
  73. };
  74. (0, _vue.watchEffect)(() => {
  75. if (props.visible !== undefined) {
  76. visible.value = !!props.visible;
  77. }
  78. });
  79. const inputRef = (0, _vue.shallowRef)();
  80. const focus = () => {
  81. var _a;
  82. (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.focus();
  83. };
  84. const blur = () => {
  85. var _a;
  86. (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.blur();
  87. };
  88. expose({
  89. focus,
  90. blur
  91. });
  92. const getIcon = prefixCls => {
  93. const {
  94. action,
  95. iconRender = slots.iconRender || defaultIconRender
  96. } = props;
  97. const iconTrigger = ActionMap[action] || '';
  98. const icon = iconRender(visible.value);
  99. const iconProps = {
  100. [iconTrigger]: onVisibleChange,
  101. class: `${prefixCls}-icon`,
  102. key: 'passwordIcon',
  103. onMousedown: e => {
  104. // Prevent focused state lost
  105. // https://github.com/ant-design/ant-design/issues/15173
  106. e.preventDefault();
  107. },
  108. onMouseup: e => {
  109. // Prevent caret position change
  110. // https://github.com/ant-design/ant-design/issues/23524
  111. e.preventDefault();
  112. }
  113. };
  114. return (0, _vnode.cloneElement)((0, _propsUtil.isValidElement)(icon) ? icon : (0, _vue.createVNode)("span", null, [icon]), iconProps);
  115. };
  116. const {
  117. prefixCls,
  118. getPrefixCls
  119. } = (0, _useConfigInject.default)('input-password', props);
  120. const inputPrefixCls = (0, _vue.computed)(() => getPrefixCls('input', props.inputPrefixCls));
  121. const renderPassword = () => {
  122. const {
  123. size,
  124. visibilityToggle
  125. } = props,
  126. restProps = __rest(props, ["size", "visibilityToggle"]);
  127. const suffixIcon = visibilityToggle && getIcon(prefixCls.value);
  128. const inputClassName = (0, _classNames.default)(prefixCls.value, attrs.class, {
  129. [`${prefixCls.value}-${size}`]: !!size
  130. });
  131. const omittedProps = (0, _extends2.default)((0, _extends2.default)((0, _extends2.default)({}, (0, _omit.default)(restProps, ['suffix', 'iconRender', 'action'])), attrs), {
  132. type: visible.value ? 'text' : 'password',
  133. class: inputClassName,
  134. prefixCls: inputPrefixCls.value,
  135. suffix: suffixIcon
  136. });
  137. if (size) {
  138. omittedProps.size = size;
  139. }
  140. return (0, _vue.createVNode)(_Input.default, (0, _objectSpread2.default)({
  141. "ref": inputRef
  142. }, omittedProps), slots);
  143. };
  144. return () => {
  145. return renderPassword();
  146. };
  147. }
  148. });