tdesign-vue
Version:
402 lines (394 loc) • 17 kB
JavaScript
/**
* tdesign v1.12.1
* (c) 2025 tdesign
* @license MIT
*/
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var _typeof = require('@babel/runtime/helpers/typeof');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var VueCompositionAPI = require('@vue/composition-api');
var hooks_useConfig = require('../hooks/useConfig.js');
var hooks_useFormDisabled = require('../hooks/useFormDisabled.js');
var hooks_useVModel = require('../hooks/useVModel.js');
var hooks_useDefaultValue = require('../hooks/useDefaultValue.js');
var treeSelect_utils = require('./utils.js');
var configProvider_useConfig = require('../config-provider/useConfig.js');
var get = require('../_chunks/dep-165bd1be.js');
var set = require('../_chunks/dep-910b0661.js');
var isFunction = require('../_chunks/dep-411a10dd.js');
require('../_chunks/dep-6247fdbf.js');
require('../_common/js/global-config/default-config.js');
require('../_common/js/global-config/locale/zh_CN.js');
require('../_chunks/dep-3ed0c42e.js');
require('../_chunks/dep-53935099.js');
require('dayjs');
require('../_chunks/dep-403352a7.js');
require('../_chunks/dep-cca66fee.js');
require('../_chunks/dep-4361b357.js');
require('../_chunks/dep-887c649b.js');
require('../_chunks/dep-5ea2b00f.js');
require('../_chunks/dep-51fe98f1.js');
require('../_chunks/dep-3d682642.js');
require('../_chunks/dep-dea23841.js');
require('../_chunks/dep-d7270eaf.js');
require('../_chunks/dep-9b72cbc5.js');
require('../_chunks/dep-4aa08166.js');
require('../_chunks/dep-ddc1429e.js');
require('../_chunks/dep-65896ff9.js');
require('../_chunks/dep-b65b2f55.js');
require('../_chunks/dep-6e7b8cda.js');
require('../_chunks/dep-98f48ff2.js');
require('../_chunks/dep-80e3757f.js');
require('../_chunks/dep-08d7842c.js');
require('../_chunks/dep-1ca3138c.js');
require('../_chunks/dep-e6ed4b1f.js');
require('../_chunks/dep-c44b2462.js');
require('../_common/js/global-config/t.js');
require('../_chunks/dep-6b60413b.js');
require('../_chunks/dep-727a349e.js');
require('../_chunks/dep-4b30bfe2.js');
require('../_chunks/dep-e1cc6f64.js');
require('../_chunks/dep-7b78e8c3.js');
require('../_chunks/dep-41b8bf63.js');
require('../_chunks/dep-e1bd36c1.js');
require('../_chunks/dep-b361e9d2.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof);
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var DEFAULT_KEYS = {
label: "label",
value: "value",
children: "children"
};
function useTreeSelect(props, context) {
var classPrefix = hooks_useConfig.usePrefixClass();
var _useConfig = configProvider_useConfig.useConfig("treeSelect"),
global = _useConfig.global;
var _useFormDisabled = hooks_useFormDisabled.useFormDisabled(),
formDisabled = _useFormDisabled.formDisabled;
var treeRef = VueCompositionAPI.ref(null);
var treeKey = VueCompositionAPI.ref(0);
var _toRefs = VueCompositionAPI.toRefs(props),
value = _toRefs.value,
popupVisible = _toRefs.popupVisible,
inputValue = _toRefs.inputValue;
var _useVModel = hooks_useVModel.useVModel(value, props.defaultValue, props.onChange, "change"),
_useVModel2 = _slicedToArray__default["default"](_useVModel, 2),
treeSelectValue = _useVModel2[0],
setTreeSelectValue = _useVModel2[1];
var _useDefaultValue = hooks_useDefaultValue["default"](popupVisible, props.defaultPopupVisible, props.onPopupVisibleChange, "popupVisible", "popup-visible-change"),
_useDefaultValue2 = _slicedToArray__default["default"](_useDefaultValue, 2),
innerVisible = _useDefaultValue2[0],
setInnerVisible = _useDefaultValue2[1];
var _useDefaultValue3 = hooks_useDefaultValue["default"](inputValue, props.defaultInputValue || "", props.onInputChange, "inputValue", "input-change"),
_useDefaultValue4 = _slicedToArray__default["default"](_useDefaultValue3, 2),
innerInputValue = _useDefaultValue4[0],
setInnerInputValue = _useDefaultValue4[1];
var tDisabled = VueCompositionAPI.computed(function () {
return formDisabled.value || props.disabled;
});
var isObjectValue = VueCompositionAPI.computed(function () {
return props.valueType === "object";
});
var tKeys = VueCompositionAPI.computed(function () {
var _props$treeProps;
return _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_KEYS), (_props$treeProps = props.treeProps) === null || _props$treeProps === void 0 ? void 0 : _props$treeProps.keys), props.keys);
});
var inputPlaceholder = VueCompositionAPI.computed(function () {
var label = nodeInfo.value ? get.get(nodeInfo.value, tKeys.value.label) : void 0;
if (typeof label === "number") label = String(label);
return innerVisible.value && label || props.placeholder || global.value.placeholder;
});
var popupClass = VueCompositionAPI.computed(function () {
return ["".concat(classPrefix.value, "-select__dropdown"), "narrow-scrollbar"];
});
var dropdownInnerSize = VueCompositionAPI.computed(function () {
return {
small: "s",
medium: "m",
large: "l"
}[props.size];
});
var treeRerender = function treeRerender() {
treeKey.value += 1;
};
VueCompositionAPI.watch(function () {
return _toConsumableArray__default["default"](props.data);
}, function () {
treeRerender();
}, {
immediate: true,
flush: "post"
});
var nodeInfo = VueCompositionAPI.computed(function () {
return props.multiple ? getMultipleNodeInfo() : getSingleNodeInfo();
});
var singleActivated = VueCompositionAPI.computed(function () {
if (props.multiple || !nodeInfo.value) return [];
if (nodeInfo.value instanceof Array) return [nodeInfo.value[0] ? get.get(nodeInfo.value[0], tKeys.value.value) : void 0];
return [get.get(nodeInfo.value, tKeys.value.value)];
});
var multipleChecked = VueCompositionAPI.computed(function () {
if (!props.multiple || !nodeInfo.value) return [];
if (nodeInfo.value instanceof Array) {
return nodeInfo.value.map(function (item) {
return get.get(item, tKeys.value.value);
});
}
return [get.get(nodeInfo.value, tKeys.value.value)];
});
function getMultipleNodeInfo() {
var value2 = treeSelectValue.value;
var list = treeSelect_utils.normalizeArray(value2);
if (treeRef.value) {
return list.map(function (item) {
var _treeRef$value$getIte;
var finalValue = _typeof__default["default"](item) === "object" ? item.value : item;
var obj = {};
set.set(obj, tKeys.value.label, finalValue);
set.set(obj, tKeys.value.value, finalValue);
return ((_treeRef$value$getIte = treeRef.value.getItem(finalValue)) === null || _treeRef$value$getIte === void 0 ? void 0 : _treeRef$value$getIte.data) || obj;
});
}
var onlyValues = list.map(function (item) {
return _typeof__default["default"](item) === "object" ? get.get(item, tKeys.value.value) : item;
});
return treeSelect_utils.getNodeDataByValue(onlyValues, props.data, tKeys.value);
}
function getSingleNodeInfo() {
var value2 = treeSelectValue.value;
if (value2 === "" || value2 === void 0 || value2 === null) {
return void 0;
}
var oneValue = Array.isArray(value2) ? value2[0] : value2;
var finalValue = _typeof__default["default"](oneValue) === "object" ? oneValue.value : oneValue;
if (treeRef.value) {
var _treeRef$value$getIte2;
var obj = {};
set.set(obj, tKeys.value.label, finalValue);
set.set(obj, tKeys.value.value, finalValue);
return ((_treeRef$value$getIte2 = treeRef.value.getItem(finalValue)) === null || _treeRef$value$getIte2 === void 0 ? void 0 : _treeRef$value$getIte2.data) || obj;
}
return treeSelect_utils.getNodeDataByValue([finalValue], props.data, tKeys.value)[0];
}
var clear = function clear(_ref) {
var _props$onClear;
var e = _ref.e;
var defaultValue = props.multiple ? [] : void 0;
setTreeSelectValue(defaultValue, {
e: e,
node: null,
data: null,
trigger: "clear"
});
(_props$onClear = props.onClear) === null || _props$onClear === void 0 || _props$onClear.call(props, {
e: e
});
context.emit("clear", {
e: e
});
setInnerVisible(false, {
e: e,
trigger: "clear"
});
};
var treeNodeChange = function treeNodeChange(value2, ctx) {
if (!props.multiple) return;
var current = value2;
if (isObjectValue.value) {
current = value2.map(function (nodeValue) {
return treeRef.value.getItem(nodeValue);
});
}
var tmpValue = Array.isArray(treeSelectValue.value) ? treeSelectValue.value : [treeSelectValue.value];
setTreeSelectValue(current, _objectSpread(_objectSpread({}, ctx), {}, {
data: ctx.node.data,
trigger: value2.length > tmpValue.length ? "check" : "uncheck"
}));
innerInputValue.value && setInnerInputValue("", {
trigger: "change",
e: ctx.e
});
};
var treeNodeActive = function treeNodeActive(value2, ctx) {
var _props$treeProps2, _ctx$node, _ctx$node2;
if (props.multiple) return;
if (treeSelectValue.value === get.get(ctx.node.data, tKeys.value.value)) {
return;
}
var onlyLeafNode = Boolean(!props.multiple && ((_props$treeProps2 = props.treeProps) === null || _props$treeProps2 === void 0 ? void 0 : _props$treeProps2.valueMode) === "onlyLeaf" && Array.isArray((_ctx$node = ctx.node) === null || _ctx$node === void 0 || (_ctx$node = _ctx$node.data) === null || _ctx$node === void 0 ? void 0 : _ctx$node.children) && ((_ctx$node2 = ctx.node) === null || _ctx$node2 === void 0 || (_ctx$node2 = _ctx$node2.data) === null || _ctx$node2 === void 0 || (_ctx$node2 = _ctx$node2.children) === null || _ctx$node2 === void 0 ? void 0 : _ctx$node2.length));
var current = value2;
var nodeValue = Array.isArray(value2) ? value2[0] : value2;
current = isObjectValue.value ? treeRef.value.getItem(nodeValue) : nodeValue;
if (!onlyLeafNode) {
setTreeSelectValue(current, _objectSpread(_objectSpread({}, ctx), {}, {
data: ctx.node.data,
trigger: "check"
}));
setInnerVisible(false, {
e: ctx.e,
trigger: "trigger-element-click"
});
}
innerInputValue.value && setInnerInputValue("", {
trigger: "change",
e: ctx.e
});
};
var defaultFilterFunction = function defaultFilterFunction(node) {
var label = get.get(node.data, tKeys.value.label);
var searchLabel = isFunction.isFunction(label) ? node.data.text : label || node.data.text;
return (searchLabel === null || searchLabel === void 0 ? void 0 : searchLabel.indexOf(innerInputValue.value)) >= 0;
};
var filterByText = VueCompositionAPI.computed(function () {
if (props.onSearch || context.listeners.search) return;
if ((props.filter || props.filterable) && innerInputValue.value && !context.listeners.search) {
return props.filter ? function (node) {
return props.filter(innerInputValue.value, node);
} : function (node) {
return defaultFilterFunction(node);
};
}
return void 0;
});
var inputChange = function inputChange() {
var value2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
var ctx = arguments.length > 1 ? arguments[1] : undefined;
if (value2 === innerInputValue.value) return;
setInnerInputValue(value2, ctx);
if (context.listeners.search || props.onSearch) {
var _props$onSearch;
(_props$onSearch = props.onSearch) === null || _props$onSearch === void 0 || _props$onSearch.call(props, value2, {
e: ctx.e
});
context.emit("search", value2);
}
};
var onInnerPopupVisibleChange = function onInnerPopupVisibleChange(state, ctx) {
setInnerVisible(state, ctx);
if (state) {
treeRerender();
}
if (!state && innerInputValue.value) {
setInnerInputValue("", {
trigger: "blur",
e: ctx.e
});
}
};
var tagChange = function tagChange(_, ctx) {
var _treeRef$value;
var trigger = ctx.trigger,
index = ctx.index;
var fitTrigger = trigger === "tag-remove" || trigger === "backspace";
if (!fitTrigger) return;
var current = treeSelectValue.value[index];
var currentDeleteValue = _typeof__default["default"](current) === "object" ? get.get(current, tKeys.value.value) : current;
var currentNode = (_treeRef$value = treeRef.value) === null || _treeRef$value === void 0 ? void 0 : _treeRef$value.getItem(currentDeleteValue);
var data = currentNode ? currentNode.data : treeSelect_utils.getNodeDataByValue([currentDeleteValue], props.data, tKeys.value)[0];
if (fitTrigger) {
var _props$onRemove;
var removeParams = {
value: currentDeleteValue,
data: data,
node: currentNode,
trigger: fitTrigger ? trigger : void 0,
index: index,
e: ctx.e
};
(_props$onRemove = props.onRemove) === null || _props$onRemove === void 0 || _props$onRemove.call(props, removeParams);
context.emit("remove", removeParams);
}
if (Array.isArray(treeSelectValue.value)) {
var newValue = _toConsumableArray__default["default"](treeSelectValue.value);
newValue.splice(index, 1);
setTreeSelectValue(newValue, {
node: currentNode,
data: data,
index: index,
e: ctx.e,
trigger: fitTrigger ? trigger : void 0
});
}
innerInputValue.value && setInnerInputValue("", {
trigger: "change",
e: ctx.e
});
};
var onInnerFocus = function onInnerFocus(_, ctx) {
var _props$onFocus;
(_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, {
value: treeSelectValue.value,
e: ctx.e
});
context.emit("focus", {
value: treeSelectValue.value,
e: ctx.e
});
};
var onInnerBlur = function onInnerBlur(_, ctx) {
var _props$onBlur;
(_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, _objectSpread({
value: treeSelectValue.value
}, ctx));
context.emit("blur", _objectSpread({
value: treeSelectValue.value
}, ctx));
};
var onInnerEnter = function onInnerEnter(_, ctx) {
var _props$onEnter, _props$onSearch2;
var enterParams = {
value: treeSelectValue.value,
inputValue: ctx.inputValue,
e: ctx.e
};
(_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(props, enterParams);
context.emit("enter", enterParams);
(_props$onSearch2 = props.onSearch) === null || _props$onSearch2 === void 0 || _props$onSearch2.call(props, ctx.inputValue, {
e: ctx.e
});
context.emit("search", ctx.inputValue, {
e: ctx.e
});
};
return {
classPrefix: classPrefix,
global: global,
tDisabled: tDisabled,
treeRef: treeRef,
tKeys: tKeys,
treeKey: treeKey,
popupClass: popupClass,
isObjectValue: isObjectValue,
dropdownInnerSize: dropdownInnerSize,
inputPlaceholder: inputPlaceholder,
innerVisible: innerVisible,
nodeInfo: nodeInfo,
treeSelectValue: treeSelectValue,
innerInputValue: innerInputValue,
multipleChecked: multipleChecked,
singleActivated: singleActivated,
clear: clear,
filterByText: filterByText,
setInnerVisible: setInnerVisible,
setTreeSelectValue: setTreeSelectValue,
setInnerInputValue: setInnerInputValue,
treeNodeChange: treeNodeChange,
treeNodeActive: treeNodeActive,
inputChange: inputChange,
tagChange: tagChange,
onInnerPopupVisibleChange: onInnerPopupVisibleChange,
onInnerFocus: onInnerFocus,
onInnerBlur: onInnerBlur,
onInnerEnter: onInnerEnter
};
}
exports["default"] = useTreeSelect;
//# sourceMappingURL=useTreeSelect.js.map