bkui-vue 0.0.1-beta.20 → 0.0.1-beta.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/README.md +7 -3
  2. package/README_EN.md +7 -3
  3. package/dist/bkui-vue.cjs.js +230 -208
  4. package/dist/bkui-vue.esm.js +230 -208
  5. package/dist/bkui-vue.umd.js +230 -208
  6. package/dist/style.css +127 -85
  7. package/lib/button/button.css +9 -0
  8. package/lib/button/button.d.ts +25 -1
  9. package/lib/button/button.less +18 -10
  10. package/lib/button/button.variable.css +9 -0
  11. package/lib/button/index.d.ts +42 -4
  12. package/lib/button/index.js +1 -1
  13. package/lib/code-diff/code-diff.css +114 -0
  14. package/lib/code-diff/code-diff.d.ts +71 -0
  15. package/lib/code-diff/code-diff.less +144 -0
  16. package/lib/code-diff/code-diff.variable.css +207 -0
  17. package/lib/code-diff/index.d.ts +6 -0
  18. package/lib/date-picker/date-picker.d.ts +20 -130
  19. package/lib/date-picker/index.js +1 -1
  20. package/lib/date-picker/interface.d.ts +1 -1
  21. package/lib/date-picker/props.d.ts +111 -0
  22. package/lib/directives/clickoutside.d.ts +3 -23
  23. package/lib/directives/index.js +2 -2
  24. package/lib/input/index.d.ts +58 -4
  25. package/lib/input/index.js +2 -2
  26. package/lib/input/input.css +19 -2
  27. package/lib/input/input.d.ts +31 -1
  28. package/lib/input/input.less +25 -3
  29. package/lib/input/input.variable.css +19 -2
  30. package/lib/loading/index.d.ts +31 -9
  31. package/lib/loading/index.js +1 -1
  32. package/lib/loading/loading.css +98 -71
  33. package/lib/loading/loading.d.ts +23 -8
  34. package/lib/loading/loading.less +62 -49
  35. package/lib/loading/loading.variable.css +98 -71
  36. package/lib/shared/index.js +1 -1
  37. package/lib/shared/vue-types.d.ts +4 -0
  38. package/lib/tree/index.d.ts +17 -24
  39. package/lib/tree/index.js +1 -1
  40. package/lib/tree/props.d.ts +9 -8
  41. package/lib/tree/tree.css +1 -12
  42. package/lib/tree/tree.d.ts +8 -11
  43. package/lib/tree/tree.less +10 -24
  44. package/lib/tree/tree.variable.css +1 -12
  45. package/lib/tree/util.d.ts +9 -1
  46. package/package.json +1 -1
@@ -185,7 +185,7 @@ function getWindow(node) {
185
185
  }
186
186
  return node;
187
187
  }
188
- function isElement$1(node) {
188
+ function isElement$2(node) {
189
189
  var OwnElement = getWindow(node).Element;
190
190
  return node instanceof OwnElement || node instanceof Element;
191
191
  }
@@ -339,7 +339,7 @@ function isTableElement(element) {
339
339
  return ["table", "td", "th"].indexOf(getNodeName(element)) >= 0;
340
340
  }
341
341
  function getDocumentElement(element) {
342
- return ((isElement$1(element) ? element.ownerDocument : element.document) || window.document).documentElement;
342
+ return ((isElement$2(element) ? element.ownerDocument : element.document) || window.document).documentElement;
343
343
  }
344
344
  function getParentNode(element) {
345
345
  if (getNodeName(element) === "html") {
@@ -747,17 +747,17 @@ function getInnerBoundingClientRect(element) {
747
747
  return rect;
748
748
  }
749
749
  function getClientRectFromMixedType(element, clippingParent) {
750
- return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement$1(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
750
+ return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement$2(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
751
751
  }
752
752
  function getClippingParents(element) {
753
753
  var clippingParents2 = listScrollParents(getParentNode(element));
754
754
  var canEscapeClipping = ["absolute", "fixed"].indexOf(getComputedStyle(element).position) >= 0;
755
755
  var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
756
- if (!isElement$1(clipperElement)) {
756
+ if (!isElement$2(clipperElement)) {
757
757
  return [];
758
758
  }
759
759
  return clippingParents2.filter(function(clippingParent) {
760
- return isElement$1(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== "body";
760
+ return isElement$2(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== "body";
761
761
  });
762
762
  }
763
763
  function getClippingRect(element, boundary, rootBoundary) {
@@ -839,7 +839,7 @@ function detectOverflow(state, options) {
839
839
  var altContext = elementContext === popper$1 ? reference : popper$1;
840
840
  var popperRect = state.rects.popper;
841
841
  var element = state.elements[altBoundary ? altContext : elementContext];
842
- var clippingClientRect = getClippingRect(isElement$1(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
842
+ var clippingClientRect = getClippingRect(isElement$2(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
843
843
  var referenceClientRect = getBoundingClientRect(state.elements.reference);
844
844
  var popperOffsets2 = computeOffsets({
845
845
  reference: referenceClientRect,
@@ -1356,7 +1356,7 @@ function popperGenerator(generatorOptions) {
1356
1356
  cleanupModifierEffects();
1357
1357
  state.options = Object.assign({}, defaultOptions, state.options, options2);
1358
1358
  state.scrollParents = {
1359
- reference: isElement$1(reference2) ? listScrollParents(reference2) : reference2.contextElement ? listScrollParents(reference2.contextElement) : [],
1359
+ reference: isElement$2(reference2) ? listScrollParents(reference2) : reference2.contextElement ? listScrollParents(reference2.contextElement) : [],
1360
1360
  popper: listScrollParents(popper2)
1361
1361
  };
1362
1362
  var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers2, state.options.modifiers)));
@@ -1406,7 +1406,7 @@ function popperGenerator(generatorOptions) {
1406
1406
  resolve(state);
1407
1407
  });
1408
1408
  }),
1409
- destroy: function destroy2() {
1409
+ destroy: function destroy() {
1410
1410
  cleanupModifierEffects();
1411
1411
  isDestroyed = true;
1412
1412
  }
@@ -1555,7 +1555,7 @@ function throttle(func, wait, options) {
1555
1555
  return result;
1556
1556
  };
1557
1557
  }
1558
- function isElement(obj) {
1558
+ function isElement$1(obj) {
1559
1559
  try {
1560
1560
  return obj instanceof HTMLElement;
1561
1561
  } catch (e) {
@@ -1657,13 +1657,13 @@ class BKPopover {
1657
1657
  }
1658
1658
  restorePopContent() {
1659
1659
  const target = this.getAppendToTarget();
1660
- if (isElement(target) && target.contains(this.popperRefer) && this.container && !this.container.contains(this.popperRefer)) {
1660
+ if (isElement$1(target) && target.contains(this.popperRefer) && this.container && !this.container.contains(this.popperRefer)) {
1661
1661
  this.container.append(this.popperRefer);
1662
1662
  }
1663
1663
  }
1664
1664
  appendToTarget() {
1665
1665
  const target = this.getAppendToTarget();
1666
- if (isElement(target) && target.contains(this.popperRefer)) {
1666
+ if (isElement$1(target) && target.contains(this.popperRefer)) {
1667
1667
  target.append(this.popperRefer);
1668
1668
  }
1669
1669
  }
@@ -1744,7 +1744,7 @@ class BKPopover {
1744
1744
  return null;
1745
1745
  }
1746
1746
  isElement(obj) {
1747
- return isElement(obj);
1747
+ return isElement$1(obj);
1748
1748
  }
1749
1749
  registerEvents() {
1750
1750
  if (this.isElement(this.referenceTarget)) {
@@ -2272,6 +2272,12 @@ function R(e = { func: () => {
2272
2272
  class z extends R() {
2273
2273
  }
2274
2274
  const propTypesNS = R({});
2275
+ function stringEnum(o2) {
2276
+ return o2.reduce((res, key) => {
2277
+ res[key] = key;
2278
+ return res;
2279
+ }, /* @__PURE__ */ Object.create(null));
2280
+ }
2275
2281
  class PropTypes extends propTypesNS {
2276
2282
  static size(sizes = ["small", "default", "large"]) {
2277
2283
  return j("Size", {
@@ -2295,8 +2301,7 @@ class PropTypes extends propTypesNS {
2295
2301
  }
2296
2302
  console.error(`invalid theme, ${val}, the theme must be one of \u3010${themes.join(" | ")}\u3011`);
2297
2303
  return false;
2298
- },
2299
- default: "primary"
2304
+ }
2300
2305
  });
2301
2306
  }
2302
2307
  static placement(placements2 = ["top", "left", "right", "bottom"]) {
@@ -2868,12 +2873,12 @@ var Component$s = vue.defineComponent({
2868
2873
  }) {
2869
2874
  const container = vue.ref(null);
2870
2875
  const el = vue.ref(null);
2871
- const visiable = vue.ref(false);
2876
+ const visible = vue.ref(false);
2872
2877
  const zIndex = vue.ref(bkZIndexManager.getModalNextIndex());
2873
2878
  const styleBottom = `${props.bottom}px`;
2874
2879
  const styleRight = `${props.right}px`;
2875
2880
  const scrollHandler = throttle(() => {
2876
- visiable.value = el.value.scrollTop >= props.visibilityHeight;
2881
+ visible.value = el.value.scrollTop >= props.visibilityHeight;
2877
2882
  }, 30);
2878
2883
  const scrollTop = () => {
2879
2884
  el.value.scrollTo({
@@ -2881,7 +2886,7 @@ var Component$s = vue.defineComponent({
2881
2886
  behavior: "smooth"
2882
2887
  });
2883
2888
  };
2884
- vue.watch(() => visiable, () => {
2889
+ vue.watch(() => visible, () => {
2885
2890
  zIndex.value = bkZIndexManager.getModalNextIndex();
2886
2891
  });
2887
2892
  vue.onMounted(() => {
@@ -2904,7 +2909,7 @@ var Component$s = vue.defineComponent({
2904
2909
  }, {
2905
2910
  default: () => {
2906
2911
  var _a, _b;
2907
- return [visiable.value ? vue.createVNode("div", {
2912
+ return [visible.value ? vue.createVNode("div", {
2908
2913
  "class": `bk-backtop ${props.extCls}`,
2909
2914
  "style": {
2910
2915
  right: styleRight,
@@ -3059,11 +3064,12 @@ var BreadcrumbItem = vue.defineComponent({
3059
3064
  const BkBreadcrumb = withInstallProps(Component$q, { Item: BreadcrumbItem });
3060
3065
  let BkLoadingMode;
3061
3066
  (function(BkLoadingMode2) {
3062
- BkLoadingMode2["Spin"] = "spin";
3063
3067
  BkLoadingMode2["Default"] = "default";
3068
+ BkLoadingMode2["Spin"] = "spin";
3064
3069
  })(BkLoadingMode || (BkLoadingMode = {}));
3065
3070
  let BkLoadingSize;
3066
3071
  (function(BkLoadingSize2) {
3072
+ BkLoadingSize2["Mini"] = "mini";
3067
3073
  BkLoadingSize2["Small"] = "small";
3068
3074
  BkLoadingSize2["Large"] = "large";
3069
3075
  })(BkLoadingSize || (BkLoadingSize = {}));
@@ -3078,8 +3084,8 @@ const loadingTypes = {
3078
3084
  loading: PropTypes.bool,
3079
3085
  theme: PropTypes.theme(["white", "primary", "warning", "success", "danger"]),
3080
3086
  title: PropTypes.string.def(""),
3081
- size: PropTypes.size(),
3082
- mode: PropTypes.oneOf(Object.values(BkLoadingMode))
3087
+ size: PropTypes.commonType(Object.values(BkLoadingSize)).def("small"),
3088
+ mode: PropTypes.commonType(Object.values(BkLoadingMode)).def("default")
3083
3089
  };
3084
3090
  var Component$p = vue.defineComponent({
3085
3091
  name: "Loading",
@@ -3096,13 +3102,14 @@ var Component$p = vue.defineComponent({
3096
3102
  const loadingWrapperCls = vue.computed(() => classes({
3097
3103
  "bk-nested-loading": !!ctx.slots.default
3098
3104
  }, "bk-loading-wrapper"));
3105
+ console.log(props.theme);
3099
3106
  const containerCls = vue.computed(() => classes({
3100
- [`bk-loading-size-${props.size}`]: !props.size,
3101
- [`bk-loading-${props.theme}`]: !props.theme
3107
+ [`bk-loading-size-${props.size}`]: !!props.size,
3108
+ [`bk-loading-${props.theme}`]: !!props.theme
3102
3109
  }, "bk-loading-indicator"));
3103
3110
  const hasTitle = vue.computed(() => !!props.title);
3104
3111
  const indicator = vue.computed(() => {
3105
- const isSpinMode = props.mode === "spin";
3112
+ const isSpinMode = props.mode === BkLoadingMode.Spin;
3106
3113
  if (typeof props.indicator === "function") {
3107
3114
  return vue.createVNode(props.indicator, null, null);
3108
3115
  }
@@ -3131,8 +3138,11 @@ const buttonProps = {
3131
3138
  hoverTheme: PropTypes.theme(["primary", "warning", "success", "danger"]).def(""),
3132
3139
  size: PropTypes.size(),
3133
3140
  title: PropTypes.string,
3141
+ icon: PropTypes.string,
3142
+ iconRight: PropTypes.string,
3134
3143
  disabled: PropTypes.bool,
3135
3144
  loading: PropTypes.bool,
3145
+ laodingMode: PropTypes.commonType(Object.values(BkLoadingMode)),
3136
3146
  outline: PropTypes.bool,
3137
3147
  text: PropTypes.bool,
3138
3148
  nativeType: {
@@ -3141,14 +3151,15 @@ const buttonProps = {
3141
3151
  };
3142
3152
  var Component$o = vue.defineComponent({
3143
3153
  name: "Button",
3144
- emits: ["click"],
3145
3154
  props: buttonProps,
3155
+ emits: ["click", "mouseover"],
3146
3156
  setup(props, {
3147
3157
  slots,
3148
3158
  attrs,
3149
3159
  emit
3150
3160
  }) {
3151
3161
  var _a;
3162
+ const isHover = vue.ref(false);
3152
3163
  const showSlot = (_a = slots.default) != null ? _a : false;
3153
3164
  const btnClsPrefix = "bk-button";
3154
3165
  const btnCls = vue.computed(() => {
@@ -3163,28 +3174,44 @@ var Component$o = vue.defineComponent({
3163
3174
  "no-slot": !showSlot
3164
3175
  }, `${themeCls} ${btnClsPrefix} ${hoverTheme}`);
3165
3176
  });
3166
- const bkLoadingCls = `${btnClsPrefix}-loading`;
3167
- const loadingTheme = ["", "default"].includes(props.theme) ? "default" : "white";
3177
+ const loadingTheme = vue.computed(() => {
3178
+ if (props.text || props.outline || props.hoverTheme) {
3179
+ if (isHover.value && !props.text)
3180
+ return "white";
3181
+ return props.hoverTheme || props.theme;
3182
+ }
3183
+ return ["", "default"].includes(props.theme) ? "" : "white";
3184
+ });
3185
+ const loadingSize = vue.computed(() => props.size === BkLoadingSize.Small ? BkLoadingSize.Mini : BkLoadingSize.Small);
3168
3186
  const handleClick = () => {
3169
3187
  emit("click");
3170
3188
  };
3189
+ const handleMouseOver = () => {
3190
+ isHover.value = true;
3191
+ emit("mouseover");
3192
+ };
3193
+ const handleMouseout = () => {
3194
+ isHover.value = false;
3195
+ };
3171
3196
  return () => {
3172
- var _a2, _b;
3197
+ var _a2;
3173
3198
  return vue.createVNode("button", vue.mergeProps({
3174
3199
  "title": props.title,
3175
3200
  "disabled": props.disabled,
3176
3201
  "class": btnCls.value,
3177
3202
  "type": props.nativeType
3178
3203
  }, attrs, {
3179
- "onClick": handleClick
3180
- }), [props.loading ? vue.createVNode("div", {
3181
- "class": bkLoadingCls
3182
- }, [vue.createVNode(BkLoading, {
3183
- "theme": loadingTheme,
3184
- "size": BkLoadingSize.Small
3185
- }, null)]) : vue.createVNode("div", {
3186
- "class": "bk-button-content-wrapper"
3187
- }, [vue.createVNode("span", null, [(_b = (_a2 = slots.default) == null ? void 0 : _a2.call(slots)) != null ? _b : "default"])])]);
3204
+ "onClick": handleClick,
3205
+ "onMouseover": handleMouseOver,
3206
+ "onMouseleave": handleMouseout
3207
+ }), [props.loading && vue.createVNode(BkLoading, {
3208
+ "class": `${btnClsPrefix}-loading`,
3209
+ "mode": props.laodingMode,
3210
+ "theme": loadingTheme.value,
3211
+ "size": loadingSize.value
3212
+ }, null), slots.default && vue.createVNode("span", {
3213
+ "class": `${btnClsPrefix}-text`
3214
+ }, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)])]);
3188
3215
  };
3189
3216
  }
3190
3217
  });
@@ -3849,19 +3876,24 @@ const inputType = {
3849
3876
  max: PropTypes.integer,
3850
3877
  min: PropTypes.integer,
3851
3878
  maxlength: PropTypes.integer,
3879
+ behavior: PropTypes.commonType(["simplicity", "normal"]).def("normal"),
3852
3880
  showWordLimit: PropTypes.bool,
3853
3881
  showControl: PropTypes.bool.def(true),
3882
+ showClearOnlyHover: PropTypes.bool.def(false),
3854
3883
  precision: PropTypes.number.def(0).validate((val) => val >= 0 && val < 20),
3855
3884
  modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
3856
3885
  size: PropTypes.size()
3857
3886
  };
3887
+ const inputEvents = ["update:modelValue", "focus", "blur", "change", "clear", "input", "keypress", "keydown", "keyup", "enter", "paste"];
3888
+ const EventEnum = stringEnum([...inputEvents]);
3858
3889
  var Component$g = vue.defineComponent({
3859
3890
  name: "Input",
3860
3891
  inheritAttrs: false,
3861
3892
  props: inputType,
3862
- emits: ["update:modelValue", "focus", "blur", "change", "clear", "input", "keydown"],
3893
+ emits: [...inputEvents],
3863
3894
  setup(props, ctx) {
3864
3895
  const isFocused = vue.ref(false);
3896
+ const isCNInput = vue.ref(false);
3865
3897
  const inputClsPrefix = "bk-input";
3866
3898
  const _a = ctx.attrs, {
3867
3899
  class: cls,
@@ -3875,6 +3907,7 @@ var Component$g = vue.defineComponent({
3875
3907
  "is-focused": isFocused.value,
3876
3908
  "is-readonly": props.readonly,
3877
3909
  "is-disabled": props.disabled,
3910
+ "is-simplicity": props.behavior === "simplicity",
3878
3911
  [`${cls}`]: !!cls
3879
3912
  }, inputClsPrefix));
3880
3913
  const suffixIconMap = {
@@ -3899,33 +3932,51 @@ var Component$g = vue.defineComponent({
3899
3932
  const isNumberInput = vue.computed(() => props.type === "number");
3900
3933
  const ceilMaxLength = vue.computed(() => Math.floor(props.maxlength));
3901
3934
  const pwdVisible = vue.ref(false);
3935
+ const clearCls = vue.computed(() => classes({
3936
+ "show-clear-only-hover": props.showClearOnlyHover
3937
+ }, suffixCls));
3902
3938
  function clear() {
3903
- ctx.emit("update:modelValue", "");
3904
- ctx.emit("change", "");
3905
- ctx.emit("clear");
3939
+ ctx.emit(EventEnum["update:modelValue"], "");
3940
+ ctx.emit(EventEnum.change, "");
3941
+ ctx.emit(EventEnum.clear);
3906
3942
  }
3907
3943
  function handleFocus(e) {
3908
3944
  isFocused.value = true;
3909
- ctx.emit("focus", e);
3945
+ ctx.emit(EventEnum.focus, e);
3910
3946
  }
3911
3947
  function handleBlur(e) {
3912
3948
  isFocused.value = false;
3913
- ctx.emit("blur", e);
3914
- }
3915
- function handleInput(e) {
3916
- ctx.emit("update:modelValue", isNumberInput.value ? +e.target.value : e.target.value);
3917
- ctx.emit("input", e.target.value);
3949
+ ctx.emit(EventEnum.blur, e);
3950
+ }
3951
+ function eventHandler(eventName) {
3952
+ return (e) => {
3953
+ let originEventName = eventName;
3954
+ if (e.code === "Enter" || e.key === "Enter" || e.keyCode === 13) {
3955
+ originEventName = EventEnum.enter;
3956
+ if (e.type !== EventEnum.keyup)
3957
+ return;
3958
+ }
3959
+ if (isCNInput.value && [EventEnum.input, EventEnum.change].some((e2) => eventName === e2))
3960
+ return;
3961
+ if (eventName === EventEnum.input) {
3962
+ ctx.emit(EventEnum["update:modelValue"], isNumberInput.value ? +e.target.value : e.target.value);
3963
+ }
3964
+ ctx.emit(originEventName, e.target.value, e);
3965
+ };
3918
3966
  }
3919
- function handleKeydown(e) {
3920
- ctx.emit("keydown", e.target.value, e);
3967
+ const [handleKeyup, handleKeydown, handleKeyPress, handlePaste, handleChange, handleInput] = [EventEnum.keyup, EventEnum.keydown, EventEnum.keypress, EventEnum.paste, EventEnum.change, EventEnum.input].map(eventHandler);
3968
+ function handleCompositionStart() {
3969
+ isCNInput.value = true;
3921
3970
  }
3922
- function handleChange(e) {
3923
- ctx.emit("change", e.target.value, e);
3971
+ function handleCompositionEnd(e) {
3972
+ isCNInput.value = false;
3973
+ handleInput(e);
3924
3974
  }
3925
3975
  function handleNumber(step, INC = true) {
3976
+ const numStep = parseInt(String(step), 10);
3926
3977
  const precision = Number.isInteger(props.precision) ? props.precision : 0;
3927
3978
  const val = parseFloat(props.modelValue.toString());
3928
- const factor = Number.isInteger(step) ? step : 1;
3979
+ const factor = Number.isInteger(numStep) ? numStep : 1;
3929
3980
  let newVal = val + (INC ? factor : -1 * factor);
3930
3981
  if (Number.isInteger(props.max)) {
3931
3982
  newVal = Math.min(newVal, props.max);
@@ -3936,12 +3987,12 @@ var Component$g = vue.defineComponent({
3936
3987
  return +newVal.toFixed(precision);
3937
3988
  }
3938
3989
  function handleInc() {
3939
- const newVal = handleNumber(parseInt(String(props.step), 10));
3940
- ctx.emit("update:modelValue", newVal);
3990
+ const newVal = handleNumber(props.step);
3991
+ ctx.emit(EventEnum["update:modelValue"], newVal);
3941
3992
  }
3942
3993
  function handleDec() {
3943
- const newVal = handleNumber(parseInt(String(props.step), 10), false);
3944
- ctx.emit("update:modelValue", newVal);
3994
+ const newVal = handleNumber(props.step, false);
3995
+ ctx.emit(EventEnum["update:modelValue"], newVal);
3945
3996
  }
3946
3997
  function getCls(name) {
3947
3998
  return `${inputClsPrefix}--${name}`;
@@ -3972,11 +4023,16 @@ var Component$g = vue.defineComponent({
3972
4023
  "onInput": handleInput,
3973
4024
  "onFocus": handleFocus,
3974
4025
  "onBlur": handleBlur,
4026
+ "onPaste": handlePaste,
3975
4027
  "onChange": handleChange,
3976
- "onKeydown": handleKeydown
4028
+ "onKeypress": handleKeyPress,
4029
+ "onKeydown": handleKeydown,
4030
+ "onKeyup": handleKeyup,
4031
+ "onCompositionstart": handleCompositionStart,
4032
+ "onCompositionend": handleCompositionEnd
3977
4033
  }), null), props.clearable && !!props.modelValue && vue.createVNode(close$1, {
3978
4034
  "onClick": clear,
3979
- "class": suffixCls
4035
+ "class": clearCls.value
3980
4036
  }, null), suffixIcon.value, typeof props.maxlength === "number" && props.showWordLimit && vue.createVNode("p", {
3981
4037
  "class": getCls("max-length")
3982
4038
  }, [props.modelValue.toString().length, vue.createTextVNode("/"), vue.createVNode("span", null, [ceilMaxLength.value])]), isNumberInput.value && props.showControl && vue.createVNode("div", {
@@ -5003,92 +5059,72 @@ const mousewheel = {
5003
5059
  mousewheelHandler(el, binding.value);
5004
5060
  }
5005
5061
  };
5006
- const nodeMap = /* @__PURE__ */ new Map();
5007
- function parseBindingValue(value) {
5008
- const isTouch = "ontouchstart" in window || (navigator == null ? void 0 : navigator.maxTouchPoints) > 0;
5009
- const defaultOption = {
5010
- handler() {
5011
- },
5012
- capture: true,
5013
- disabled: false,
5014
- detectIframe: true,
5015
- exclude: [],
5016
- events: isTouch ? ["ontouchstart"] : ["click"]
5017
- };
5018
- if (typeof value === "function") {
5019
- defaultOption.handler = value;
5020
- return defaultOption;
5021
- }
5022
- return Object.assign({}, defaultOption);
5023
- }
5024
- function onEvent(config) {
5025
- var _a;
5026
- const { el, event, handler, disabled } = config;
5027
- const path = (_a = event.composedPath) == null ? void 0 : _a.call(event);
5028
- const isClickOutside = path ? path.indexOf(el) < 0 : !el.contains(event.target);
5029
- if (!isClickOutside || !!disabled)
5030
- return;
5031
- handler(event);
5032
- }
5033
- function onIframeClick(config) {
5034
- const { activeElement } = document;
5035
- const { el, handler, disabled, event } = config;
5036
- if (activeElement && activeElement.tagName === "IFRAME" && !el.contains(activeElement) && !disabled) {
5037
- handler(event);
5038
- }
5039
- }
5040
- function getEventConfigList(el, options) {
5041
- const configList = options.events.map((name) => ({
5042
- event: name,
5043
- target: document.documentElement,
5044
- capture: options.capture,
5045
- handler: (event) => onEvent({ el, event, handler: options.handler, disabled: options.disabled })
5046
- }));
5047
- if (options.detectIframe) {
5048
- configList.push({
5049
- event: "blur",
5050
- target: window,
5051
- capture: options.capture,
5052
- handler: (event) => onIframeClick({ el, event, handler: options.handler, disabled: options.disabled })
5053
- });
5054
- }
5055
- return configList;
5056
- }
5057
- function init(el, options) {
5058
- if (nodeMap.has(el)) {
5059
- destroy(el);
5062
+ const isElement = (e) => {
5063
+ if (typeof Element === "undefined")
5064
+ return false;
5065
+ return e instanceof Element;
5066
+ };
5067
+ const nodeList = /* @__PURE__ */ new Map();
5068
+ let startClick;
5069
+ document.addEventListener("mousedown", (e) => startClick = e);
5070
+ document.addEventListener("mouseup", (e) => {
5071
+ for (const handlers of nodeList.values()) {
5072
+ for (const { documentHandler } of handlers) {
5073
+ documentHandler(e, startClick);
5074
+ }
5060
5075
  }
5061
- const configList = getEventConfigList(el, options);
5062
- nodeMap.set(el, configList);
5063
- configList.forEach((config) => {
5064
- const { target, event, handler, capture } = config;
5065
- target.addEventListener(event, handler, capture);
5066
- });
5067
- }
5068
- function destroy(el) {
5069
- var _a;
5070
- const configList = (_a = nodeMap.get(el)) != null ? _a : [];
5071
- configList.forEach((config) => {
5072
- const { target, event, handler, capture } = config;
5073
- target.removeEventListener(event, handler, capture);
5074
- });
5075
- nodeMap.delete(el);
5076
+ });
5077
+ function createDocumentHandler(el, binding) {
5078
+ let excludes = [];
5079
+ if (Array.isArray(binding.arg)) {
5080
+ excludes = binding.arg;
5081
+ } else if (isElement(binding.arg)) {
5082
+ excludes.push(binding.arg);
5083
+ }
5084
+ return function(mouseup, mousedown) {
5085
+ const { popperRef } = binding.instance;
5086
+ const mouseUpTarget = mouseup.target;
5087
+ const mouseDownTarget = mousedown == null ? void 0 : mousedown.target;
5088
+ const isBound = !binding || !binding.instance;
5089
+ const isTargetExists = !mouseUpTarget || !mouseDownTarget;
5090
+ const isContainedByEl = el.contains(mouseUpTarget) || el.contains(mouseDownTarget);
5091
+ const isSelf = el === mouseUpTarget;
5092
+ const isTargetExcluded = excludes.length && excludes.some((item) => item == null ? void 0 : item.contains(mouseUpTarget)) || excludes.length && excludes.includes(mouseDownTarget);
5093
+ const isContainedByPopper = popperRef && (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget));
5094
+ if (isBound || isTargetExists || isContainedByEl || isSelf || isTargetExcluded || isContainedByPopper) {
5095
+ return;
5096
+ }
5097
+ binding.value(mouseup, mousedown);
5098
+ };
5076
5099
  }
5077
- const clickoutside = {
5100
+ const ClickOutside = {
5078
5101
  beforeMount(el, binding) {
5079
- const options = parseBindingValue(binding.value);
5080
- if (options.disabled)
5081
- return;
5082
- nodeMap.set(el, getEventConfigList(el, options));
5102
+ if (!nodeList.has(el)) {
5103
+ nodeList.set(el, []);
5104
+ }
5105
+ nodeList.get(el).push({
5106
+ documentHandler: createDocumentHandler(el, binding),
5107
+ bindingFn: binding.value
5108
+ });
5083
5109
  },
5084
5110
  updated(el, binding) {
5085
- const newOptions = parseBindingValue(binding.value);
5086
- if (newOptions.disabled && !nodeMap.has(el))
5087
- return;
5088
- init(el, newOptions);
5111
+ if (!nodeList.has(el)) {
5112
+ nodeList.set(el, []);
5113
+ }
5114
+ const handlers = nodeList.get(el);
5115
+ const oldHandlerIndex = handlers.findIndex((item) => item.bindingFn === binding.oldValue);
5116
+ const newHandler = {
5117
+ documentHandler: createDocumentHandler(el, binding),
5118
+ bindingFn: binding.value
5119
+ };
5120
+ if (oldHandlerIndex >= 0) {
5121
+ handlers.splice(oldHandlerIndex, 1, newHandler);
5122
+ } else {
5123
+ handlers.push(newHandler);
5124
+ }
5089
5125
  },
5090
5126
  unmounted(el) {
5091
- destroy(el);
5127
+ nodeList.delete(el);
5092
5128
  }
5093
5129
  };
5094
5130
  var popper = "";
@@ -5202,7 +5238,7 @@ function createPopperInstance(el, popper2, options) {
5202
5238
  var Component$a = vue.defineComponent({
5203
5239
  name: "Select",
5204
5240
  directives: {
5205
- clickoutside
5241
+ clickoutside: ClickOutside
5206
5242
  },
5207
5243
  props: {
5208
5244
  modelValue: PropTypes.any,
@@ -5738,7 +5774,7 @@ var Component$8 = vue.defineComponent({
5738
5774
  });
5739
5775
  defaultSteps.value.splice(0, defaultSteps.value.length, ...defaults);
5740
5776
  };
5741
- const init2 = () => {
5777
+ const init = () => {
5742
5778
  var _a;
5743
5779
  defaultSteps.value.splice(0, defaultSteps.value.length, ...[{
5744
5780
  title: "\u6B65\u9AA41",
@@ -5770,7 +5806,7 @@ var Component$8 = vue.defineComponent({
5770
5806
  console.warn(e);
5771
5807
  }
5772
5808
  };
5773
- vue.onMounted(init2);
5809
+ vue.onMounted(init);
5774
5810
  return {
5775
5811
  defaultSteps,
5776
5812
  jumpTo
@@ -11533,7 +11569,20 @@ const datePickerProps = {
11533
11569
  type: String,
11534
11570
  default: "bottom-start",
11535
11571
  validator: (value) => {
11536
- const validList = ["top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end", "right", "right-start", "right-end"];
11572
+ const validList = [
11573
+ "top",
11574
+ "top-start",
11575
+ "top-end",
11576
+ "bottom",
11577
+ "bottom-start",
11578
+ "bottom-end",
11579
+ "left",
11580
+ "left-start",
11581
+ "left-end",
11582
+ "right",
11583
+ "right-start",
11584
+ "right-end"
11585
+ ];
11537
11586
  if (validList.indexOf(value) < 0) {
11538
11587
  console.error(`placement property is not valid: '${value}'`);
11539
11588
  return false;
@@ -11600,7 +11649,7 @@ const datePickerProps = {
11600
11649
  var Component$1 = vue.defineComponent({
11601
11650
  name: "DatePicker",
11602
11651
  directives: {
11603
- clickoutside
11652
+ clickoutside: ClickOutside
11604
11653
  },
11605
11654
  props: datePickerProps,
11606
11655
  emits: ["open-change", "input", "change", "update:modelValue", "clear", "shortcut-change", "pick-success"],
@@ -11719,6 +11768,7 @@ var Component$1 = vue.defineComponent({
11719
11768
  };
11720
11769
  vue.watch(() => state.visible, (visible) => {
11721
11770
  var _a, _b;
11771
+ console.error(123);
11722
11772
  if (visible === false) {
11723
11773
  (_a = pickerDropdownRef.value) == null ? void 0 : _a.destoryDropdown();
11724
11774
  }
@@ -12246,7 +12296,7 @@ var Transfer = vue.defineComponent({
12246
12296
  if (!typeFlag.value) {
12247
12297
  generalInit();
12248
12298
  } else {
12249
- init2();
12299
+ init();
12250
12300
  }
12251
12301
  }
12252
12302
  };
@@ -12283,7 +12333,7 @@ var Transfer = vue.defineComponent({
12283
12333
  emit("change", dataList.value, [...handleListFormat(hasSelectedList.value, false)], []);
12284
12334
  }
12285
12335
  };
12286
- const init2 = () => {
12336
+ const init = () => {
12287
12337
  if (!props.targetList.length || props.targetList.length > props.sourceList.length) {
12288
12338
  dataList.value.splice(0, dataList.value.length, ...props.sourceList);
12289
12339
  hasSelectedList.value = [];
@@ -12416,7 +12466,7 @@ var Transfer = vue.defineComponent({
12416
12466
  if (!typeFlag.value) {
12417
12467
  generalInit();
12418
12468
  } else {
12419
- init2();
12469
+ init();
12420
12470
  }
12421
12471
  initSort();
12422
12472
  }
@@ -12749,7 +12799,10 @@ const getStringOrFuncStr = (item, props, key, args = []) => {
12749
12799
  };
12750
12800
  const getLabel = (item, props) => getStringOrFuncStr(item, props, "label");
12751
12801
  const getSchemaVal = (schema, uuid2) => schema.get(uuid2) || {};
12752
- const getNodeAttr = (schema, uuid2, key) => (getSchemaVal(schema, uuid2) || {})[key];
12802
+ const getNodeAttr = (schema, uuid2, key) => {
12803
+ var _a;
12804
+ return (_a = getSchemaVal(schema, uuid2)) == null ? void 0 : _a[key];
12805
+ };
12753
12806
  const getTreeStyle = (item, props) => {
12754
12807
  const levelLine = getPropsOneOfBoolValueWithDefault(props, "levelLine", item, DEFAULT_LEVLE_LINE, null, ["tree"]);
12755
12808
  return {
@@ -12760,14 +12813,11 @@ const getTreeStyle = (item, props) => {
12760
12813
  };
12761
12814
  };
12762
12815
  const getNodeItemStyle = (item, props, flatData = {}) => {
12763
- const { levelLineSchema, schema } = flatData;
12764
- const { childNodeCount = 0, isLeaf = false, lastNode = null } = levelLineSchema[item.__uuid] || {};
12765
- const lastNodeCount = isLeaf ? 0 : (levelLineSchema[lastNode] || { childNodeCount: 0 }).childNodeCount;
12816
+ const { schema } = flatData;
12766
12817
  const depth = getNodeAttr(schema, item.__uuid, "__depth");
12767
12818
  return __spreadValues({
12768
12819
  "--depth": depth,
12769
- paddingLeft: 0,
12770
- "--lines": childNodeCount - lastNodeCount
12820
+ paddingLeft: 0
12771
12821
  }, typeof props.levelLine === "function" ? {
12772
12822
  "--level-line": getPropsOneOfBoolValueWithDefault(props, "levelLine", item, DEFAULT_LEVLE_LINE, null, [
12773
12823
  "node"
@@ -12780,16 +12830,20 @@ const getNodeItemClass = (item, schema, props) => {
12780
12830
  "is-root": __isRoot,
12781
12831
  "bk-tree-node": true,
12782
12832
  "is-open": __isOpen,
12783
- "is-virtual-render": props.virtualRender
12833
+ "is-virtual-render": props.virtualRender,
12834
+ "level-line": props.levelLine
12784
12835
  };
12785
12836
  };
12786
12837
  const updateTreeNode = (path, treeData, childKey, nodekey, nodeValue) => {
12838
+ assignTreeNode(path, treeData, childKey, { [nodekey]: nodeValue });
12839
+ };
12840
+ const assignTreeNode = (path, treeData, childKey, assignVal) => {
12787
12841
  const paths = path.split("-");
12788
12842
  const targetNode = paths.reduce((pre, nodeIndex) => {
12789
12843
  const index = Number(nodeIndex);
12790
12844
  return Array.isArray(pre) ? pre[index] : pre[childKey][index];
12791
12845
  }, treeData);
12792
- Object.assign(targetNode, { [nodekey]: nodeValue });
12846
+ Object.assign(targetNode, assignVal || {});
12793
12847
  };
12794
12848
  const treeProps = {
12795
12849
  data: PropTypes.arrayOf(PropTypes.any).def([]),
@@ -12808,7 +12862,10 @@ const treeProps = {
12808
12862
  }),
12809
12863
  PropTypes.bool.def(false)
12810
12864
  ]).def(true),
12811
- asyncLoad: PropTypes.func.def(null)
12865
+ async: PropTypes.shape({
12866
+ callback: PropTypes.func.def(null),
12867
+ cache: PropTypes.bool.def(true)
12868
+ })
12812
12869
  };
12813
12870
  var Component = vue.defineComponent({
12814
12871
  name: "Tree",
@@ -12825,13 +12882,9 @@ var Component = vue.defineComponent({
12825
12882
  const formatData2 = getFlatdata(props, newData, schemaValues.value);
12826
12883
  flatData.data = formatData2[0];
12827
12884
  flatData.schema = formatData2[1];
12828
- computeLevelHeight();
12829
12885
  }, {
12830
12886
  deep: true
12831
12887
  });
12832
- vue.watch(() => [props.levelLine], () => {
12833
- computeLevelHeight();
12834
- });
12835
12888
  const schemaValues = vue.computed(() => Array.from(flatData.schema.values()));
12836
12889
  const getSchemaVal2 = (key) => flatData.schema.get(key);
12837
12890
  const getNodeAttr2 = (node, attr) => {
@@ -12846,7 +12899,6 @@ var Component = vue.defineComponent({
12846
12899
  const isNodeOpened = (node) => getNodeAttr2(node, "__isOpen");
12847
12900
  const hasChildNode = (node) => getNodeAttr2(node, "__hasChild");
12848
12901
  const renderData = vue.computed(() => flatData.data.filter((item) => checkNodeIsOpen(item)));
12849
- const renderNodePathColl = vue.computed(() => renderData.value.map((node) => getNodePath(node)));
12850
12902
  const isItemOpen = (item) => {
12851
12903
  var _a;
12852
12904
  if (typeof item === "object") {
@@ -12914,7 +12966,10 @@ var Component = vue.defineComponent({
12914
12966
  const setNodeOpened = (item) => {
12915
12967
  const newVal = !isItemOpen(item);
12916
12968
  setNodeAttr(item, "__isOpen", newVal);
12917
- computeLevelHeight();
12969
+ if (newVal) {
12970
+ return;
12971
+ }
12972
+ renderData.value.filter((node) => String.prototype.startsWith.call(getNodePath(node), getNodePath(item))).forEach((filterNode) => setNodeAttr(filterNode, "__isOpen", newVal));
12918
12973
  };
12919
12974
  const setNodeRemoteLoad = (resp, item) => {
12920
12975
  if (typeof resp === "object" && resp !== null) {
@@ -12925,12 +12980,20 @@ var Component = vue.defineComponent({
12925
12980
  };
12926
12981
  const hanldeTreeNodeClick = (item) => {
12927
12982
  if (item.async) {
12928
- if (typeof props.asyncLoad === "function") {
12983
+ const {
12984
+ callback = null,
12985
+ cache = true
12986
+ } = props.async || {};
12987
+ if (typeof callback === "function" && !item.cached) {
12929
12988
  Object.assign(item, {
12930
12989
  loading: true
12931
12990
  });
12932
- props.asyncLoad(item, (resp) => setNodeRemoteLoad(resp, item)).then((resp) => setNodeRemoteLoad(resp, item)).catch((err) => console.error("load remote data error:", err)).finally(() => {
12933
- updateTreeNode(getNodePath(item), props.data, props.children, "loading", false);
12991
+ callback(item, (resp) => setNodeRemoteLoad(resp, item)).then((resp) => setNodeRemoteLoad(resp, item)).catch((err) => console.error("load remote data error:", err)).finally(() => {
12992
+ assignTreeNode(getNodePath(item), props.data, props.children, __spreadValues({
12993
+ loading: false
12994
+ }, cache ? {
12995
+ cached: true
12996
+ } : {}));
12934
12997
  });
12935
12998
  } else {
12936
12999
  console.error("async need to set prop: asyncLoad with function wich will return promise object");
@@ -12940,47 +13003,6 @@ var Component = vue.defineComponent({
12940
13003
  setNodeOpened(item);
12941
13004
  }
12942
13005
  };
12943
- const computeLevelHeight = () => {
12944
- if (!!props.levelLine) {
12945
- setTimeout(() => {
12946
- let showNodeCount = renderData.value.length;
12947
- const nodeSchema = {};
12948
- const setDefaultNodeSchema = (uuid2, lastNode = null, isLeaf = false) => {
12949
- if (!Object.prototype.hasOwnProperty.call(nodeSchema, uuid2)) {
12950
- Object.assign(nodeSchema, {
12951
- [uuid2]: __spreadValues(__spreadValues({
12952
- childNodeCount: 0,
12953
- isLastNode: false
12954
- }, lastNode !== null ? {
12955
- lastNode
12956
- } : {}), isLeaf !== null ? {
12957
- isLeaf
12958
- } : {})
12959
- });
12960
- }
12961
- };
12962
- for (; showNodeCount > 0; showNodeCount--) {
12963
- const node = renderData.value[showNodeCount - 1];
12964
- const parentId = getNodeAttr2(node, "__parentId");
12965
- const nodepath = getNodePath(node);
12966
- const isLeaf = !renderNodePathColl.value.includes(`${nodepath}-0`);
12967
- setDefaultNodeSchema(node.__uuid, null, isLeaf);
12968
- setDefaultNodeSchema(parentId, node.__uuid);
12969
- const parentSchema = nodeSchema[parentId];
12970
- const currentNodeSchema = nodeSchema[node.__uuid];
12971
- const {
12972
- childNodeCount = 0
12973
- } = currentNodeSchema;
12974
- currentNodeSchema.childNodeCount = childNodeCount + 1;
12975
- currentNodeSchema.isLastNode = parentSchema.lastNode === node.__uuid;
12976
- parentSchema.childNodeCount += currentNodeSchema.childNodeCount;
12977
- }
12978
- flatData.levelLineSchema = nodeSchema;
12979
- });
12980
- } else {
12981
- flatData.levelLineSchema = {};
12982
- }
12983
- };
12984
13006
  const checkNodeIsOpen = (node) => isRootNode(node) || isItemOpen(node) || isItemOpen(getNodeAttr2(node, "__parentId"));
12985
13007
  const filterNextNode = (depth, node) => {
12986
13008
  if (isRootNode(node)) {
@@ -12999,7 +13021,7 @@ var Component = vue.defineComponent({
12999
13021
  return schemaValues.value.some((val) => val.__path === nextNodePath);
13000
13022
  };
13001
13023
  const getVirtualLines = (node) => {
13002
- if (!props.virtualRender) {
13024
+ if (!props.levelLine) {
13003
13025
  return null;
13004
13026
  }
13005
13027
  const getNodeLineStyle = (dpth) => ({
@@ -13011,7 +13033,6 @@ var Component = vue.defineComponent({
13011
13033
  "style": getNodeLineStyle(maxDeep - index)
13012
13034
  }, null));
13013
13035
  };
13014
- computeLevelHeight();
13015
13036
  return {
13016
13037
  renderData,
13017
13038
  flatData,
@@ -13035,7 +13056,8 @@ var Component = vue.defineComponent({
13035
13056
  "style": getTreeStyle(null, props),
13036
13057
  "list": this.renderData,
13037
13058
  "lineHeight": props.lineHeight,
13038
- "enabled": props.virtualRender
13059
+ "enabled": props.virtualRender,
13060
+ "throttleDelay": 0
13039
13061
  }, {
13040
13062
  default: (scoped) => (scoped.data || []).map(renderTreeNode)
13041
13063
  });
@@ -13444,6 +13466,6 @@ exports.Transfer = Transfer;
13444
13466
  exports.Tree = BkTree;
13445
13467
  exports.VirtualRender = BkVirtualRender;
13446
13468
  exports.bkTooltips = tooltips;
13447
- exports.clickoutside = clickoutside;
13469
+ exports.clickoutside = ClickOutside;
13448
13470
  exports["default"] = preset;
13449
13471
  exports.mousewheel = mousewheel;