@opentiny/vue-renderless 3.11.0-alpha.0 → 3.11.1

package/anchor/index.js

@@ -30,10 +30,13 @@ const updateSkidPosition = ({ vm, state, emit }) => {
   const { currentLink } = state;
   const activeEl = vm.$refs[currentLink];
   const { skidRef, maskRef, anchorRef } = vm.$refs;
-  if (!activeEl || !anchorRef) {
+  if (!activeEl) {
     return;
   }
   emit("onChange", currentLink);
+  if (!anchorRef || !skidRef || !maskRef) {
+    return;
+  }
   const { offsetHeight, offsetWidth } = activeEl;
   const { top: linkTitleClientTop, left: linkTitleClientLeft } = activeEl.getBoundingClientRect();
   const { top: anchorClientTop, left: anchorClientLeft } = anchorRef.getBoundingClientRect();

package/color-picker/alpha-select/index.js

@@ -1,8 +1,6 @@
 import "../../chunk-G2ADBYYC.js";
 const calcLeftByAlpha = (wrapper, thumb, alpha) => {
-  return Math.round(
-    alpha * (wrapper.offsetWidth - thumb.offsetWidth / 2) / 100
-  );
+  return Math.round(alpha * (wrapper.offsetWidth - thumb.offsetWidth / 2) / 100);
 };
 const updateThumb = (alpha, thumb, wrapper) => {
   thumb.style.left = `${calcLeftByAlpha(wrapper, thumb, alpha)}px`;
@@ -13,9 +11,7 @@ const onDrag = (event, bar, thumb, alpha) => {
   let left = clientX - rect.left;
   left = Math.max(thumb.value.offsetWidth / 2, left);
   left = Math.min(left, rect.width - thumb.value.offsetWidth / 2);
-  alpha.value = Math.round(
-    (left - thumb.value.offsetWidth / 2) / (rect.width - thumb.value.offsetWidth) * 100
-  );
+  alpha.value = Math.round((left - thumb.value.offsetWidth / 2) / (rect.width - thumb.value.offsetWidth) * 100);
 };
 export {
   calcLeftByAlpha,

package/color-picker/alpha-select/vue.js

@@ -14,13 +14,16 @@ const renderless = (props, context, { emit }) => {
   const alphaWrapper = context.ref();
   const alphaThumb = context.ref();
   const alpha = context.ref(color.get("a"));
-  context.watch(() => props.color, (hex2) => {
-    color.reset(hex2);
-    const [rr2, gg2, bb2] = color.getRGB();
-    r.value = rr2;
-    g.value = gg2;
-    b.value = bb2;
-  });
+  context.watch(
+    () => props.color,
+    (hex2) => {
+      color.reset(hex2);
+      const [rr2, gg2, bb2] = color.getRGB();
+      r.value = rr2;
+      g.value = gg2;
+      b.value = bb2;
+    }
+  );
   context.watch(alpha, (newAlpha) => {
     updateThumb(newAlpha, alphaThumb.value, alphaWrapper.value);
     emit("alpha-update", alpha.value);
@@ -34,7 +37,6 @@ const renderless = (props, context, { emit }) => {
   });
   const api2 = {
     state,
-    color: props.color,
     slider,
     alphaWrapper,
     alphaThumb

package/color-picker/color-select/index.js

@@ -18,9 +18,7 @@ const updatePosition = (event, rect, cursor) => {
 const calcSaturation = (x, width) => x / width;
 const calcBrightness = (y, height) => 100 - y / height * 100;
 const getThumbTop = (wrapper, thumb, hue) => {
-  return Math.round(
-    hue * (wrapper.offsetHeight - thumb.offsetHeight / 2) / 360
-  );
+  return Math.round(hue * (wrapper.offsetHeight - thumb.offsetHeight / 2) / 360);
 };
 const resetCursor = (s, v, wrapper, cursor, thumb, color, h) => {
   const { width, height } = wrapper.value.getBoundingClientRect();
@@ -53,9 +51,7 @@ const updateThumb = (bar, thumb, h, emit) => {
     top = Math.min(top, rect.height - thumb.value.offsetHeight / 2);
     top = Math.max(thumb.value.offsetHeight / 2, top);
     thumb.value.style.top = `${top}px`;
-    h.value = Math.round(
-      (top - thumb.value.offsetHeight / 2) / (rect.height - thumb.value.offsetHeight) * 360
-    );
+    h.value = Math.round((top - thumb.value.offsetHeight / 2) / (rect.height - thumb.value.offsetHeight) * 360);
     emit("hue-update", h.value);
   };
 };

package/color-picker/color-select/vue.js

@@ -1,12 +1,7 @@
 import "../../chunk-G2ADBYYC.js";
 import { draggable } from "../utils/use-drag";
 import Color from "../utils/color";
-import {
-  getThumbTop,
-  resetCursor,
-  updateThumb,
-  updateCursor
-} from "./index";
+import { getThumbTop, resetCursor, updateThumb, updateCursor } from "./index";
 const api = ["state", "cursor", "wrapper", "bar", "thumb"];
 const renderless = (props, context, { emit }) => {
   const cursor = context.ref();
@@ -22,10 +17,13 @@ const renderless = (props, context, { emit }) => {
     background
   });
   const api2 = { state, cursor, wrapper, bar, thumb };
-  context.watch(() => props.color, (newColor) => {
-    color.reset(newColor);
-    resetCursor(color.get("s"), color.get("v"), wrapper, cursor, thumb, color, h);
-  });
+  context.watch(
+    () => props.color,
+    (newColor) => {
+      color.reset(newColor);
+      resetCursor(color.get("s"), color.get("v"), wrapper, cursor, thumb, color, h);
+    }
+  );
   context.onMounted(() => {
     const update = {
       thumb: updateThumb(bar, thumb, h, emit),
@@ -33,15 +31,7 @@ const renderless = (props, context, { emit }) => {
     };
     const thumbTop = getThumbTop(wrapper.value, thumb.value, h.value);
     thumb.value.style.top = `${thumbTop}px`;
-    resetCursor(
-      color.get("s"),
-      color.get("v"),
-      wrapper,
-      cursor,
-      thumb,
-      color,
-      h
-    );
+    resetCursor(color.get("s"), color.get("v"), wrapper, cursor, thumb, color, h);
     draggable(wrapper.value, {
       drag(event) {
         update.cursor(color, event);

package/color-picker/vue.js

@@ -52,8 +52,7 @@ const renderless = (props, context, { emit }) => {
     onConfirm: onConfirm(hex, triggerBg, res, emit, isShow),
     onCancel: onCancel(res, triggerBg, emit, isShow, hex, color),
     onAlphaUpdate: update,
-    cursor,
-    alpha: props.alpha
+    cursor
   };
   return api2;
 };

package/color-select-panel/alpha-select/index.js

@@ -1,8 +1,6 @@
 import "../../chunk-G2ADBYYC.js";
 const calcLeftByAlpha = (wrapper, thumb, alpha) => {
-  return Math.round(
-    alpha * (wrapper.offsetWidth - thumb.offsetWidth / 2) / 100
-  );
+  return Math.round(alpha * (wrapper.offsetWidth - thumb.offsetWidth / 2) / 100);
 };
 const updateThumb = (alpha, thumb, wrapper) => {
   thumb.style.left = `${calcLeftByAlpha(wrapper, thumb, alpha)}px`;
@@ -13,9 +11,7 @@ const onDrag = (event, bar, thumb, alpha) => {
   let left = clientX - rect.left;
   left = Math.max(thumb.value.offsetWidth / 2, left);
   left = Math.min(left, rect.width - thumb.value.offsetWidth / 2);
-  alpha.value = Math.round(
-    (left - thumb.value.offsetWidth / 2) / (rect.width - thumb.value.offsetWidth) * 100
-  );
+  alpha.value = Math.round((left - thumb.value.offsetWidth / 2) / (rect.width - thumb.value.offsetWidth) * 100);
 };
 export {
   calcLeftByAlpha,

package/color-select-panel/alpha-select/vue.js

@@ -14,14 +14,17 @@ const renderless = (props, context, { emit }) => {
   const alphaWrapper = context.ref();
   const alphaThumb = context.ref();
   const alpha = context.ref(color.get("a"));
-  context.watch(() => props.color, (hex2) => {
-    color.reset(hex2);
-    const [rr2, gg2, bb2] = color.getRGB();
-    r.value = rr2;
-    g.value = gg2;
-    b.value = bb2;
-    alpha.value = color.get("a");
-  });
+  context.watch(
+    () => props.color,
+    (hex2) => {
+      color.reset(hex2);
+      const [rr2, gg2, bb2] = color.getRGB();
+      r.value = rr2;
+      g.value = gg2;
+      b.value = bb2;
+      alpha.value = color.get("a");
+    }
+  );
   context.watch(alpha, (newAlpha) => {
     updateThumb(newAlpha, alphaThumb.value, alphaWrapper.value);
     emit("alpha-update", alpha.value);
@@ -35,7 +38,6 @@ const renderless = (props, context, { emit }) => {
   });
   const api2 = {
     state,
-    color: props.color,
     slider,
     alphaWrapper,
     alphaThumb

package/color-select-panel/hue-select/index.js

@@ -18,9 +18,7 @@ const updatePosition = (event, rect, cursor) => {
 const calcSaturation = (x, width) => x / width;
 const calcBrightness = (y, height) => 100 - y / height * 100;
 const getThumbTop = (wrapper, thumb, hue) => {
-  return Math.round(
-    hue * (wrapper.offsetHeight - thumb.offsetHeight / 2) / 360
-  );
+  return Math.round(hue * (wrapper.offsetHeight - thumb.offsetHeight / 2) / 360);
 };
 const resetCursor = (s, v, wrapper, cursor, thumb, color, h) => {
   const { width, height } = wrapper.value.getBoundingClientRect();
@@ -53,9 +51,7 @@ const updateThumb = (bar, thumb, h, emit) => {
     top = Math.min(top, rect.height - thumb.value.offsetHeight / 2);
     top = Math.max(thumb.value.offsetHeight / 2, top);
     thumb.value.style.top = `${top}px`;
-    h.value = Math.round(
-      (top - thumb.value.offsetHeight / 2) / (rect.height - thumb.value.offsetHeight) * 360
-    );
+    h.value = Math.round((top - thumb.value.offsetHeight / 2) / (rect.height - thumb.value.offsetHeight) * 360);
     emit("hue-update", h.value);
   };
 };

package/color-select-panel/hue-select/vue.js

@@ -1,12 +1,7 @@
 import "../../chunk-G2ADBYYC.js";
 import { draggable } from "../utils/use-drag";
 import Color from "../utils/color";
-import {
-  getThumbTop,
-  resetCursor,
-  updateThumb,
-  updateCursor
-} from "./index";
+import { getThumbTop, resetCursor, updateThumb, updateCursor } from "./index";
 const api = ["state", "cursor", "wrapper", "bar", "thumb"];
 const renderless = (props, context, { emit }) => {
   const cursor = context.ref();
@@ -22,10 +17,13 @@ const renderless = (props, context, { emit }) => {
     background
   });
   const api2 = { state, cursor, wrapper, bar, thumb };
-  context.watch(() => props.color, (newColor) => {
-    color.reset(newColor);
-    resetCursor(color.get("s"), color.get("v"), wrapper, cursor, thumb, color, h);
-  });
+  context.watch(
+    () => props.color,
+    (newColor) => {
+      color.reset(newColor);
+      resetCursor(color.get("s"), color.get("v"), wrapper, cursor, thumb, color, h);
+    }
+  );
   context.onMounted(() => {
     const update = {
       thumb: updateThumb(bar, thumb, h, emit),
@@ -33,15 +31,7 @@ const renderless = (props, context, { emit }) => {
     };
     const thumbTop = getThumbTop(wrapper.value, thumb.value, h.value);
     thumb.value.style.top = `${thumbTop}px`;
-    resetCursor(
-      color.get("s"),
-      color.get("v"),
-      wrapper,
-      cursor,
-      thumb,
-      color,
-      h
-    );
+    resetCursor(color.get("s"), color.get("v"), wrapper, cursor, thumb, color, h);
     draggable(wrapper.value, {
       drag(event) {
         update.cursor(color, event);

package/color-select-panel/index.js

@@ -4,7 +4,11 @@ const onConfirm = (hex, triggerBg, res, emit, stack, enableHistory) => {
     hex.value = res.value;
     triggerBg.value = res.value;
     if (enableHistory) {
-      const itemIdx = Math.max(stack.value.indexOf(res.value), stack.value.indexOf(res.value.toLowerCase()), stack.value.indexOf(res.value.toUpperCase()));
+      const itemIdx = Math.max(
+        stack.value.indexOf(res.value),
+        stack.value.indexOf(res.value.toLowerCase()),
+        stack.value.indexOf(res.value.toUpperCase())
+      );
       if (itemIdx !== -1) {
         stack.value.splice(itemIdx, 1);
       }

package/color-select-panel/vue.js

@@ -1,13 +1,6 @@
 import "../chunk-G2ADBYYC.js";
 import Color from "./utils/color";
-import {
-  onConfirm,
-  onCancel,
-  onHSVUpdate,
-  onAlphaUpdate,
-  handleHistoryClick,
-  handlePredefineClick
-} from ".";
+import { onConfirm, onCancel, onHSVUpdate, onAlphaUpdate, handleHistoryClick, handlePredefineClick } from ".";
 const api = [
   "state",
   "changeVisible",
@@ -19,8 +12,7 @@ const api = [
   "onCancel",
   "onAlphaUpdate",
   "onHistoryClick",
-  "onPredefineColorClick",
-  "alpha"
+  "onPredefineColorClick"
 ];
 const renderless = (props, context, { emit }) => {
   var _a, _b, _c, _d, _e, _f;
@@ -30,12 +22,8 @@ const renderless = (props, context, { emit }) => {
   const triggerBg = context.ref((_c = modelValue == null ? void 0 : modelValue.value) != null ? _c : "transparent");
   const isShow = context.ref((_d = visible == null ? void 0 : visible.value) != null ? _d : false);
   const cursor = context.ref();
-  const stack = context.ref(
-    [...(_e = history == null ? void 0 : history.value) != null ? _e : []]
-  );
-  const predefineStack = context.ref(
-    [...(_f = predefine == null ? void 0 : predefine.value) != null ? _f : []]
-  );
+  const stack = context.ref([...(_e = history == null ? void 0 : history.value) != null ? _e : []]);
+  const predefineStack = context.ref([...(_f = predefine == null ? void 0 : predefine.value) != null ? _f : []]);
   const enableHistory = history == null ? void 0 : history.value;
   const enablePredefineColor = predefine == null ? void 0 : predefine.value;
   const changeVisible = (state2) => {
@@ -54,12 +42,20 @@ const renderless = (props, context, { emit }) => {
     enableHistory,
     enablePredefineColor
   });
-  context.watch(predefine, (newPredefine) => {
-    predefineStack.value = [...newPredefine];
-  }, { deep: true });
-  context.watch(history, (newHistory) => {
-    stack.value = [...newHistory];
-  }, { deep: true });
+  context.watch(
+    predefine,
+    (newPredefine) => {
+      predefineStack.value = [...newPredefine];
+    },
+    { deep: true }
+  );
+  context.watch(
+    history,
+    (newHistory) => {
+      stack.value = [...newHistory];
+    },
+    { deep: true }
+  );
   context.watch(modelValue, (newValue) => {
     hex.value = newValue;
     res.value = newValue;
@@ -81,8 +77,7 @@ const renderless = (props, context, { emit }) => {
     onAlphaUpdate: update,
     onHistoryClick: handleHistoryClick(hex, res, color),
     onPredefineColorClick: handlePredefineClick(hex, res, color),
-    cursor,
-    alpha: props.alpha
+    cursor
   };
   return api2;
 };

package/common/deps/fastdom/singleton.js

@@ -64,7 +64,7 @@ class FastDom {
   }
   extend(props) {
     if (!props || typeof props !== "object")
-      throw new Error("[AUI][FastDom] expected object");
+      throw new Error("[TINY][FastDom] expected object");
     const child = Object.create(this);
     mixin(child, props);
     child.fastdom = this;

package/common/deps/popper.js

@@ -85,14 +85,17 @@ const getScrollParent = (el) => {
 };
 const getOffsetRectRelativeToCustomParent = (el, parent, fixed) => {
   let { top, left, width, height } = getBoundingClientRect(el);
-  let parentRect = getBoundingClientRect(parent);
   if (fixed) {
-    let { scrollTop, scrollLeft } = getScrollParent(parent);
-    parentRect.top += scrollTop;
-    parentRect.bottom += scrollTop;
-    parentRect.left += scrollLeft;
-    parentRect.right += scrollLeft;
+    return {
+      top,
+      left,
+      bottom: top + height,
+      right: left + width,
+      width,
+      height
+    };
   }
+  let parentRect = getBoundingClientRect(parent);
   let rect = {
     top: top - parentRect.top,
     left: left - parentRect.left,
@@ -137,6 +140,9 @@ const getAllScrollParents = (el, parents = []) => {
   const parent = el.parentNode;
   if (parent) {
     isScrollElement(parent) && parents.push(parent);
+    if (getStyleComputedProperty(parent, "position") === "fixed") {
+      return parents;
+    }
     return getAllScrollParents(parent, parents);
   }
   return parents;
@@ -483,10 +489,11 @@ class Popper {
       let isFixed2 = data.offsets.popper.position === "fixed";
       let scrollTop = isFixed2 ? 0 : getScrollTopValue(scrollParent);
       let scrollLeft = isFixed2 ? 0 : getScrollLeftValue(scrollParent);
+      const viewportWindow = PopupManager.viewportWindow || window;
       boundaries = {
         top: 0 - (offsetParentRect.top - scrollTop),
-        right: window.document.documentElement.clientWidth - (offsetParentRect.left - scrollLeft),
-        bottom: window.document.documentElement.clientHeight - (offsetParentRect.top - scrollTop),
+        right: viewportWindow.document.documentElement.clientWidth - (offsetParentRect.left - scrollLeft),
+        bottom: viewportWindow.document.documentElement.clientHeight - (offsetParentRect.top - scrollTop),
         left: 0 - (offsetParentRect.left - scrollLeft)
       };
     } else {

package/common/deps/popup-manager.js

@@ -30,6 +30,7 @@ const PopupManager = {
   // 当前是否有Modal
   popLockClass: "popup-parent--hidden",
   oldBodyBorder: "",
+  viewportWindow: null,
   fixBodyBorder() {
     const barWidth = window.innerWidth - document.documentElement.clientWidth;
     if (barWidth) {

package/common/event.js

@@ -13,6 +13,13 @@ const emitEvent = (emit, name, ...args) => {
   }
   return !cancel;
 };
+const getActualTarget = (e) => {
+  if (!e || !e.target) {
+    return null;
+  }
+  return e.target.shadowRoot && e.composed ? e.composedPath()[0] || e.target : e.target;
+};
 export {
-  emitEvent
+  emitEvent,
+  getActualTarget
 };

package/common/index.js

@@ -224,7 +224,7 @@ const CASCADER = {
   PropsHover: "hoverThreshold",
   MenuConnector: "cascader-menu-"
 };
-const version = "3.11.0-alpha.0";
+const version = "3.11.0";
 const log = (data, type = "log") => {
   uLog.logger[type](data);
 };

package/common/runtime.js

@@ -22,7 +22,7 @@ import vuePopup from "./deps/vue-popup";
 import validate from "./validate";
 import memorize from "./deps/memorize";
 import * as common from ".";
-const version = "3.11.0-alpha.0";
+const version = "3.11.0";
 const Renderless = {
   browser,
   array,

package/dialog-box/index.js

@@ -193,8 +193,8 @@ const handleDrag = ({ parent, props, state, emit }) => (event) => {
     }
     let offsetWidth = modalBoxElem.offsetWidth;
     let offsetHeight = modalBoxElem.offsetHeight;
-    let maxX = visibleWidth - offsetWidth;
-    let maxY = visibleHeight - offsetHeight;
+    let maxX = Math.max(visibleWidth - offsetWidth, 0);
+    let maxY = Math.max(visibleHeight - offsetHeight, 0);
     let left = event2.clientX - disX;
     let top = event2.clientY - disY;
     left = left < 0 ? 0 : left > maxX ? maxX : left;

package/form/index.js

@@ -24,6 +24,25 @@ const computedHideRequiredAsterisk = ({ props, designConfig }) => () => {
   var _a, _b;
   return (_b = (_a = props.hideRequiredAsterisk) != null ? _a : designConfig == null ? void 0 : designConfig.hideRequiredAsterisk) != null ? _b : false;
 };
+const computedValidateIcon = ({ props, designConfig }) => () => {
+  var _a, _b, _c;
+  return (_c = (_b = props.validateIcon) != null ? _b : (_a = designConfig == null ? void 0 : designConfig.icons) == null ? void 0 : _a.validateIcon) != null ? _c : null;
+};
+const computedIsErrorInline = ({ props, designConfig }) => () => {
+  if (props.messageType) {
+    return props.messageType === "inline";
+  }
+  if (typeof props.inlineMessage === "boolean") {
+    return props.inlineMessage;
+  }
+  return (designConfig == null ? void 0 : designConfig.messageType) === "inline" || false;
+};
+const computedIsErrorBlock = ({ props, designConfig }) => () => {
+  if (props.messageType) {
+    return props.messageType === "block";
+  }
+  return (designConfig == null ? void 0 : designConfig.messageType) === "block" || false;
+};
 const created = ({ parent, state }) => () => {
   parent.$on("form:addField", (field) => {
     if (field) {
@@ -166,6 +185,9 @@ export {
   clearValidate,
   computedAutoLabelWidth,
   computedHideRequiredAsterisk,
+  computedIsErrorBlock,
+  computedIsErrorInline,
+  computedValidateIcon,
   created,
   deregisterLabelWidth,
   getLabelWidthIndex,

package/form/vue.js

@@ -3,6 +3,9 @@ import {
   watchRules,
   computedAutoLabelWidth,
   computedHideRequiredAsterisk,
+  computedValidateIcon,
+  computedIsErrorInline,
+  computedIsErrorBlock,
   created,
   resetFields,
   clearValidate,
@@ -41,6 +44,9 @@ const renderless = (props, { computed, inject, provide, reactive, watch, onBefor
     potentialLabelWidthArr: [],
     autoLabelWidth: computed(() => api2.computedAutoLabelWidth()),
     hideRequiredAsterisk: computed(() => api2.computedHideRequiredAsterisk()),
+    validateIcon: computed(() => api2.computedValidateIcon()),
+    isErrorInline: computed(() => api2.computedIsErrorInline()),
+    isErrorBlock: computed(() => api2.computedIsErrorBlock()),
     isDisplayOnly: computed(() => props.displayOnly),
     hasRequired: computed(() => {
       if (props.rules) {
@@ -61,6 +67,9 @@ const renderless = (props, { computed, inject, provide, reactive, watch, onBefor
     updateTip: updateTip({ props, state }),
     computedAutoLabelWidth: computedAutoLabelWidth({ state }),
     computedHideRequiredAsterisk: computedHideRequiredAsterisk({ props, designConfig }),
+    computedValidateIcon: computedValidateIcon({ props, designConfig }),
+    computedIsErrorInline: computedIsErrorInline({ props, designConfig }),
+    computedIsErrorBlock: computedIsErrorBlock({ props, designConfig }),
     created: created({ parent, state }),
     resetFields: resetFields({ props, state }),
     clearValidate: clearValidate(state),

package/form-item/index.js

@@ -16,6 +16,27 @@ const watchValidateStatus = (state) => (value) => {
   state.validateState = value;
 };
 const computedGetValidateType = ({ props, state }) => () => props.validateType || (state.formInstance ? state.formInstance.validateType : "");
+const computedValidateIcon = ({ props, state }) => () => {
+  var _a, _b, _c, _d;
+  return (_d = (_c = props.validateIcon) != null ? _c : (_b = (_a = state == null ? void 0 : state.formInstance) == null ? void 0 : _a.state) == null ? void 0 : _b.validateIcon) != null ? _d : null;
+};
+const computedIsErrorInline = ({ props, state }) => () => {
+  var _a, _b, _c;
+  if (props.messageType) {
+    return props.messageType === "inline";
+  }
+  if (typeof props.inlineMessage === "boolean") {
+    return props.inlineMessage;
+  }
+  return (_c = (_b = (_a = state == null ? void 0 : state.formInstance) == null ? void 0 : _a.state) == null ? void 0 : _b.isErrorInline) != null ? _c : false;
+};
+const computedIsErrorBlock = ({ props, state }) => () => {
+  var _a, _b, _c;
+  if (props.messageType) {
+    return props.messageType === "block";
+  }
+  return (_c = (_b = (_a = state == null ? void 0 : state.formInstance) == null ? void 0 : _a.state) == null ? void 0 : _b.isErrorBlock) != null ? _c : false;
+};
 const computedLabelStyle = ({ props, state }) => () => {
   const result = { width: "" };
   if (state.form.labelPosition === POSITION.Top) {
@@ -343,8 +364,11 @@ export {
   computedFieldValue,
   computedForm,
   computedGetValidateType,
+  computedIsErrorBlock,
+  computedIsErrorInline,
   computedIsRequired,
   computedLabelStyle,
+  computedValidateIcon,
   computedValueStyle,
   getDisplayedValue,
   getFilteredRule,

package/form-item/vue.js

@@ -21,6 +21,9 @@ import {
   computedIsRequired,
   computedFieldValue,
   computedGetValidateType,
+  computedValidateIcon,
+  computedIsErrorInline,
+  computedIsErrorBlock,
   updateTip,
   wrapValidate,
   getDisplayedValue,
@@ -85,12 +88,15 @@ const initState = ({
     isDisplayOnly: computed(() => state.formInstance.displayOnly),
     labelPosition: computed(() => state.formInstance.labelPosition),
     hideRequiredAsterisk: computed(() => state.formInstance.state.hideRequiredAsterisk),
+    // isErrorInline: computed(() => state.formInstance.state.isErrorInline),
     labelSuffix: computed(() => state.formInstance.labelSuffix),
     labelWidth: computed(() => state.formInstance.labelWidth),
     showMessage: computed(() => state.formInstance.showMessage),
-    inlineMessage: computed(() => state.formInstance.inlineMessage),
     sizeClass: computed(() => state.formItemSize),
-    getValidateType: computed(() => api2.computedGetValidateType())
+    getValidateType: computed(() => api2.computedGetValidateType()),
+    validateIcon: computed(() => api2.computedValidateIcon()),
+    isErrorInline: computed(() => api2.computedIsErrorInline()),
+    isErrorBlock: computed(() => api2.computedIsErrorBlock())
   });
   return state;
 };
@@ -108,6 +114,9 @@ const initApi = ({ api: api2, state, dispatch, broadcast, refs, props, constants
     computedForm: computedForm({ constants, instance, state }),
     computedFieldValue: computedFieldValue({ props, state }),
     computedGetValidateType: computedGetValidateType({ props, state }),
+    computedValidateIcon: computedValidateIcon({ props, state }),
+    computedIsErrorInline: computedIsErrorInline({ props, state }),
+    computedIsErrorBlock: computedIsErrorBlock({ props, state }),
     clearValidate: clearValidate(state),
     getRules: getRules({ props, state }),
     updateComputedLabelWidth: updateComputedLabelWidth(state),

package/grid/utils/dom.js

@@ -1,6 +1,7 @@
 import "../../chunk-G2ADBYYC.js";
 import { getRowid } from "./common";
 import { hasClass } from "../../common/deps/dom";
+import { getActualTarget } from "../../common/event";
 import { arrayIndexOf } from "../static";
 const ATTR_NAME = "data-rowid";
 const CELL_CLS = ".tiny-grid-cell";
@@ -107,7 +108,7 @@ const getDomNode = () => {
 };
 const getEventTargetNode = (event, container, queryCls) => {
   let targetEl;
-  let target = event.target;
+  let target = getActualTarget(event);
   while (target && target.nodeType && target !== document) {
     if (queryCls && hasClass(target, queryCls)) {
       targetEl = target;