Password.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
  2. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  3. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  4. var _excluded = ["size", "visibilityToggle"];
  5. import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
  6. import classNames from '../_util/classNames';
  7. import { isValidElement } from '../_util/props-util';
  8. import { cloneElement } from '../_util/vnode';
  9. import Input from './Input';
  10. import EyeOutlined from "@ant-design/icons-vue/es/icons/EyeOutlined";
  11. import EyeInvisibleOutlined from "@ant-design/icons-vue/es/icons/EyeInvisibleOutlined";
  12. import inputProps from './inputProps';
  13. import { computed, defineComponent, ref } from 'vue';
  14. import useConfigInject from '../_util/hooks/useConfigInject';
  15. import omit from '../_util/omit';
  16. var ActionMap = {
  17. click: 'onClick',
  18. hover: 'onMouseover'
  19. };
  20. var defaultIconRender = function defaultIconRender(visible) {
  21. return visible ? _createVNode(EyeOutlined, null, null) : _createVNode(EyeInvisibleOutlined, null, null);
  22. };
  23. export default defineComponent({
  24. compatConfig: {
  25. MODE: 3
  26. },
  27. name: 'AInputPassword',
  28. inheritAttrs: false,
  29. props: _objectSpread(_objectSpread({}, inputProps()), {}, {
  30. prefixCls: String,
  31. inputPrefixCls: String,
  32. action: {
  33. type: String,
  34. default: 'click'
  35. },
  36. visibilityToggle: {
  37. type: Boolean,
  38. default: true
  39. },
  40. iconRender: Function
  41. }),
  42. setup: function setup(props, _ref) {
  43. var slots = _ref.slots,
  44. attrs = _ref.attrs,
  45. expose = _ref.expose;
  46. var visible = ref(false);
  47. var onVisibleChange = function onVisibleChange() {
  48. var disabled = props.disabled;
  49. if (disabled) {
  50. return;
  51. }
  52. visible.value = !visible.value;
  53. };
  54. var inputRef = ref();
  55. var focus = function focus() {
  56. var _inputRef$value;
  57. (_inputRef$value = inputRef.value) === null || _inputRef$value === void 0 ? void 0 : _inputRef$value.focus();
  58. };
  59. var blur = function blur() {
  60. var _inputRef$value2;
  61. (_inputRef$value2 = inputRef.value) === null || _inputRef$value2 === void 0 ? void 0 : _inputRef$value2.blur();
  62. };
  63. expose({
  64. focus: focus,
  65. blur: blur
  66. });
  67. var getIcon = function getIcon(prefixCls) {
  68. var _iconProps;
  69. var action = props.action,
  70. _props$iconRender = props.iconRender,
  71. iconRender = _props$iconRender === void 0 ? slots.iconRender || defaultIconRender : _props$iconRender;
  72. var iconTrigger = ActionMap[action] || '';
  73. var icon = iconRender(visible.value);
  74. var iconProps = (_iconProps = {}, _defineProperty(_iconProps, iconTrigger, onVisibleChange), _defineProperty(_iconProps, "class", "".concat(prefixCls, "-icon")), _defineProperty(_iconProps, "key", 'passwordIcon'), _defineProperty(_iconProps, "onMousedown", function onMousedown(e) {
  75. // Prevent focused state lost
  76. // https://github.com/ant-design/ant-design/issues/15173
  77. e.preventDefault();
  78. }), _defineProperty(_iconProps, "onMouseup", function onMouseup(e) {
  79. // Prevent caret position change
  80. // https://github.com/ant-design/ant-design/issues/23524
  81. e.preventDefault();
  82. }), _iconProps);
  83. return cloneElement(isValidElement(icon) ? icon : _createVNode("span", null, [icon]), iconProps);
  84. };
  85. var _useConfigInject = useConfigInject('input-password', props),
  86. prefixCls = _useConfigInject.prefixCls,
  87. getPrefixCls = _useConfigInject.getPrefixCls;
  88. var inputPrefixCls = computed(function () {
  89. return getPrefixCls('input', props.inputPrefixCls);
  90. });
  91. var renderPassword = function renderPassword() {
  92. var size = props.size,
  93. visibilityToggle = props.visibilityToggle,
  94. restProps = _objectWithoutProperties(props, _excluded);
  95. var suffixIcon = visibilityToggle && getIcon(prefixCls.value);
  96. var inputClassName = classNames(prefixCls.value, attrs.class, _defineProperty({}, "".concat(prefixCls.value, "-").concat(size), !!size));
  97. var omittedProps = _objectSpread(_objectSpread(_objectSpread({}, omit(restProps, ['suffix', 'iconRender', 'action'])), attrs), {}, {
  98. type: visible.value ? 'text' : 'password',
  99. class: inputClassName,
  100. prefixCls: inputPrefixCls.value,
  101. suffix: suffixIcon
  102. });
  103. if (size) {
  104. omittedProps.size = size;
  105. }
  106. return _createVNode(Input, _objectSpread({
  107. "ref": inputRef
  108. }, omittedProps), slots);
  109. };
  110. return function () {
  111. return renderPassword();
  112. };
  113. }
  114. });