@opentiny/vue-renderless 3.8.4 → 3.9.0

package/record/index.js

@@ -95,31 +95,91 @@ class Record {
     onMediaProgress && onMediaProgress(this.analyser, this.audioContext);
   }
 }
-const toogleRecord = ({ state, api, emit, constants }) => () => {
-  if (state.record.status === constants.STATUS.READY) {
-    !state.recorder && (state.recorder = new Record({
-      onMediaProgress: api.renderAudioGraph,
-      onstop: (file) => emit("confirm", file)
-    }));
-    state.recorder.start().then((isSuccess) => {
-      if (!isSuccess) {
-        return emit("error");
-      }
-      state.record.status = constants.STATUS.RECORDING;
-    });
-  } else if (state.record.status === constants.STATUS.PAUSE) {
-    state.record.status = constants.STATUS.RECORDING;
-    state.recorder.resume();
+const calcRecordTime = ({ state }) => (recording = false) => {
+  state.record.now = Date.now();
+  if (!state.record.fn) {
+    state.record.fn = () => {
+      const cur = Date.now();
+      state.record.currentTime += (cur - state.record.now) / 1e3;
+      state.record.now = cur;
+    };
+  }
+  if (!recording) {
+    state.record.timer = setInterval(state.record.fn, 1e3);
+  } else {
+    clearInterval(state.record.timer);
+    state.record.timer = null;
+    state.record.fn();
+  }
+};
+const toogleRecord = ({ state, api, emit, constants, props }) => ($event) => {
+  const { READY, RECORDING, PAUSE } = constants.STATUS;
+  if (props.isHwh5) {
+    if (state.record.status === READY) {
+      api.triggerClick($event, constants.HWH5_STATUS.START, () => state.record.status = RECORDING);
+    } else if (state.record.status === PAUSE) {
+      api.triggerClick($event, constants.HWH5_STATUS.CONTINUE, () => state.record.status = RECORDING);
+    } else {
+      api.triggerClick($event, constants.HWH5_STATUS.PAUSE, () => state.record.status = PAUSE);
+    }
+  } else {
+    if (state.record.status === READY) {
+      !state.recorder && (state.recorder = new Record({
+        onMediaProgress: (analyser, audioContext) => {
+          state.record.currentTime = audioContext.currentTime;
+          state.voiceNum = calcVoice(analyser);
+        },
+        onstop: (file) => emit("confirm", file)
+      }));
+      state.recorder.start().then((isSuccess) => {
+        if (!isSuccess) {
+          return emit("error");
+        }
+        state.record.status = RECORDING;
+      });
+    } else if (state.record.status === PAUSE) {
+      state.record.status = RECORDING;
+      state.recorder.resume();
+    } else {
+      state.record.status = PAUSE;
+      state.recorder.pause();
+    }
+  }
+};
+const handleConfirm = ({ state, emit, props, constants, api }) => ($event) => {
+  if (props.isHwh5) {
+    api.triggerClick($event, constants.HWH5_STATUS.CANCEL, () => emit("update:modelValue", false));
   } else {
-    state.record.status = constants.STATUS.PAUSE;
-    state.recorder.pause();
+    state.isClickConfirm = true;
+    emit("update:modelValue", false);
   }
 };
-const handleConfirm = ({ state, emit }) => () => {
-  state.isClickConfirm = true;
-  emit("update:modelValue", false);
+const handleCancel = ({ emit, props, constants, api, state }) => ($event) => {
+  if (props.isHwh5) {
+    api.triggerClick($event, constants.HWH5_STATUS.CANCEL, () => emit("update:modelValue", false));
+  } else {
+    state.isClickConfirm = true;
+    emit("update:modelValue", false);
+  }
+};
+const triggerClick = ({ state }) => ($event, type, cb) => {
+  const res = state.listeners["trigger-click"] && state.listeners["trigger-click"]($event, type);
+  if (res && res.then) {
+    res.then(() => cb && cb());
+  } else {
+    cb && cb();
+  }
 };
 const watchModelValue = ({ api }) => (value) => !value && api.resetRecord();
+const watchRecordStatus = ({ api, props, constants, state }) => (val) => {
+  if (val === constants.STATUS.RECORDING) {
+    props.isHwh5 && api.calcRecordTime();
+    api.renderAudioGraph();
+  } else if (val === constants.STATUS.PAUSE) {
+    props.isHwh5 && api.calcRecordTime(true);
+  }
+  cancelAnimationFrame(state.handlerId);
+};
 const calcVoice = (analyser) => {
   const dataArray = new Uint8Array(analyser.fftSize);
   analyser.getByteTimeDomainData(dataArray);
@@ -130,61 +190,108 @@ const calcVoice = (analyser) => {
     lowValue += dataArray[i] < 128 ? 128 - dataArray[i] : 0;
   }
   let voiceNum = 1;
-  const voiceMatch = [0, 100, 500, 1e3, 1e4];
-  const ismatch = voiceMatch.some((val2, idx) => {
-    if (highValue <= val2) {
-      return voiceNum = idx + 1 + (val2 === 0 ? lowValue / 1e3 : highValue / val2);
+  const voiceMatch = [0, 500, 1e3, 5e3, 1e4];
+  const ismatch = voiceMatch.some((val, idx) => {
+    if (highValue <= val) {
+      return voiceNum = idx + 1 + (val === 0 ? lowValue / 1e3 : highValue / val);
     }
   });
   !ismatch && (voiceNum = 6);
-  const val = voiceNum * 5;
-  let result = [-val, 2 * val, -3 * val];
-  return result.concat(
-    result.slice().reverse().map((times) => -times)
-  );
+  return voiceNum;
+};
+const getOptions = ({ canvasCtx, width }) => {
+  const createStrokeStyle = ({ canvasCtx: canvasCtx2, width: width2, colors = [] }) => {
+    const grd = canvasCtx2.createLinearGradient(0, 0, width2, 0);
+    colors.forEach(({ n, color }) => grd.addColorStop(n, color));
+    return grd;
+  };
+  const optionList = [
+    { q: 0, a: 8, w: 1 / 35, speed: -0.05 },
+    { q: 4, a: 7, w: 1 / 35, speed: -0.1 },
+    { q: 10, a: 6, w: 1 / 35, speed: -0.3 }
+  ];
+  const colorOptions = [
+    [
+      { n: 0, color: "rgba(0, 109, 213, 0)" },
+      { n: 0.5, color: "rgba(0, 109, 213, 0.8)" },
+      { n: 1, color: "rgba(0, 109, 213, 0)" }
+    ],
+    [
+      { n: 0, color: "rgba(0, 14, 215, 0)" },
+      { n: 0.5, color: "rgba(0, 14, 215, 0.4)" },
+      { n: 1, color: "rgba(0, 14, 215, 0)" }
+    ],
+    [
+      { n: 0, color: "rgba(0, 109, 213, 0)" },
+      { n: 0.5, color: "rgba(0, 109, 213, 0.3)" },
+      { n: 1, color: "rgba(0, 109, 213, 0)" }
+    ]
+  ];
+  optionList.forEach((option, i) => {
+    option.strokeStyle = createStrokeStyle({
+      canvasCtx,
+      width,
+      colors: colorOptions[i]
+    });
+  });
+  return optionList;
 };
-const renderAudioGraph = ({ vm, state }) => (analyser, audioContext) => {
-  state.record.currentTime = audioContext.currentTime;
-  let canvas = vm.$refs.canvas;
-  if (canvas) {
-    const height = canvas.offsetHeight;
-    const width = canvas.offsetWidth;
-    canvas.height = height;
-    canvas.width = width;
-    const canvasCtx = canvas.getContext("2d");
-    canvasCtx.clearRect(0, 0, width, height);
-    canvasCtx.fillStyle = "#fff";
-    canvasCtx.fillRect(0, 0, width, height);
-    canvasCtx.lineWidth = 1;
-    const grd = canvasCtx.createLinearGradient(0, 0, width, 0);
-    grd.addColorStop(0, "rgba(0, 103, 209, 0.1)");
-    grd.addColorStop(0.5, "rgba(0, 103, 209, 1)");
-    grd.addColorStop(1, "rgba(0, 103, 209, 0.1)");
-    canvasCtx.strokeStyle = grd;
-    let x = 0;
-    canvasCtx.beginPath();
-    canvasCtx.moveTo(x, height / 2);
-    const tops = calcVoice(analyser);
-    const space = width / 12;
-    for (let j = 0; j < 6; j++) {
-      canvasCtx.quadraticCurveTo(x += space, height / 2 - tops[j], x += space, height / 2);
+const renderAudioGraph = ({ vm, nextTick, state, props }) => () => {
+  nextTick(() => {
+    let canvas = vm.$refs.canvas;
+    if (canvas) {
+      const height = canvas.offsetHeight;
+      const width = canvas.offsetWidth;
+      canvas.height = height;
+      canvas.width = width;
+      const canvasCtx = canvas.getContext("2d");
+      const optionList = getOptions({ canvasCtx, width });
+      const draw = () => {
+        state.handlerId = requestAnimationFrame(draw);
+        let voiceNum = 1;
+        if (!props.isHwh5 && state.voiceNum) {
+          voiceNum = state.voiceNum.toFixed(1);
+        }
+        canvasCtx.clearRect(0, 0, width, height);
+        canvasCtx.fillStyle = "#fff";
+        canvasCtx.fillRect(0, 0, width, height);
+        optionList.forEach((option) => {
+          const { a, w, speed, strokeStyle } = option;
+          canvasCtx.lineWidth = 1;
+          canvasCtx.strokeStyle = strokeStyle;
+          let x = 0;
+          canvasCtx.beginPath();
+          canvasCtx.moveTo(x, height / 2);
+          option.q += speed;
+          for (let x2 = 0; x2 <= width; x2++) {
+            const y = a * voiceNum * Math.sin(w * x2 + option.q) + height / 2;
+            canvasCtx.lineTo(x2, y);
+          }
+          canvasCtx.stroke();
+        });
+      };
+      draw();
     }
-    canvasCtx.lineTo(width, height / 2);
-    canvasCtx.stroke();
-  }
+  });
 };
 const resetRecord = ({ state, constants }) => () => {
   state.record.status = constants.STATUS.READY;
   state.record.currentTime = 0;
-  state.isClickConfirm && state.recorder && state.recorder.stop();
+  state.isClickConfirm && state.recorder && state.recorder.recorder && state.recorder.stop();
   state.isClickConfirm = false;
+  clearInterval(state.record.timer);
+  state.record.timer = null;
 };
 const unmounted = ({ api }) => () => api.resetRecord();
 export {
+  calcRecordTime,
+  handleCancel,
   handleConfirm,
   renderAudioGraph,
   resetRecord,
   toogleRecord,
+  triggerClick,
   unmounted,
-  watchModelValue
+  watchModelValue,
+  watchRecordStatus
 };

package/record/vue.js

@@ -1,8 +1,20 @@
 import "../chunk-PKUHTIDK.js";
-import { toogleRecord, handleConfirm, watchModelValue, renderAudioGraph, unmounted, resetRecord } from "./index";
-const api = ["state", "toogleRecord", "handleConfirm"];
-const initState = ({ api: api2, reactive, computed }) => {
+import {
+  toogleRecord,
+  handleConfirm,
+  watchModelValue,
+  renderAudioGraph,
+  unmounted,
+  resetRecord,
+  handleCancel,
+  triggerClick,
+  watchRecordStatus,
+  calcRecordTime
+} from "./index";
+const api = ["state", "toogleRecord", "handleConfirm", "handleCancel"];
+const initState = ({ vm, api: api2, reactive, computed }) => {
   const state = reactive({
+    listeners: vm.$listeners,
     record: {
       status: "ready",
       currentTime: 0
@@ -17,25 +29,30 @@ const initState = ({ api: api2, reactive, computed }) => {
   Object.assign(api2, { state });
   return state;
 };
-const initApi = ({ api: api2, state, emit, vm, constants }) => {
+const initApi = ({ api: api2, state, emit, vm, constants, props, nextTick }) => {
   Object.assign(api2, {
-    toogleRecord: toogleRecord({ state, api: api2, emit, constants }),
-    handleConfirm: handleConfirm({ state, emit }),
+    toogleRecord: toogleRecord({ state, api: api2, emit, constants, props }),
+    handleConfirm: handleConfirm({ state, emit, props, constants, api: api2 }),
     watchModelValue: watchModelValue({ api: api2 }),
-    renderAudioGraph: renderAudioGraph({ vm, state }),
+    renderAudioGraph: renderAudioGraph({ vm, nextTick, state, props }),
     unmounted: unmounted({ api: api2 }),
-    resetRecord: resetRecord({ state, constants })
+    resetRecord: resetRecord({ state, constants }),
+    handleCancel: handleCancel({ emit, props, constants, api: api2, state }),
+    triggerClick: triggerClick({ state }),
+    watchRecordStatus: watchRecordStatus({ api: api2, props, constants, state }),
+    calcRecordTime: calcRecordTime({ state })
   });
 };
-const initWatch = ({ watch, props, api: api2 }) => {
+const initWatch = ({ watch, props, api: api2, state }) => {
   watch(() => props.modelValue, api2.watchModelValue, { immediate: true });
+  watch(() => state.record.status, api2.watchRecordStatus);
 };
-const renderless = (props, { reactive, watch, computed, onUnmounted }, { emit, vm, constants }) => {
+const renderless = (props, { reactive, watch, computed, onUnmounted, nextTick }, { emit, vm, constants }) => {
   const api2 = {};
-  const state = initState({ api: api2, reactive, computed });
-  initApi({ api: api2, state, emit, vm, constants });
-  initWatch({ watch, props, api: api2 });
-  onUnmounted(() => api2.unmounted);
+  const state = initState({ vm, api: api2, reactive, computed });
+  initApi({ api: api2, state, emit, vm, constants, props, nextTick });
+  initWatch({ watch, props, api: api2, state });
+  onUnmounted(api2.unmounted);
   return api2;
 };
 export {

package/roles/index.js

@@ -37,15 +37,15 @@ const changeRole = ({ constants, emit, props, service, state }) => ({ roleId })
     });
   });
 };
-const initService = (service) => {
+const initService = (service, props) => {
   const { base = {}, common = {}, pushCustomized } = service || {};
   const noopFn = () => Promise.resolve(null);
   const commonNoopFn = () => Promise.reject(new Error("[Tiny Error][Roles] This component depends on @opentiny/vue-service"));
   return {
-    getEnvInfoSync: base.getEnvInfoSync || commonNoopFn,
-    getChangeRoleUrl: common.getChangeRoleUrl || commonNoopFn,
-    getCustomized: common.getCustomized || noopFn,
-    pushCustomized: pushCustomized || noopFn
+    getEnvInfoSync: props.getEnvInfoSync || base.getEnvInfoSync || commonNoopFn,
+    getChangeRoleUrl: props.getChangeRoleUrl || common.getChangeRoleUrl || commonNoopFn,
+    getCustomized: props.getCustomized || common.getCustomized || noopFn,
+    pushCustomized: props.pushCustomized || pushCustomized || noopFn
   };
 };
 export {

package/roles/vue.js

@@ -2,7 +2,7 @@ import "../chunk-PKUHTIDK.js";
 import { showList, show, hide, getRoleList, changeRole, initService } from "./index";
 const api = ["state", "showList", "show", "hide", "changeRole"];
 const renderless = (props, { computed, reactive }, { emit, service, constants }) => {
-  const $service = initService(service);
+  const $service = initService(service, props);
   let api2 = {};
   const state = reactive({
     currentRole: "",

package/slider/index.js

@@ -9,7 +9,7 @@ const bindEvent = (api) => () => {
 };
 const unBindEvent = (api) => () => off(window, "resize", api.bindResize);
 const bindResize = ({ parent, props, state }) => () => {
-  const handleEl = parent.$el.firstElementChild;
+  const handleEl = parent.$el.querySelector("div[role=tiny-slider]");
   state.sliderSize = handleEl["client" + (props.vertical ? "Height" : "Width")];
   state.sliderOffset = handleEl.getBoundingClientRect();
 };
@@ -307,10 +307,12 @@ const watchActiveValue = ({ api, emit, props, state }) => (newValue, oldValue) =
 const watchModelValue = ({ api, state }) => (value) => {
   if (!state.innerTrigger) {
     api.initSlider(value);
+    api.setActiveButtonValue(value);
   } else {
     state.innerTrigger = false;
     if (!state.isDouble) {
       api.initSlider(value);
+      api.setActiveButtonValue(value);
     }
   }
 };

package/steps/index.js

@@ -23,8 +23,16 @@ const computedRightNodePos = ({ state, props }) => () => {
     right: -(index + 1) * 4 + "px"
   }));
 };
+const computedSpace = ({ props }) => {
+  const { space } = props;
+  if (/^\d+$/.test(space)) {
+    return `${space}px`;
+  }
+  return space;
+};
 export {
   computedRightNodePos,
+  computedSpace,
   isVisibleHandler,
   updateStartIndex
 };

package/steps/vue.js

@@ -1,11 +1,12 @@
 import "../chunk-PKUHTIDK.js";
-import { updateStartIndex, isVisibleHandler, computedRightNodePos } from "./index";
+import { updateStartIndex, isVisibleHandler, computedRightNodePos, computedSpace } from "./index";
 const api = ["state", "isVisibleHandler"];
 const renderless = (props, { reactive, watch, computed }) => {
   const state = reactive({
     startIndex: 0,
     endIndex: computed(() => state.startIndex + props.visibleNum),
-    rightNodePositions: computed(() => api2.computedRightNodePos())
+    rightNodePositions: computed(() => api2.computedRightNodePos()),
+    computedSpace: computed(() => computedSpace({ props }))
   });
   const api2 = {
     updateStartIndex: updateStartIndex({ state, props }),

package/tabs-mf/vue-bar.js

@@ -2,9 +2,9 @@ import "../chunk-PKUHTIDK.js";
 import { addResizeListener, removeResizeListener } from "../common/deps/resize-event";
 import { wheelListener, getBoundRect, handleClickDropdownItem, key, emitAdd } from "./index";
 import { getAddWheelListener } from "./wheel";
-const { addWheelListener, removeWheelListener } = getAddWheelListener(window, document);
 const api = ["state", "wheelListener", "handleClickDropdownItem", "key", "emitAdd"];
 const renderless = (props, { onMounted, onBeforeUnmount, reactive, watch, inject, computed }, { vm }) => {
+  const { addWheelListener, removeWheelListener } = getAddWheelListener(window, document);
   const tabs = inject("tabs", null);
   const state = reactive({
     moreList: [],

package/text-popup/vue.js

@@ -1,9 +1,10 @@
 import "../chunk-PKUHTIDK.js";
 import { computedWidth, watchValue, mounted, onFocus, onBlur, onInput, separteText, jointText } from "./index";
 const api = ["state", "onFocus", "onBlur", "onInput"];
-const renderless = (props, { computed, onMounted, reactive, watch }, { emit, nextTick, refs }) => {
+const renderless = (props, { computed, onMounted, reactive, watch, inject }, { emit, nextTick, refs }) => {
   const api2 = {};
   const state = reactive({
+    showAutoWidth: inject("showAutoWidth", null),
     type: "input",
     textAreaValue: "",
     text: null,

package/time-line/index.js

@@ -8,6 +8,13 @@ const getStatus = ({ state, t }) => (value) => {
   const status = state.current - value;
   return status > 0 ? t("ui.steps.done") : status === 0 ? t("ui.steps.doing") : t("ui.steps.wait");
 };
+const computedSpace = ({ props }) => {
+  const { space } = props;
+  if (/^\d+$/.test(space)) {
+    return `${space}px`;
+  }
+  return space;
+};
 const handleClick = ({ emit, state }) => ({ index, node }) => {
   if (!node.disabled) {
     emit("click", state.isReverse ? state.nodes.length - index - 1 : index, node);
@@ -47,6 +54,7 @@ export {
   computedCurrent,
   computedData,
   computedIsReverse,
+  computedSpace,
   computedStackNodes,
   getDate,
   getStatus,

package/time-line/vue.js

@@ -1,5 +1,5 @@
 import "../chunk-PKUHTIDK.js";
-import { handleClick, getStatusCls, getStatus, computedData, getDate, computedCurrent, computedIsReverse, changeStatus, computedStackNodes } from "./index";
+import { handleClick, getStatusCls, getStatus, computedData, getDate, computedCurrent, computedIsReverse, changeStatus, computedStackNodes, computedSpace } from "./index";
 const api = ["state", "handleClick", "getStatusCls", "getStatus", "getDate", "changeStatus"];
 const renderless = (props, { computed, reactive }, { t, emit, constants }) => {
   const api2 = {};
@@ -8,6 +8,7 @@ const renderless = (props, { computed, reactive }, { t, emit, constants }) => {
     current: computed(() => api2.computedCurrent()),
     isReverse: computed(() => api2.computedIsReverse()),
     stackNodes: computed(() => state.showAll ? state.nodes : api2.computedStackNodes()),
+    computedSpace: computed(() => computedSpace({ props })),
     showData: false,
     showAll: false
   });

package/tooltip/index.js

@@ -1,7 +1,9 @@
 import "../chunk-PKUHTIDK.js";
 import debounce from "../common/deps/debounce";
 import { on, off, addClass, removeClass } from "../common/deps/dom";
-const show = ({ api, state, props }) => () => {
+const show = ({ api, state, props }) => (event) => {
+  const defaultDelay = 200;
+  const delay = event && event.type === "mouseenter" ? defaultDelay : 0;
   if (props.visible === "auto") {
     const { clientWidth, scrollWidth } = state.referenceElm;
     if (scrollWidth <= clientWidth) {
@@ -9,7 +11,7 @@ const show = ({ api, state, props }) => () => {
     }
   }
   api.setExpectedState(true);
-  api.handleShowPopper();
+  api.handleShowPopper(delay);
 };
 const hide = (api) => () => {
   api.setExpectedState(false);
@@ -23,17 +25,18 @@ const handleBlur = ({ api, state }) => () => {
   state.focusing = false;
   api.hide();
 };
-const removeFocusing = (state) => () => {
+const removeFocusing = ({ api, state }) => () => {
   state.focusing = false;
+  api.show();
 };
-const handleShowPopper = ({ props, state }) => () => {
+const handleShowPopper = ({ props, state }) => (delay) => {
   if (!state.expectedState || props.manual) {
     return;
   }
   clearTimeout(state.timeout);
   state.timeout = setTimeout(() => {
     state.showPopper = true;
-  }, props.openDelay);
+  }, props.openDelay || delay);
   if (props.hideAfter > 0) {
     state.timeoutPending = setTimeout(() => {
       state.showPopper = false;
@@ -53,6 +56,19 @@ const handleClosePopper = ({ api, props, state }) => () => {
     api.doDestroy();
   }
 };
+const handleDocumentClick = ({ props, api, state, popperVmRef }) => (event) => {
+  if (props.manual)
+    return;
+  const reference = state.referenceElm;
+  const $el = popperVmRef.popper;
+  if (!$el || !reference || $el.contains(event.target) || reference.contains(event.target)) {
+    return;
+  }
+  if (state.showPopper) {
+    api.setExpectedState(false);
+    api.debounceClose();
+  }
+};
 const setExpectedState = ({ api, state }) => (value) => {
   if (state.expectedState === false) {
     clearTimeout(api.timeoutPending);
@@ -63,12 +79,18 @@ const destroyed = ({ state, api }) => () => {
   const reference = state.referenceElm;
   state.showPopper = false;
   if (reference && reference.nodeType === 1) {
+    off(document, "click", api.handleDocumentClick);
     off(reference, "mouseenter", api.show);
     off(reference, "mouseleave", api.hide);
     off(reference, "focus", api.focusHandler);
     off(reference, "blur", api.handleBlur);
     off(reference, "click", api.removeFocusing);
   }
+  state.poppers.forEach((popper, i) => {
+    typeof popper.$destroy === "function" && popper.$destroy();
+    state.poppers[i] = null;
+  });
+  state.poppers.length = 0;
 };
 const debounceClose = ({ api, props }) => debounce(props.closeDelay, () => {
   api.handleClosePopper();
@@ -106,12 +128,20 @@ const bindEvent = ({ api, state, vm }) => (reference) => {
   state.referenceElm = referenceElm;
   referenceElm.setAttribute("aria-describedby", state.tooltipId);
   referenceElm.setAttribute("tabindex", state.tabindex);
+  on(document, "click", api.handleDocumentClick);
   on(referenceElm, "mouseenter", api.show);
   on(referenceElm, "mouseleave", api.hide);
   on(referenceElm, "focus", api.focusHandler);
   on(referenceElm, "blur", api.handleBlur);
   on(referenceElm, "click", api.removeFocusing);
 };
+const observeCallback = ({ state, popperVmRef }) => (mutationsList) => {
+  for (let mutation of mutationsList) {
+    if (mutation.type === "attributes" && mutation.attributeName === "x-placement") {
+      state.xPlacement = popperVmRef.popper.getAttribute("x-placement") || "bottom";
+    }
+  }
+};
 const bindPopper = ({ vm, refs, nextTick, popperVmRef }) => (el) => {
   nextTick(() => vm.bindEvent(el));
   if (vm.popperVM) {
@@ -128,26 +158,6 @@ const bindPopper = ({ vm, refs, nextTick, popperVmRef }) => (el) => {
     });
   }
 };
-const observeCallback = ({ state, popperVmRef }) => (mutationsList) => {
-  for (let mutation of mutationsList) {
-    if (mutation.type === "attributes" && mutation.attributeName === "x-placement") {
-      state.xPlacement = popperVmRef.popper.getAttribute("x-placement") || "bottom";
-    }
-  }
-};
-const handleDocumentClick = ({ props, api, state, popperVmRef }) => (event) => {
-  if (props.manual)
-    return;
-  const reference = state.referenceElm;
-  const $el = popperVmRef.popper;
-  if (!$el || !reference || $el.contains(event.target) || reference.contains(event.target)) {
-    return;
-  }
-  if (state.showPopper) {
-    api.setExpectedState(false);
-    api.debounceClose();
-  }
-};
 export {
   bindEvent,
   bindPopper,

package/tooltip/vue.js

@@ -66,7 +66,7 @@ const renderless = (props, { watch, toRefs, reactive, onBeforeUnmount, onDeactiv
     destroyed: destroyed({ state, api: api2 }),
     bindPopper: bindPopper({ vm, refs, nextTick, popperVmRef }),
     watchFocusing: watchFocusing(state),
-    removeFocusing: removeFocusing(state),
+    removeFocusing: removeFocusing({ api: api2, state }),
     handleBlur: handleBlur({ api: api2, state }),
     handleFocus: handleFocus({ api: api2, state }),
     debounceClose: debounceClose({ api: api2, props }),

package/tree/index.js

@@ -354,7 +354,7 @@ const initTabIndex = ({ vm, state }) => () => {
 };
 const handleKeydown = ({ vm, state }) => (event2) => {
   const currentItem = event2.target;
-  if (!currentItem.className.includes("tiny-tree-node")) {
+  if (!JSON.stringify(currentItem.className).includes("tiny-tree-node")) {
     return;
   }
   const keyCode = event2.keyCode;

package/user-head/vue.js

@@ -1,5 +1,12 @@
 import "../chunk-PKUHTIDK.js";
-import { computedMessage, computedStyle, computedFontSize, computedLabel, getInternalValue, computedSize } from "./index";
+import {
+  computedMessage,
+  computedStyle,
+  computedFontSize,
+  computedLabel,
+  getInternalValue,
+  computedSize
+} from "./index";
 const api = ["state"];
 const renderless = (props, { reactive, computed }) => {
   const api2 = {