1705 lines
57 KiB
JavaScript
1705 lines
57 KiB
JavaScript
import _objectSpread$2 from '@babel/runtime/helpers/esm/objectSpread2';
|
|
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
import { createVNode, defineComponent, ref, computed, Fragment, shallowRef, watchEffect, getCurrentInstance, watch, nextTick } from 'vue';
|
|
import { ba as Icon, C as useConfigInject, bv as useCompactItemContext, Y as useInjectDisabled, aC as CloseCircleFilled, E as omit, F as classNames, aP as NoCompactStyle, ao as eventType, L as anyType, P as PropTypes, M as tuple, W as stringType, a3 as filterEmpty, ac as cloneElement, a9 as isValidElement, aE as warning, a1 as Button } from './server.mjs';
|
|
import { u as useInjectFormItemContext, F as FormItemInputContext, N as NoFormStatus } from './FormItemContext-CDDW52IT.mjs';
|
|
import { g as getMergedStatus, a as getStatusClassNames } from './statusUtils-C3ZNzkeD.mjs';
|
|
import { B as BaseInput$1, R as ResizeObserver } from './BaseInput-_gwhwanN.mjs';
|
|
import { u as useStyle } from './index-C1mihc8c.mjs';
|
|
import { S as SearchOutlined } from '../_/SearchOutlined.mjs';
|
|
import isPlainObject from 'lodash-es/isPlainObject.js';
|
|
import { w as wrapperRaf } from './raf-ruCY1ktO.mjs';
|
|
|
|
// This icon file is generated automatically.
|
|
var EyeOutlined$1 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z" } }] }, "name": "eye", "theme": "outlined" };
|
|
|
|
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? Object(arguments[i]) : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty$1(target, key, source[key]); }); } return target; }
|
|
|
|
function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
|
|
var EyeOutlined = function EyeOutlined(props, context) {
|
|
var p = _objectSpread$1({}, props, context.attrs);
|
|
|
|
return createVNode(Icon, _objectSpread$1({}, p, {
|
|
"icon": EyeOutlined$1
|
|
}), null);
|
|
};
|
|
|
|
EyeOutlined.displayName = 'EyeOutlined';
|
|
EyeOutlined.inheritAttrs = false;
|
|
|
|
// This icon file is generated automatically.
|
|
var EyeInvisibleOutlined$1 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512 791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 000-51.5zm-63.57-320.64L836 122.88a8 8 0 00-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 000 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 000 11.31L155.17 889a8 8 0 0011.31 0l712.15-712.12a8 8 0 000-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 00-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 01146.2-106.69L401.31 546.2A112 112 0 01396 512z" } }, { "tag": "path", "attrs": { "d": "M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 00227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 01-112 112z" } }] }, "name": "eye-invisible", "theme": "outlined" };
|
|
|
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? Object(arguments[i]) : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
|
|
|
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
|
|
var EyeInvisibleOutlined = function EyeInvisibleOutlined(props, context) {
|
|
var p = _objectSpread({}, props, context.attrs);
|
|
|
|
return createVNode(Icon, _objectSpread({}, p, {
|
|
"icon": EyeInvisibleOutlined$1
|
|
}), null);
|
|
};
|
|
|
|
EyeInvisibleOutlined.displayName = 'EyeInvisibleOutlined';
|
|
EyeInvisibleOutlined.inheritAttrs = false;
|
|
|
|
const isValid$1 = (value) => {
|
|
return value !== void 0 && value !== null && (Array.isArray(value) ? filterEmpty(value).length : true);
|
|
};
|
|
function hasPrefixSuffix(propsAndSlots) {
|
|
return isValid$1(propsAndSlots.prefix) || isValid$1(propsAndSlots.suffix) || isValid$1(propsAndSlots.allowClear);
|
|
}
|
|
function hasAddon$1(propsAndSlots) {
|
|
return isValid$1(propsAndSlots.addonBefore) || isValid$1(propsAndSlots.addonAfter);
|
|
}
|
|
function fixControlledValue(value) {
|
|
if (typeof value === "undefined" || value === null) {
|
|
return "";
|
|
}
|
|
return String(value);
|
|
}
|
|
function resolveOnChange(target, e, onChange, targetValue) {
|
|
if (!onChange) {
|
|
return;
|
|
}
|
|
const event = e;
|
|
if (e.type === "click") {
|
|
Object.defineProperty(event, "target", {
|
|
writable: true
|
|
});
|
|
Object.defineProperty(event, "currentTarget", {
|
|
writable: true
|
|
});
|
|
const currentTarget = target.cloneNode(true);
|
|
event.target = currentTarget;
|
|
event.currentTarget = currentTarget;
|
|
currentTarget.value = "";
|
|
onChange(event);
|
|
return;
|
|
}
|
|
if (targetValue !== void 0) {
|
|
Object.defineProperty(event, "target", {
|
|
writable: true
|
|
});
|
|
Object.defineProperty(event, "currentTarget", {
|
|
writable: true
|
|
});
|
|
event.target = target;
|
|
event.currentTarget = target;
|
|
target.value = targetValue;
|
|
onChange(event);
|
|
return;
|
|
}
|
|
onChange(event);
|
|
}
|
|
function triggerFocus(element, option) {
|
|
if (!element) return;
|
|
element.focus(option);
|
|
const {
|
|
cursor
|
|
} = option || {};
|
|
if (cursor) {
|
|
const len = element.value.length;
|
|
switch (cursor) {
|
|
case "start":
|
|
element.setSelectionRange(0, 0);
|
|
break;
|
|
case "end":
|
|
element.setSelectionRange(len, len);
|
|
break;
|
|
default:
|
|
element.setSelectionRange(0, len);
|
|
}
|
|
}
|
|
}
|
|
const commonInputProps = () => {
|
|
return {
|
|
addonBefore: PropTypes.any,
|
|
addonAfter: PropTypes.any,
|
|
prefix: PropTypes.any,
|
|
suffix: PropTypes.any,
|
|
clearIcon: PropTypes.any,
|
|
affixWrapperClassName: String,
|
|
groupClassName: String,
|
|
wrapperClassName: String,
|
|
inputClassName: String,
|
|
allowClear: {
|
|
type: Boolean,
|
|
default: void 0
|
|
}
|
|
};
|
|
};
|
|
const baseInputProps = () => {
|
|
return _extends(_extends({}, commonInputProps()), {
|
|
value: {
|
|
type: [String, Number, Symbol],
|
|
default: void 0
|
|
},
|
|
defaultValue: {
|
|
type: [String, Number, Symbol],
|
|
default: void 0
|
|
},
|
|
inputElement: PropTypes.any,
|
|
prefixCls: String,
|
|
disabled: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
focused: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
triggerFocus: Function,
|
|
readonly: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
handleReset: Function,
|
|
hidden: {
|
|
type: Boolean,
|
|
default: void 0
|
|
}
|
|
});
|
|
};
|
|
const inputProps$1 = () => _extends(_extends({}, baseInputProps()), {
|
|
id: String,
|
|
placeholder: {
|
|
type: [String, Number]
|
|
},
|
|
autocomplete: String,
|
|
type: stringType("text"),
|
|
name: String,
|
|
size: {
|
|
type: String
|
|
},
|
|
autofocus: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
lazy: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
maxlength: Number,
|
|
loading: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
bordered: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
showCount: {
|
|
type: [Boolean, Object]
|
|
},
|
|
htmlSize: Number,
|
|
onPressEnter: Function,
|
|
onKeydown: Function,
|
|
onKeyup: Function,
|
|
onFocus: Function,
|
|
onBlur: Function,
|
|
onChange: Function,
|
|
onInput: Function,
|
|
"onUpdate:value": Function,
|
|
onCompositionstart: Function,
|
|
onCompositionend: Function,
|
|
valueModifiers: Object,
|
|
hidden: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
status: String
|
|
});
|
|
const BaseInput = defineComponent({
|
|
name: "BaseInput",
|
|
inheritAttrs: false,
|
|
props: baseInputProps(),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs
|
|
} = _ref;
|
|
const containerRef = ref();
|
|
const onInputMouseDown = (e) => {
|
|
var _a;
|
|
if ((_a = containerRef.value) === null || _a === void 0 ? void 0 : _a.contains(e.target)) {
|
|
const {
|
|
triggerFocus: triggerFocus2
|
|
} = props;
|
|
triggerFocus2 === null || triggerFocus2 === void 0 ? void 0 : triggerFocus2();
|
|
}
|
|
};
|
|
const getClearIcon = () => {
|
|
var _a;
|
|
const {
|
|
allowClear,
|
|
value,
|
|
disabled,
|
|
readonly,
|
|
handleReset,
|
|
suffix = slots.suffix,
|
|
prefixCls
|
|
} = props;
|
|
if (!allowClear) {
|
|
return null;
|
|
}
|
|
const needClear = !disabled && !readonly && value;
|
|
const className = `${prefixCls}-clear-icon`;
|
|
const iconNode = ((_a = slots.clearIcon) === null || _a === void 0 ? void 0 : _a.call(slots)) || "*";
|
|
return createVNode("span", {
|
|
"onClick": handleReset,
|
|
"onMousedown": (e) => e.preventDefault(),
|
|
"class": classNames({
|
|
[`${className}-hidden`]: !needClear,
|
|
[`${className}-has-suffix`]: !!suffix
|
|
}, className),
|
|
"role": "button",
|
|
"tabindex": -1
|
|
}, [iconNode]);
|
|
};
|
|
return () => {
|
|
var _a, _b;
|
|
const {
|
|
focused,
|
|
value,
|
|
disabled,
|
|
allowClear,
|
|
readonly,
|
|
hidden,
|
|
prefixCls,
|
|
prefix = (_a = slots.prefix) === null || _a === void 0 ? void 0 : _a.call(slots),
|
|
suffix = (_b = slots.suffix) === null || _b === void 0 ? void 0 : _b.call(slots),
|
|
addonAfter = slots.addonAfter,
|
|
addonBefore = slots.addonBefore,
|
|
inputElement,
|
|
affixWrapperClassName,
|
|
wrapperClassName,
|
|
groupClassName
|
|
} = props;
|
|
let element = cloneElement(inputElement, {
|
|
value,
|
|
hidden
|
|
});
|
|
if (hasPrefixSuffix({
|
|
prefix,
|
|
suffix,
|
|
allowClear
|
|
})) {
|
|
const affixWrapperPrefixCls = `${prefixCls}-affix-wrapper`;
|
|
const affixWrapperCls = classNames(affixWrapperPrefixCls, {
|
|
[`${affixWrapperPrefixCls}-disabled`]: disabled,
|
|
[`${affixWrapperPrefixCls}-focused`]: focused,
|
|
[`${affixWrapperPrefixCls}-readonly`]: readonly,
|
|
[`${affixWrapperPrefixCls}-input-with-clear-btn`]: suffix && allowClear && value
|
|
}, !hasAddon$1({
|
|
addonAfter,
|
|
addonBefore
|
|
}) && attrs.class, affixWrapperClassName);
|
|
const suffixNode = (suffix || allowClear) && createVNode("span", {
|
|
"class": `${prefixCls}-suffix`
|
|
}, [getClearIcon(), suffix]);
|
|
element = createVNode("span", {
|
|
"class": affixWrapperCls,
|
|
"style": attrs.style,
|
|
"hidden": !hasAddon$1({
|
|
addonAfter,
|
|
addonBefore
|
|
}) && hidden,
|
|
"onMousedown": onInputMouseDown,
|
|
"ref": containerRef
|
|
}, [prefix && createVNode("span", {
|
|
"class": `${prefixCls}-prefix`
|
|
}, [prefix]), cloneElement(inputElement, {
|
|
style: null,
|
|
value,
|
|
hidden: null
|
|
}), suffixNode]);
|
|
}
|
|
if (hasAddon$1({
|
|
addonAfter,
|
|
addonBefore
|
|
})) {
|
|
const wrapperCls = `${prefixCls}-group`;
|
|
const addonCls = `${wrapperCls}-addon`;
|
|
const mergedWrapperClassName = classNames(`${prefixCls}-wrapper`, wrapperCls, wrapperClassName);
|
|
const mergedGroupClassName = classNames(`${prefixCls}-group-wrapper`, attrs.class, groupClassName);
|
|
return createVNode("span", {
|
|
"class": mergedGroupClassName,
|
|
"style": attrs.style,
|
|
"hidden": hidden
|
|
}, [createVNode("span", {
|
|
"class": mergedWrapperClassName
|
|
}, [addonBefore && createVNode("span", {
|
|
"class": addonCls
|
|
}, [addonBefore]), cloneElement(element, {
|
|
style: null,
|
|
hidden: null
|
|
}), addonAfter && createVNode("span", {
|
|
"class": addonCls
|
|
}, [addonAfter])])]);
|
|
}
|
|
return element;
|
|
};
|
|
}
|
|
});
|
|
var __rest$3 = function(s, e) {
|
|
var t = {};
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
}
|
|
return t;
|
|
};
|
|
const VcInput = defineComponent({
|
|
name: "VCInput",
|
|
inheritAttrs: false,
|
|
props: inputProps$1(),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs,
|
|
expose,
|
|
emit
|
|
} = _ref;
|
|
const stateValue = shallowRef(props.value === void 0 ? props.defaultValue : props.value);
|
|
const focused = shallowRef(false);
|
|
const inputRef = shallowRef();
|
|
const rootRef = shallowRef();
|
|
watch(() => props.value, () => {
|
|
stateValue.value = props.value;
|
|
});
|
|
watch(() => props.disabled, () => {
|
|
if (props.disabled) {
|
|
focused.value = false;
|
|
}
|
|
});
|
|
const focus = (option) => {
|
|
if (inputRef.value) {
|
|
triggerFocus(inputRef.value.input, option);
|
|
}
|
|
};
|
|
const blur = () => {
|
|
var _a;
|
|
(_a = inputRef.value.input) === null || _a === void 0 ? void 0 : _a.blur();
|
|
};
|
|
const setSelectionRange = (start, end, direction) => {
|
|
var _a;
|
|
(_a = inputRef.value.input) === null || _a === void 0 ? void 0 : _a.setSelectionRange(start, end, direction);
|
|
};
|
|
const select = () => {
|
|
var _a;
|
|
(_a = inputRef.value.input) === null || _a === void 0 ? void 0 : _a.select();
|
|
};
|
|
expose({
|
|
focus,
|
|
blur,
|
|
input: computed(() => {
|
|
var _a;
|
|
return (_a = inputRef.value.input) === null || _a === void 0 ? void 0 : _a.input;
|
|
}),
|
|
stateValue,
|
|
setSelectionRange,
|
|
select
|
|
});
|
|
const triggerChange = (e) => {
|
|
emit("change", e);
|
|
};
|
|
const setValue = (value, callback) => {
|
|
if (stateValue.value === value) {
|
|
return;
|
|
}
|
|
if (props.value === void 0) {
|
|
stateValue.value = value;
|
|
} else {
|
|
nextTick(() => {
|
|
var _a;
|
|
if (inputRef.value.input.value !== stateValue.value) {
|
|
(_a = rootRef.value) === null || _a === void 0 ? void 0 : _a.$forceUpdate();
|
|
}
|
|
});
|
|
}
|
|
nextTick(() => {
|
|
callback && callback();
|
|
});
|
|
};
|
|
const handleChange = (e) => {
|
|
const {
|
|
value
|
|
} = e.target;
|
|
if (stateValue.value === value) return;
|
|
const newVal = e.target.value;
|
|
resolveOnChange(inputRef.value.input, e, triggerChange);
|
|
setValue(newVal);
|
|
};
|
|
const handleKeyDown = (e) => {
|
|
if (e.keyCode === 13) {
|
|
emit("pressEnter", e);
|
|
}
|
|
emit("keydown", e);
|
|
};
|
|
const handleFocus = (e) => {
|
|
focused.value = true;
|
|
emit("focus", e);
|
|
};
|
|
const handleBlur = (e) => {
|
|
focused.value = false;
|
|
emit("blur", e);
|
|
};
|
|
const handleReset = (e) => {
|
|
resolveOnChange(inputRef.value.input, e, triggerChange);
|
|
setValue("", () => {
|
|
focus();
|
|
});
|
|
};
|
|
const getInputElement = () => {
|
|
var _a, _b;
|
|
const {
|
|
addonBefore = slots.addonBefore,
|
|
addonAfter = slots.addonAfter,
|
|
disabled,
|
|
valueModifiers = {},
|
|
htmlSize,
|
|
autocomplete,
|
|
prefixCls,
|
|
inputClassName,
|
|
prefix = (_a = slots.prefix) === null || _a === void 0 ? void 0 : _a.call(slots),
|
|
suffix = (_b = slots.suffix) === null || _b === void 0 ? void 0 : _b.call(slots),
|
|
allowClear,
|
|
type = "text"
|
|
} = props;
|
|
const otherProps = omit(props, [
|
|
"prefixCls",
|
|
"onPressEnter",
|
|
"addonBefore",
|
|
"addonAfter",
|
|
"prefix",
|
|
"suffix",
|
|
"allowClear",
|
|
// Input elements must be either controlled or uncontrolled,
|
|
// specify either the value prop, or the defaultValue prop, but not both.
|
|
"defaultValue",
|
|
"size",
|
|
"bordered",
|
|
"htmlSize",
|
|
"lazy",
|
|
"showCount",
|
|
"valueModifiers",
|
|
"showCount",
|
|
"affixWrapperClassName",
|
|
"groupClassName",
|
|
"inputClassName",
|
|
"wrapperClassName"
|
|
]);
|
|
const inputProps2 = _extends(_extends(_extends({}, otherProps), attrs), {
|
|
autocomplete,
|
|
onChange: handleChange,
|
|
onInput: handleChange,
|
|
onFocus: handleFocus,
|
|
onBlur: handleBlur,
|
|
onKeydown: handleKeyDown,
|
|
class: classNames(prefixCls, {
|
|
[`${prefixCls}-disabled`]: disabled
|
|
}, inputClassName, !hasAddon$1({
|
|
addonAfter,
|
|
addonBefore
|
|
}) && !hasPrefixSuffix({
|
|
prefix,
|
|
suffix,
|
|
allowClear
|
|
}) && attrs.class),
|
|
ref: inputRef,
|
|
key: "ant-input",
|
|
size: htmlSize,
|
|
type,
|
|
lazy: props.lazy
|
|
});
|
|
if (valueModifiers.lazy) {
|
|
delete inputProps2.onInput;
|
|
}
|
|
if (!inputProps2.autofocus) {
|
|
delete inputProps2.autofocus;
|
|
}
|
|
const inputNode = createVNode(BaseInput$1, omit(inputProps2, ["size"]), null);
|
|
return inputNode;
|
|
};
|
|
const getSuffix = () => {
|
|
var _a;
|
|
const {
|
|
maxlength,
|
|
suffix = (_a = slots.suffix) === null || _a === void 0 ? void 0 : _a.call(slots),
|
|
showCount,
|
|
prefixCls
|
|
} = props;
|
|
const hasMaxLength = Number(maxlength) > 0;
|
|
if (suffix || showCount) {
|
|
const valueLength = [...fixControlledValue(stateValue.value)].length;
|
|
const dataCount = typeof showCount === "object" ? showCount.formatter({
|
|
count: valueLength,
|
|
maxlength
|
|
}) : `${valueLength}${hasMaxLength ? ` / ${maxlength}` : ""}`;
|
|
return createVNode(Fragment, null, [!!showCount && createVNode("span", {
|
|
"class": classNames(`${prefixCls}-show-count-suffix`, {
|
|
[`${prefixCls}-show-count-has-suffix`]: !!suffix
|
|
})
|
|
}, [dataCount]), suffix]);
|
|
}
|
|
return null;
|
|
};
|
|
return () => {
|
|
const {
|
|
prefixCls,
|
|
disabled
|
|
} = props, rest = __rest$3(props, ["prefixCls", "disabled"]);
|
|
return createVNode(BaseInput, _objectSpread$2(_objectSpread$2(_objectSpread$2({}, rest), attrs), {}, {
|
|
"ref": rootRef,
|
|
"prefixCls": prefixCls,
|
|
"inputElement": getInputElement(),
|
|
"handleReset": handleReset,
|
|
"value": fixControlledValue(stateValue.value),
|
|
"focused": focused.value,
|
|
"triggerFocus": focus,
|
|
"suffix": getSuffix(),
|
|
"disabled": disabled
|
|
}), slots);
|
|
};
|
|
}
|
|
});
|
|
const inputProps = () => {
|
|
return omit(inputProps$1(), ["wrapperClassName", "groupClassName", "inputClassName", "affixWrapperClassName"]);
|
|
};
|
|
const textAreaProps = () => _extends(_extends({}, omit(inputProps(), ["prefix", "addonBefore", "addonAfter", "suffix"])), {
|
|
rows: Number,
|
|
autosize: {
|
|
type: [Boolean, Object],
|
|
default: void 0
|
|
},
|
|
autoSize: {
|
|
type: [Boolean, Object],
|
|
default: void 0
|
|
},
|
|
onResize: {
|
|
type: Function
|
|
},
|
|
onCompositionstart: eventType(),
|
|
onCompositionend: eventType(),
|
|
valueModifiers: Object
|
|
});
|
|
var __rest$2 = function(s, e) {
|
|
var t = {};
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
}
|
|
return t;
|
|
};
|
|
const Input = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "AInput",
|
|
inheritAttrs: false,
|
|
props: inputProps(),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs,
|
|
expose,
|
|
emit
|
|
} = _ref;
|
|
const inputRef = ref();
|
|
const formItemContext = useInjectFormItemContext();
|
|
const formItemInputContext = FormItemInputContext.useInject();
|
|
const mergedStatus = computed(() => getMergedStatus(formItemInputContext.status, props.status));
|
|
const {
|
|
direction,
|
|
prefixCls,
|
|
size,
|
|
autocomplete
|
|
} = useConfigInject("input", props);
|
|
const {
|
|
compactSize,
|
|
compactItemClassnames
|
|
} = useCompactItemContext(prefixCls, direction);
|
|
const mergedSize = computed(() => {
|
|
return compactSize.value || size.value;
|
|
});
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const disabled = useInjectDisabled();
|
|
const focus = (option) => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.focus(option);
|
|
};
|
|
const blur = () => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.blur();
|
|
};
|
|
const setSelectionRange = (start, end, direction2) => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.setSelectionRange(start, end, direction2);
|
|
};
|
|
const select = () => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.select();
|
|
};
|
|
expose({
|
|
focus,
|
|
blur,
|
|
input: inputRef,
|
|
setSelectionRange,
|
|
select
|
|
});
|
|
const removePasswordTimeoutRef = ref([]);
|
|
const removePasswordTimeout = () => {
|
|
removePasswordTimeoutRef.value.push(setTimeout(() => {
|
|
var _a, _b, _c, _d;
|
|
if (((_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input) && ((_b = inputRef.value) === null || _b === void 0 ? void 0 : _b.input.getAttribute("type")) === "password" && ((_c = inputRef.value) === null || _c === void 0 ? void 0 : _c.input.hasAttribute("value"))) {
|
|
(_d = inputRef.value) === null || _d === void 0 ? void 0 : _d.input.removeAttribute("value");
|
|
}
|
|
}));
|
|
};
|
|
const handleBlur = (e) => {
|
|
removePasswordTimeout();
|
|
emit("blur", e);
|
|
formItemContext.onFieldBlur();
|
|
};
|
|
const handleFocus = (e) => {
|
|
removePasswordTimeout();
|
|
emit("focus", e);
|
|
};
|
|
const triggerChange = (e) => {
|
|
emit("update:value", e.target.value);
|
|
emit("change", e);
|
|
emit("input", e);
|
|
formItemContext.onFieldChange();
|
|
};
|
|
return () => {
|
|
var _a, _b, _c, _d, _e, _f;
|
|
const {
|
|
hasFeedback,
|
|
feedbackIcon
|
|
} = formItemInputContext;
|
|
const {
|
|
allowClear,
|
|
bordered = true,
|
|
prefix = (_a = slots.prefix) === null || _a === void 0 ? void 0 : _a.call(slots),
|
|
suffix = (_b = slots.suffix) === null || _b === void 0 ? void 0 : _b.call(slots),
|
|
addonAfter = (_c = slots.addonAfter) === null || _c === void 0 ? void 0 : _c.call(slots),
|
|
addonBefore = (_d = slots.addonBefore) === null || _d === void 0 ? void 0 : _d.call(slots),
|
|
id = (_e = formItemContext.id) === null || _e === void 0 ? void 0 : _e.value
|
|
} = props, rest = __rest$2(props, ["allowClear", "bordered", "prefix", "suffix", "addonAfter", "addonBefore", "id"]);
|
|
const suffixNode = (hasFeedback || suffix) && createVNode(Fragment, null, [suffix, hasFeedback && feedbackIcon]);
|
|
const prefixClsValue = prefixCls.value;
|
|
const inputHasPrefixSuffix = hasPrefixSuffix({
|
|
prefix,
|
|
suffix
|
|
}) || !!hasFeedback;
|
|
const clearIcon = slots.clearIcon || (() => createVNode(CloseCircleFilled, null, null));
|
|
return wrapSSR(createVNode(VcInput, _objectSpread$2(_objectSpread$2(_objectSpread$2({}, attrs), omit(rest, ["onUpdate:value", "onChange", "onInput"])), {}, {
|
|
"onChange": triggerChange,
|
|
"id": id,
|
|
"disabled": (_f = props.disabled) !== null && _f !== void 0 ? _f : disabled.value,
|
|
"ref": inputRef,
|
|
"prefixCls": prefixClsValue,
|
|
"autocomplete": autocomplete.value,
|
|
"onBlur": handleBlur,
|
|
"onFocus": handleFocus,
|
|
"prefix": prefix,
|
|
"suffix": suffixNode,
|
|
"allowClear": allowClear,
|
|
"addonAfter": addonAfter && createVNode(NoCompactStyle, null, {
|
|
default: () => [createVNode(NoFormStatus, null, {
|
|
default: () => [addonAfter]
|
|
})]
|
|
}),
|
|
"addonBefore": addonBefore && createVNode(NoCompactStyle, null, {
|
|
default: () => [createVNode(NoFormStatus, null, {
|
|
default: () => [addonBefore]
|
|
})]
|
|
}),
|
|
"class": [attrs.class, compactItemClassnames.value],
|
|
"inputClassName": classNames({
|
|
[`${prefixClsValue}-sm`]: mergedSize.value === "small",
|
|
[`${prefixClsValue}-lg`]: mergedSize.value === "large",
|
|
[`${prefixClsValue}-rtl`]: direction.value === "rtl",
|
|
[`${prefixClsValue}-borderless`]: !bordered
|
|
}, !inputHasPrefixSuffix && getStatusClassNames(prefixClsValue, mergedStatus.value), hashId.value),
|
|
"affixWrapperClassName": classNames({
|
|
[`${prefixClsValue}-affix-wrapper-sm`]: mergedSize.value === "small",
|
|
[`${prefixClsValue}-affix-wrapper-lg`]: mergedSize.value === "large",
|
|
[`${prefixClsValue}-affix-wrapper-rtl`]: direction.value === "rtl",
|
|
[`${prefixClsValue}-affix-wrapper-borderless`]: !bordered
|
|
}, getStatusClassNames(`${prefixClsValue}-affix-wrapper`, mergedStatus.value, hasFeedback), hashId.value),
|
|
"wrapperClassName": classNames({
|
|
[`${prefixClsValue}-group-rtl`]: direction.value === "rtl"
|
|
}, hashId.value),
|
|
"groupClassName": classNames({
|
|
[`${prefixClsValue}-group-wrapper-sm`]: mergedSize.value === "small",
|
|
[`${prefixClsValue}-group-wrapper-lg`]: mergedSize.value === "large",
|
|
[`${prefixClsValue}-group-wrapper-rtl`]: direction.value === "rtl"
|
|
}, getStatusClassNames(`${prefixClsValue}-group-wrapper`, mergedStatus.value, hasFeedback), hashId.value)
|
|
}), _extends(_extends({}, slots), {
|
|
clearIcon
|
|
})));
|
|
};
|
|
}
|
|
});
|
|
const Group = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "AInputGroup",
|
|
inheritAttrs: false,
|
|
props: {
|
|
prefixCls: String,
|
|
size: {
|
|
type: String
|
|
},
|
|
compact: {
|
|
type: Boolean,
|
|
default: void 0
|
|
}
|
|
},
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs
|
|
} = _ref;
|
|
const {
|
|
prefixCls,
|
|
direction,
|
|
getPrefixCls
|
|
} = useConfigInject("input-group", props);
|
|
const formItemInputContext = FormItemInputContext.useInject();
|
|
FormItemInputContext.useProvide(formItemInputContext, {
|
|
isFormItemInput: false
|
|
});
|
|
const inputPrefixCls = computed(() => getPrefixCls("input"));
|
|
const [wrapSSR, hashId] = useStyle(inputPrefixCls);
|
|
const cls = computed(() => {
|
|
const pre = prefixCls.value;
|
|
return {
|
|
[`${pre}`]: true,
|
|
[hashId.value]: true,
|
|
[`${pre}-lg`]: props.size === "large",
|
|
[`${pre}-sm`]: props.size === "small",
|
|
[`${pre}-compact`]: props.compact,
|
|
[`${pre}-rtl`]: direction.value === "rtl"
|
|
};
|
|
});
|
|
return () => {
|
|
var _a;
|
|
return wrapSSR(createVNode("span", _objectSpread$2(_objectSpread$2({}, attrs), {}, {
|
|
"class": classNames(cls.value, attrs.class)
|
|
}), [(_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)]));
|
|
};
|
|
}
|
|
});
|
|
var __rest$1 = function(s, e) {
|
|
var t = {};
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
}
|
|
return t;
|
|
};
|
|
const Search = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "AInputSearch",
|
|
inheritAttrs: false,
|
|
props: _extends(_extends({}, inputProps()), {
|
|
inputPrefixCls: String,
|
|
// 不能设置默认值 https://github.com/vueComponent/ant-design-vue/issues/1916
|
|
enterButton: PropTypes.any,
|
|
onSearch: {
|
|
type: Function
|
|
}
|
|
}),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs,
|
|
expose,
|
|
emit
|
|
} = _ref;
|
|
const inputRef = shallowRef();
|
|
const composedRef = shallowRef(false);
|
|
const focus = () => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.focus();
|
|
};
|
|
const blur = () => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.blur();
|
|
};
|
|
expose({
|
|
focus,
|
|
blur
|
|
});
|
|
const onChange = (e) => {
|
|
emit("update:value", e.target.value);
|
|
if (e && e.target && e.type === "click") {
|
|
emit("search", e.target.value, e);
|
|
}
|
|
emit("change", e);
|
|
};
|
|
const onMousedown = (e) => {
|
|
var _a;
|
|
if ((void 0).activeElement === ((_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input)) {
|
|
e.preventDefault();
|
|
}
|
|
};
|
|
const onSearch = (e) => {
|
|
var _a, _b;
|
|
emit("search", (_b = (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.stateValue, e);
|
|
};
|
|
const onPressEnter = (e) => {
|
|
if (composedRef.value || props.loading) {
|
|
return;
|
|
}
|
|
onSearch(e);
|
|
};
|
|
const handleOnCompositionStart = (e) => {
|
|
composedRef.value = true;
|
|
emit("compositionstart", e);
|
|
};
|
|
const handleOnCompositionEnd = (e) => {
|
|
composedRef.value = false;
|
|
emit("compositionend", e);
|
|
};
|
|
const {
|
|
prefixCls,
|
|
getPrefixCls,
|
|
direction,
|
|
size
|
|
} = useConfigInject("input-search", props);
|
|
const inputPrefixCls = computed(() => getPrefixCls("input", props.inputPrefixCls));
|
|
return () => {
|
|
var _a, _b, _c, _d;
|
|
const {
|
|
disabled,
|
|
loading,
|
|
addonAfter = (_a = slots.addonAfter) === null || _a === void 0 ? void 0 : _a.call(slots),
|
|
suffix = (_b = slots.suffix) === null || _b === void 0 ? void 0 : _b.call(slots)
|
|
} = props, restProps = __rest$1(props, ["disabled", "loading", "addonAfter", "suffix"]);
|
|
let {
|
|
enterButton = (_d = (_c = slots.enterButton) === null || _c === void 0 ? void 0 : _c.call(slots)) !== null && _d !== void 0 ? _d : false
|
|
} = props;
|
|
enterButton = enterButton || enterButton === "";
|
|
const searchIcon = typeof enterButton === "boolean" ? createVNode(SearchOutlined, null, null) : null;
|
|
const btnClassName = `${prefixCls.value}-button`;
|
|
const enterButtonAsElement = Array.isArray(enterButton) ? enterButton[0] : enterButton;
|
|
let button;
|
|
const isAntdButton = enterButtonAsElement.type && isPlainObject(enterButtonAsElement.type) && enterButtonAsElement.type.__ANT_BUTTON;
|
|
if (isAntdButton || enterButtonAsElement.tagName === "button") {
|
|
button = cloneElement(enterButtonAsElement, _extends({
|
|
onMousedown,
|
|
onClick: onSearch,
|
|
key: "enterButton"
|
|
}, isAntdButton ? {
|
|
class: btnClassName,
|
|
size: size.value
|
|
} : {}), false);
|
|
} else {
|
|
const iconOnly = searchIcon && !enterButton;
|
|
button = createVNode(Button, {
|
|
"class": btnClassName,
|
|
"type": enterButton ? "primary" : void 0,
|
|
"size": size.value,
|
|
"disabled": disabled,
|
|
"key": "enterButton",
|
|
"onMousedown": onMousedown,
|
|
"onClick": onSearch,
|
|
"loading": loading,
|
|
"icon": iconOnly ? searchIcon : null
|
|
}, {
|
|
default: () => [iconOnly ? null : searchIcon || enterButton]
|
|
});
|
|
}
|
|
if (addonAfter) {
|
|
button = [button, addonAfter];
|
|
}
|
|
const cls = classNames(prefixCls.value, {
|
|
[`${prefixCls.value}-rtl`]: direction.value === "rtl",
|
|
[`${prefixCls.value}-${size.value}`]: !!size.value,
|
|
[`${prefixCls.value}-with-button`]: !!enterButton
|
|
}, attrs.class);
|
|
return createVNode(Input, _objectSpread$2(_objectSpread$2(_objectSpread$2({
|
|
"ref": inputRef
|
|
}, omit(restProps, ["onUpdate:value", "onSearch", "enterButton"])), attrs), {}, {
|
|
"onPressEnter": onPressEnter,
|
|
"onCompositionstart": handleOnCompositionStart,
|
|
"onCompositionend": handleOnCompositionEnd,
|
|
"size": size.value,
|
|
"prefixCls": inputPrefixCls.value,
|
|
"addonAfter": button,
|
|
"suffix": suffix,
|
|
"onChange": onChange,
|
|
"class": cls,
|
|
"disabled": disabled
|
|
}), slots);
|
|
};
|
|
}
|
|
});
|
|
const isValid = (value) => {
|
|
return value !== void 0 && value !== null && (Array.isArray(value) ? filterEmpty(value).length : true);
|
|
};
|
|
function hasAddon(propsAndSlots) {
|
|
return isValid(propsAndSlots.addonBefore) || isValid(propsAndSlots.addonAfter);
|
|
}
|
|
const ClearableInputType = ["text", "input"];
|
|
const ClearableLabeledInput = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ClearableLabeledInput",
|
|
inheritAttrs: false,
|
|
props: {
|
|
prefixCls: String,
|
|
inputType: PropTypes.oneOf(tuple("text", "input")),
|
|
value: anyType(),
|
|
defaultValue: anyType(),
|
|
allowClear: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
element: anyType(),
|
|
handleReset: Function,
|
|
disabled: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
direction: {
|
|
type: String
|
|
},
|
|
size: {
|
|
type: String
|
|
},
|
|
suffix: anyType(),
|
|
prefix: anyType(),
|
|
addonBefore: anyType(),
|
|
addonAfter: anyType(),
|
|
readonly: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
focused: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
bordered: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
triggerFocus: {
|
|
type: Function
|
|
},
|
|
hidden: Boolean,
|
|
status: String,
|
|
hashId: String
|
|
},
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs
|
|
} = _ref;
|
|
const statusContext = FormItemInputContext.useInject();
|
|
const renderClearIcon = (prefixCls) => {
|
|
const {
|
|
value,
|
|
disabled,
|
|
readonly,
|
|
handleReset,
|
|
suffix = slots.suffix
|
|
} = props;
|
|
const needClear = !disabled && !readonly && value;
|
|
const className = `${prefixCls}-clear-icon`;
|
|
return createVNode(CloseCircleFilled, {
|
|
"onClick": handleReset,
|
|
"onMousedown": (e) => e.preventDefault(),
|
|
"class": classNames({
|
|
[`${className}-hidden`]: !needClear,
|
|
[`${className}-has-suffix`]: !!suffix
|
|
}, className),
|
|
"role": "button"
|
|
}, null);
|
|
};
|
|
const renderTextAreaWithClearIcon = (prefixCls, element) => {
|
|
const {
|
|
value,
|
|
allowClear,
|
|
direction,
|
|
bordered,
|
|
hidden,
|
|
status: customStatus,
|
|
addonAfter = slots.addonAfter,
|
|
addonBefore = slots.addonBefore,
|
|
hashId
|
|
} = props;
|
|
const {
|
|
status: contextStatus,
|
|
hasFeedback
|
|
} = statusContext;
|
|
if (!allowClear) {
|
|
return cloneElement(element, {
|
|
value,
|
|
disabled: props.disabled
|
|
});
|
|
}
|
|
const affixWrapperCls = classNames(`${prefixCls}-affix-wrapper`, `${prefixCls}-affix-wrapper-textarea-with-clear-btn`, getStatusClassNames(`${prefixCls}-affix-wrapper`, getMergedStatus(contextStatus, customStatus), hasFeedback), {
|
|
[`${prefixCls}-affix-wrapper-rtl`]: direction === "rtl",
|
|
[`${prefixCls}-affix-wrapper-borderless`]: !bordered,
|
|
// className will go to addon wrapper
|
|
[`${attrs.class}`]: !hasAddon({
|
|
addonAfter,
|
|
addonBefore
|
|
}) && attrs.class
|
|
}, hashId);
|
|
return createVNode("span", {
|
|
"class": affixWrapperCls,
|
|
"style": attrs.style,
|
|
"hidden": hidden
|
|
}, [cloneElement(element, {
|
|
style: null,
|
|
value,
|
|
disabled: props.disabled
|
|
}), renderClearIcon(prefixCls)]);
|
|
};
|
|
return () => {
|
|
var _a;
|
|
const {
|
|
prefixCls,
|
|
inputType,
|
|
element = (_a = slots.element) === null || _a === void 0 ? void 0 : _a.call(slots)
|
|
} = props;
|
|
if (inputType === ClearableInputType[0]) {
|
|
return renderTextAreaWithClearIcon(prefixCls, element);
|
|
}
|
|
return null;
|
|
};
|
|
}
|
|
});
|
|
const HIDDEN_TEXTAREA_STYLE = `
|
|
min-height:0 !important;
|
|
max-height:none !important;
|
|
height:0 !important;
|
|
visibility:hidden !important;
|
|
overflow:hidden !important;
|
|
position:absolute !important;
|
|
z-index:-1000 !important;
|
|
top:0 !important;
|
|
right:0 !important;
|
|
pointer-events: none !important;
|
|
`;
|
|
const SIZING_STYLE = ["letter-spacing", "line-height", "padding-top", "padding-bottom", "font-family", "font-weight", "font-size", "font-variant", "text-rendering", "text-transform", "width", "text-indent", "padding-left", "padding-right", "border-width", "box-sizing", "word-break", "white-space"];
|
|
const computedStyleCache = {};
|
|
let hiddenTextarea;
|
|
function calculateNodeStyling(node) {
|
|
let useCache = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
|
|
const nodeRef = node.getAttribute("id") || node.getAttribute("data-reactid") || node.getAttribute("name");
|
|
if (useCache && computedStyleCache[nodeRef]) {
|
|
return computedStyleCache[nodeRef];
|
|
}
|
|
const style = (void 0).getComputedStyle(node);
|
|
const boxSizing = style.getPropertyValue("box-sizing") || style.getPropertyValue("-moz-box-sizing") || style.getPropertyValue("-webkit-box-sizing");
|
|
const paddingSize = parseFloat(style.getPropertyValue("padding-bottom")) + parseFloat(style.getPropertyValue("padding-top"));
|
|
const borderSize = parseFloat(style.getPropertyValue("border-bottom-width")) + parseFloat(style.getPropertyValue("border-top-width"));
|
|
const sizingStyle = SIZING_STYLE.map((name) => `${name}:${style.getPropertyValue(name)}`).join(";");
|
|
const nodeInfo = {
|
|
sizingStyle,
|
|
paddingSize,
|
|
borderSize,
|
|
boxSizing
|
|
};
|
|
if (useCache && nodeRef) {
|
|
computedStyleCache[nodeRef] = nodeInfo;
|
|
}
|
|
return nodeInfo;
|
|
}
|
|
function calculateAutoSizeStyle(uiTextNode) {
|
|
let useCache = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
|
|
let minRows = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : null;
|
|
let maxRows = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : null;
|
|
if (!hiddenTextarea) {
|
|
hiddenTextarea = (void 0).createElement("textarea");
|
|
hiddenTextarea.setAttribute("tab-index", "-1");
|
|
hiddenTextarea.setAttribute("aria-hidden", "true");
|
|
(void 0).body.appendChild(hiddenTextarea);
|
|
}
|
|
if (uiTextNode.getAttribute("wrap")) {
|
|
hiddenTextarea.setAttribute("wrap", uiTextNode.getAttribute("wrap"));
|
|
} else {
|
|
hiddenTextarea.removeAttribute("wrap");
|
|
}
|
|
const {
|
|
paddingSize,
|
|
borderSize,
|
|
boxSizing,
|
|
sizingStyle
|
|
} = calculateNodeStyling(uiTextNode, useCache);
|
|
hiddenTextarea.setAttribute("style", `${sizingStyle};${HIDDEN_TEXTAREA_STYLE}`);
|
|
hiddenTextarea.value = uiTextNode.value || uiTextNode.placeholder || "";
|
|
let minHeight = void 0;
|
|
let maxHeight = void 0;
|
|
let overflowY;
|
|
let height = hiddenTextarea.scrollHeight;
|
|
if (boxSizing === "border-box") {
|
|
height += borderSize;
|
|
} else if (boxSizing === "content-box") {
|
|
height -= paddingSize;
|
|
}
|
|
if (minRows !== null || maxRows !== null) {
|
|
hiddenTextarea.value = " ";
|
|
const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
|
|
if (minRows !== null) {
|
|
minHeight = singleRowHeight * minRows;
|
|
if (boxSizing === "border-box") {
|
|
minHeight = minHeight + paddingSize + borderSize;
|
|
}
|
|
height = Math.max(minHeight, height);
|
|
}
|
|
if (maxRows !== null) {
|
|
maxHeight = singleRowHeight * maxRows;
|
|
if (boxSizing === "border-box") {
|
|
maxHeight = maxHeight + paddingSize + borderSize;
|
|
}
|
|
overflowY = height > maxHeight ? "" : "hidden";
|
|
height = Math.min(maxHeight, height);
|
|
}
|
|
}
|
|
const style = {
|
|
height: `${height}px`,
|
|
overflowY,
|
|
resize: "none"
|
|
};
|
|
if (minHeight) {
|
|
style.minHeight = `${minHeight}px`;
|
|
}
|
|
if (maxHeight) {
|
|
style.maxHeight = `${maxHeight}px`;
|
|
}
|
|
return style;
|
|
}
|
|
const RESIZE_START = 0;
|
|
const RESIZE_MEASURING = 1;
|
|
const RESIZE_STABLE = 2;
|
|
const ResizableTextArea = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ResizableTextArea",
|
|
inheritAttrs: false,
|
|
props: textAreaProps(),
|
|
setup(props, _ref) {
|
|
let {
|
|
attrs,
|
|
emit,
|
|
expose
|
|
} = _ref;
|
|
const textAreaRef = ref();
|
|
const textareaStyles = ref({});
|
|
const resizeStatus = ref(RESIZE_STABLE);
|
|
const fixFirefoxAutoScroll = () => {
|
|
try {
|
|
if (textAreaRef.value && (void 0).activeElement === textAreaRef.value.input) {
|
|
const currentStart = textAreaRef.value.getSelectionStart();
|
|
const currentEnd = textAreaRef.value.getSelectionEnd();
|
|
const scrollTop = textAreaRef.value.getScrollTop();
|
|
textAreaRef.value.setSelectionRange(currentStart, currentEnd);
|
|
textAreaRef.value.setScrollTop(scrollTop);
|
|
}
|
|
} catch (e) {
|
|
}
|
|
};
|
|
const minRows = ref();
|
|
const maxRows = ref();
|
|
watchEffect(() => {
|
|
const autoSize = props.autoSize || props.autosize;
|
|
if (autoSize) {
|
|
minRows.value = autoSize.minRows;
|
|
maxRows.value = autoSize.maxRows;
|
|
} else {
|
|
minRows.value = void 0;
|
|
maxRows.value = void 0;
|
|
}
|
|
});
|
|
const needAutoSize = computed(() => !!(props.autoSize || props.autosize));
|
|
const startResize = () => {
|
|
resizeStatus.value = RESIZE_START;
|
|
};
|
|
watch([() => props.value, minRows, maxRows, needAutoSize], () => {
|
|
if (needAutoSize.value) {
|
|
startResize();
|
|
}
|
|
}, {
|
|
immediate: true
|
|
});
|
|
const autoSizeStyle = ref();
|
|
watch([resizeStatus, textAreaRef], () => {
|
|
if (!textAreaRef.value) return;
|
|
if (resizeStatus.value === RESIZE_START) {
|
|
resizeStatus.value = RESIZE_MEASURING;
|
|
} else if (resizeStatus.value === RESIZE_MEASURING) {
|
|
const textareaStyles2 = calculateAutoSizeStyle(textAreaRef.value.input, false, minRows.value, maxRows.value);
|
|
resizeStatus.value = RESIZE_STABLE;
|
|
autoSizeStyle.value = textareaStyles2;
|
|
} else {
|
|
fixFirefoxAutoScroll();
|
|
}
|
|
}, {
|
|
immediate: true,
|
|
flush: "post"
|
|
});
|
|
const instance = getCurrentInstance();
|
|
const resizeRafRef = ref();
|
|
const cleanRaf = () => {
|
|
wrapperRaf.cancel(resizeRafRef.value);
|
|
};
|
|
const onInternalResize = (size) => {
|
|
if (resizeStatus.value === RESIZE_STABLE) {
|
|
emit("resize", size);
|
|
if (needAutoSize.value) {
|
|
cleanRaf();
|
|
resizeRafRef.value = wrapperRaf(() => {
|
|
startResize();
|
|
});
|
|
}
|
|
}
|
|
};
|
|
const resizeTextarea = () => {
|
|
startResize();
|
|
};
|
|
expose({
|
|
resizeTextarea,
|
|
textArea: computed(() => {
|
|
var _a;
|
|
return (_a = textAreaRef.value) === null || _a === void 0 ? void 0 : _a.input;
|
|
}),
|
|
instance
|
|
});
|
|
warning(props.autosize === void 0);
|
|
const renderTextArea = () => {
|
|
const {
|
|
prefixCls,
|
|
disabled
|
|
} = props;
|
|
const otherProps = omit(props, ["prefixCls", "onPressEnter", "autoSize", "autosize", "defaultValue", "allowClear", "type", "maxlength", "valueModifiers"]);
|
|
const cls = classNames(prefixCls, attrs.class, {
|
|
[`${prefixCls}-disabled`]: disabled
|
|
});
|
|
const mergedAutoSizeStyle = needAutoSize.value ? autoSizeStyle.value : null;
|
|
const style = [attrs.style, textareaStyles.value, mergedAutoSizeStyle];
|
|
const textareaProps = _extends(_extends(_extends({}, otherProps), attrs), {
|
|
style,
|
|
class: cls
|
|
});
|
|
if (resizeStatus.value === RESIZE_START || resizeStatus.value === RESIZE_MEASURING) {
|
|
style.push({
|
|
overflowX: "hidden",
|
|
overflowY: "hidden"
|
|
});
|
|
}
|
|
if (!textareaProps.autofocus) {
|
|
delete textareaProps.autofocus;
|
|
}
|
|
if (textareaProps.rows === 0) {
|
|
delete textareaProps.rows;
|
|
}
|
|
return createVNode(ResizeObserver, {
|
|
"onResize": onInternalResize,
|
|
"disabled": !needAutoSize.value
|
|
}, {
|
|
default: () => [createVNode(BaseInput$1, _objectSpread$2(_objectSpread$2({}, textareaProps), {}, {
|
|
"ref": textAreaRef,
|
|
"tag": "textarea"
|
|
}), null)]
|
|
});
|
|
};
|
|
return () => {
|
|
return renderTextArea();
|
|
};
|
|
}
|
|
});
|
|
function fixEmojiLength(value, maxLength) {
|
|
return [...value || ""].slice(0, maxLength).join("");
|
|
}
|
|
function setTriggerValue(isCursorInEnd, preValue, triggerValue, maxLength) {
|
|
let newTriggerValue = triggerValue;
|
|
if (isCursorInEnd) {
|
|
newTriggerValue = fixEmojiLength(triggerValue, maxLength);
|
|
} else if ([...preValue || ""].length < triggerValue.length && [...triggerValue || ""].length > maxLength) {
|
|
newTriggerValue = preValue;
|
|
}
|
|
return newTriggerValue;
|
|
}
|
|
const __nuxt_component_0$1 = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ATextarea",
|
|
inheritAttrs: false,
|
|
props: textAreaProps(),
|
|
setup(props, _ref) {
|
|
let {
|
|
attrs,
|
|
expose,
|
|
emit
|
|
} = _ref;
|
|
var _a;
|
|
const formItemContext = useInjectFormItemContext();
|
|
const formItemInputContext = FormItemInputContext.useInject();
|
|
const mergedStatus = computed(() => getMergedStatus(formItemInputContext.status, props.status));
|
|
const stateValue = shallowRef((_a = props.value) !== null && _a !== void 0 ? _a : props.defaultValue);
|
|
const resizableTextArea = shallowRef();
|
|
const mergedValue = shallowRef("");
|
|
const {
|
|
prefixCls,
|
|
size,
|
|
direction
|
|
} = useConfigInject("input", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const disabled = useInjectDisabled();
|
|
const showCount = computed(() => {
|
|
return props.showCount === "" || props.showCount || false;
|
|
});
|
|
const hasMaxLength = computed(() => Number(props.maxlength) > 0);
|
|
const compositing = shallowRef(false);
|
|
const oldCompositionValueRef = shallowRef();
|
|
const oldSelectionStartRef = shallowRef(0);
|
|
const onInternalCompositionStart = (e) => {
|
|
compositing.value = true;
|
|
oldCompositionValueRef.value = mergedValue.value;
|
|
oldSelectionStartRef.value = e.currentTarget.selectionStart;
|
|
emit("compositionstart", e);
|
|
};
|
|
const onInternalCompositionEnd = (e) => {
|
|
var _a2;
|
|
compositing.value = false;
|
|
let triggerValue = e.currentTarget.value;
|
|
if (hasMaxLength.value) {
|
|
const isCursorInEnd = oldSelectionStartRef.value >= props.maxlength + 1 || oldSelectionStartRef.value === ((_a2 = oldCompositionValueRef.value) === null || _a2 === void 0 ? void 0 : _a2.length);
|
|
triggerValue = setTriggerValue(isCursorInEnd, oldCompositionValueRef.value, triggerValue, props.maxlength);
|
|
}
|
|
if (triggerValue !== mergedValue.value) {
|
|
setValue(triggerValue);
|
|
resolveOnChange(e.currentTarget, e, triggerChange, triggerValue);
|
|
}
|
|
emit("compositionend", e);
|
|
};
|
|
const instance = getCurrentInstance();
|
|
watch(() => props.value, () => {
|
|
var _a2;
|
|
if ("value" in instance.vnode.props || {}) {
|
|
stateValue.value = (_a2 = props.value) !== null && _a2 !== void 0 ? _a2 : "";
|
|
}
|
|
});
|
|
const focus = (option) => {
|
|
var _a2;
|
|
triggerFocus((_a2 = resizableTextArea.value) === null || _a2 === void 0 ? void 0 : _a2.textArea, option);
|
|
};
|
|
const blur = () => {
|
|
var _a2, _b;
|
|
(_b = (_a2 = resizableTextArea.value) === null || _a2 === void 0 ? void 0 : _a2.textArea) === null || _b === void 0 ? void 0 : _b.blur();
|
|
};
|
|
const setValue = (value, callback) => {
|
|
if (stateValue.value === value) {
|
|
return;
|
|
}
|
|
if (props.value === void 0) {
|
|
stateValue.value = value;
|
|
} else {
|
|
nextTick(() => {
|
|
var _a2, _b, _c;
|
|
if (resizableTextArea.value.textArea.value !== mergedValue.value) {
|
|
(_c = (_a2 = resizableTextArea.value) === null || _a2 === void 0 ? void 0 : (_b = _a2.instance).update) === null || _c === void 0 ? void 0 : _c.call(_b);
|
|
}
|
|
});
|
|
}
|
|
nextTick(() => {
|
|
callback && callback();
|
|
});
|
|
};
|
|
const handleKeyDown = (e) => {
|
|
if (e.keyCode === 13) {
|
|
emit("pressEnter", e);
|
|
}
|
|
emit("keydown", e);
|
|
};
|
|
const onBlur = (e) => {
|
|
const {
|
|
onBlur: onBlur2
|
|
} = props;
|
|
onBlur2 === null || onBlur2 === void 0 ? void 0 : onBlur2(e);
|
|
formItemContext.onFieldBlur();
|
|
};
|
|
const triggerChange = (e) => {
|
|
emit("update:value", e.target.value);
|
|
emit("change", e);
|
|
emit("input", e);
|
|
formItemContext.onFieldChange();
|
|
};
|
|
const handleReset = (e) => {
|
|
resolveOnChange(resizableTextArea.value.textArea, e, triggerChange);
|
|
setValue("", () => {
|
|
focus();
|
|
});
|
|
};
|
|
const handleChange = (e) => {
|
|
let triggerValue = e.target.value;
|
|
if (stateValue.value === triggerValue) return;
|
|
if (hasMaxLength.value) {
|
|
const target = e.target;
|
|
const isCursorInEnd = target.selectionStart >= props.maxlength + 1 || target.selectionStart === triggerValue.length || !target.selectionStart;
|
|
triggerValue = setTriggerValue(isCursorInEnd, mergedValue.value, triggerValue, props.maxlength);
|
|
}
|
|
resolveOnChange(e.currentTarget, e, triggerChange, triggerValue);
|
|
setValue(triggerValue);
|
|
};
|
|
const renderTextArea = () => {
|
|
var _a2, _b;
|
|
const {
|
|
class: customClass
|
|
} = attrs;
|
|
const {
|
|
bordered = true
|
|
} = props;
|
|
const resizeProps = _extends(_extends(_extends({}, omit(props, ["allowClear"])), attrs), {
|
|
class: [{
|
|
[`${prefixCls.value}-borderless`]: !bordered,
|
|
[`${customClass}`]: customClass && !showCount.value,
|
|
[`${prefixCls.value}-sm`]: size.value === "small",
|
|
[`${prefixCls.value}-lg`]: size.value === "large"
|
|
}, getStatusClassNames(prefixCls.value, mergedStatus.value), hashId.value],
|
|
disabled: disabled.value,
|
|
showCount: null,
|
|
prefixCls: prefixCls.value,
|
|
onInput: handleChange,
|
|
onChange: handleChange,
|
|
onBlur,
|
|
onKeydown: handleKeyDown,
|
|
onCompositionstart: onInternalCompositionStart,
|
|
onCompositionend: onInternalCompositionEnd
|
|
});
|
|
if ((_a2 = props.valueModifiers) === null || _a2 === void 0 ? void 0 : _a2.lazy) {
|
|
delete resizeProps.onInput;
|
|
}
|
|
return createVNode(ResizableTextArea, _objectSpread$2(_objectSpread$2({}, resizeProps), {}, {
|
|
"id": (_b = resizeProps === null || resizeProps === void 0 ? void 0 : resizeProps.id) !== null && _b !== void 0 ? _b : formItemContext.id.value,
|
|
"ref": resizableTextArea,
|
|
"maxlength": props.maxlength,
|
|
"lazy": props.lazy
|
|
}), null);
|
|
};
|
|
expose({
|
|
focus,
|
|
blur,
|
|
resizableTextArea
|
|
});
|
|
watchEffect(() => {
|
|
let val = fixControlledValue(stateValue.value);
|
|
if (!compositing.value && hasMaxLength.value && (props.value === null || props.value === void 0)) {
|
|
val = fixEmojiLength(val, props.maxlength);
|
|
}
|
|
mergedValue.value = val;
|
|
});
|
|
return () => {
|
|
var _a2;
|
|
const {
|
|
maxlength,
|
|
bordered = true,
|
|
hidden
|
|
} = props;
|
|
const {
|
|
style,
|
|
class: customClass
|
|
} = attrs;
|
|
const inputProps2 = _extends(_extends(_extends({}, props), attrs), {
|
|
prefixCls: prefixCls.value,
|
|
inputType: "text",
|
|
handleReset,
|
|
direction: direction.value,
|
|
bordered,
|
|
style: showCount.value ? void 0 : style,
|
|
hashId: hashId.value,
|
|
disabled: (_a2 = props.disabled) !== null && _a2 !== void 0 ? _a2 : disabled.value
|
|
});
|
|
let textareaNode = createVNode(ClearableLabeledInput, _objectSpread$2(_objectSpread$2({}, inputProps2), {}, {
|
|
"value": mergedValue.value,
|
|
"status": props.status
|
|
}), {
|
|
element: renderTextArea
|
|
});
|
|
if (showCount.value || formItemInputContext.hasFeedback) {
|
|
const valueLength = [...mergedValue.value].length;
|
|
let dataCount = "";
|
|
if (typeof showCount.value === "object") {
|
|
dataCount = showCount.value.formatter({
|
|
value: mergedValue.value,
|
|
count: valueLength,
|
|
maxlength
|
|
});
|
|
} else {
|
|
dataCount = `${valueLength}${hasMaxLength.value ? ` / ${maxlength}` : ""}`;
|
|
}
|
|
textareaNode = createVNode("div", {
|
|
"hidden": hidden,
|
|
"class": classNames(`${prefixCls.value}-textarea`, {
|
|
[`${prefixCls.value}-textarea-rtl`]: direction.value === "rtl",
|
|
[`${prefixCls.value}-textarea-show-count`]: showCount.value,
|
|
[`${prefixCls.value}-textarea-in-form-item`]: formItemInputContext.isFormItemInput
|
|
}, `${prefixCls.value}-textarea-show-count`, customClass, hashId.value),
|
|
"style": style,
|
|
"data-count": typeof dataCount !== "object" ? dataCount : void 0
|
|
}, [textareaNode, formItemInputContext.hasFeedback && createVNode("span", {
|
|
"class": `${prefixCls.value}-textarea-suffix`
|
|
}, [formItemInputContext.feedbackIcon])]);
|
|
}
|
|
return wrapSSR(textareaNode);
|
|
};
|
|
}
|
|
});
|
|
var __rest = function(s, e) {
|
|
var t = {};
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
}
|
|
return t;
|
|
};
|
|
const ActionMap = {
|
|
click: "onClick",
|
|
hover: "onMouseover"
|
|
};
|
|
const defaultIconRender = (visible) => visible ? createVNode(EyeOutlined, null, null) : createVNode(EyeInvisibleOutlined, null, null);
|
|
const __nuxt_component_0 = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "AInputPassword",
|
|
inheritAttrs: false,
|
|
props: _extends(_extends({}, inputProps()), {
|
|
prefixCls: String,
|
|
inputPrefixCls: String,
|
|
action: {
|
|
type: String,
|
|
default: "click"
|
|
},
|
|
visibilityToggle: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
visible: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
"onUpdate:visible": Function,
|
|
iconRender: Function
|
|
}),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs,
|
|
expose,
|
|
emit
|
|
} = _ref;
|
|
const visible = shallowRef(false);
|
|
const onVisibleChange = () => {
|
|
const {
|
|
disabled
|
|
} = props;
|
|
if (disabled) {
|
|
return;
|
|
}
|
|
visible.value = !visible.value;
|
|
emit("update:visible", visible.value);
|
|
};
|
|
watchEffect(() => {
|
|
if (props.visible !== void 0) {
|
|
visible.value = !!props.visible;
|
|
}
|
|
});
|
|
const inputRef = shallowRef();
|
|
const focus = () => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.focus();
|
|
};
|
|
const blur = () => {
|
|
var _a;
|
|
(_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.blur();
|
|
};
|
|
expose({
|
|
focus,
|
|
blur
|
|
});
|
|
const getIcon = (prefixCls2) => {
|
|
const {
|
|
action,
|
|
iconRender = slots.iconRender || defaultIconRender
|
|
} = props;
|
|
const iconTrigger = ActionMap[action] || "";
|
|
const icon = iconRender(visible.value);
|
|
const iconProps = {
|
|
[iconTrigger]: onVisibleChange,
|
|
class: `${prefixCls2}-icon`,
|
|
key: "passwordIcon",
|
|
onMousedown: (e) => {
|
|
e.preventDefault();
|
|
},
|
|
onMouseup: (e) => {
|
|
e.preventDefault();
|
|
}
|
|
};
|
|
return cloneElement(isValidElement(icon) ? icon : createVNode("span", null, [icon]), iconProps);
|
|
};
|
|
const {
|
|
prefixCls,
|
|
getPrefixCls
|
|
} = useConfigInject("input-password", props);
|
|
const inputPrefixCls = computed(() => getPrefixCls("input", props.inputPrefixCls));
|
|
const renderPassword = () => {
|
|
const {
|
|
size,
|
|
visibilityToggle
|
|
} = props, restProps = __rest(props, ["size", "visibilityToggle"]);
|
|
const suffixIcon = visibilityToggle && getIcon(prefixCls.value);
|
|
const inputClassName = classNames(prefixCls.value, attrs.class, {
|
|
[`${prefixCls.value}-${size}`]: !!size
|
|
});
|
|
const omittedProps = _extends(_extends(_extends({}, omit(restProps, ["suffix", "iconRender", "action"])), attrs), {
|
|
type: visible.value ? "text" : "password",
|
|
class: inputClassName,
|
|
prefixCls: inputPrefixCls.value,
|
|
suffix: suffixIcon
|
|
});
|
|
if (size) {
|
|
omittedProps.size = size;
|
|
}
|
|
return createVNode(Input, _objectSpread$2({
|
|
"ref": inputRef
|
|
}, omittedProps), slots);
|
|
};
|
|
return () => {
|
|
return renderPassword();
|
|
};
|
|
}
|
|
});
|
|
Input.Group = Group;
|
|
Input.Search = Search;
|
|
Input.TextArea = __nuxt_component_0$1;
|
|
Input.Password = __nuxt_component_0;
|
|
Input.install = function(app) {
|
|
app.component(Input.name, Input);
|
|
app.component(Input.Group.name, Input.Group);
|
|
app.component(Input.Search.name, Input.Search);
|
|
app.component(Input.TextArea.name, Input.TextArea);
|
|
app.component(Input.Password.name, Input.Password);
|
|
return app;
|
|
};
|
|
|
|
export { EyeOutlined as E, Input as I, __nuxt_component_0 as _, __nuxt_component_0$1 as a };
|
|
//# sourceMappingURL=index--Q-kfs0Q.mjs.map
|