@opentiny/vue-renderless 3.9.1 → 3.9.3

package/checkbox/index.js

@@ -106,6 +106,14 @@ const getDisplayedValue = ({ vm, state, props }) => () => {
 };
 const computedIsDisplayOnly = ({ state, props }) => () => props.displayOnly || state.formDisplayOnly;
 const computedIsGroupDisplayOnly = ({ state }) => () => state.isGroup && (state.checkboxGroup.displayOnly || state.formDisplayOnly);
+const computedIsShowText = ({ props }) => () => props.text || props.label || !isNull(props.text) || !isNull(props.label);
+const computedShowText = ({ props }) => () => {
+  if (props.text || !isNull(props.text)) {
+    return props.text;
+  } else {
+    return props.label;
+  }
+};
 export {
   addToStore,
   computedCheckboxSize,
@@ -118,6 +126,8 @@ export {
   computedIsGroup,
   computedIsGroupDisplayOnly,
   computedIsLimitDisabled,
+  computedIsShowText,
+  computedShowText,
   computedStore,
   dispatchDisplayedValue,
   getDisplayedValue,

package/checkbox/vue.js

@@ -17,7 +17,9 @@ import {
   mounted,
   toggleEvent,
   dispatchDisplayedValue,
-  getDisplayedValue
+  getDisplayedValue,
+  computedIsShowText,
+  computedShowText
 } from "./index";
 const api = ["state", "handleChange", "computedStore"];
 const initState = ({ reactive, computed, parent, api: api2, inject, props }) => {
@@ -40,7 +42,9 @@ const initState = ({ reactive, computed, parent, api: api2, inject, props }) =>
     model: computed({
       get: () => api2.computedGetModelGet(),
       set: (value) => api2.computedGetModelSet(value)
-    })
+    }),
+    showText: computed(() => api2.computedShowText()),
+    isShowText: computed(() => api2.computedIsShowText())
   });
   return state;
 };
@@ -63,7 +67,9 @@ const initApi = ({ vm, api: api2, state, dispatch, props, parent, constants, for
     mounted: mounted({ emit, props, api: api2, parent }),
     handleChange: handleChange({ state, props, emit, nextTick, dispatch, constants }),
     dispatchDisplayedValue: dispatchDisplayedValue({ state, api: api2, dispatch }),
-    getDisplayedValue: getDisplayedValue({ state, props, vm })
+    getDisplayedValue: getDisplayedValue({ state, props, vm }),
+    computedIsShowText: computedIsShowText({ props }),
+    computedShowText: computedShowText({ props })
   });
 };
 const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject }, { vm, parent, emit, constants, nextTick, dispatch }) => {

package/checkbox-button/vue.js

@@ -10,7 +10,7 @@ import {
   computedIsDisabled,
   toggleEvent
 } from "./index";
-import { addToStore, computedIsChecked, computedStore, computedIsLimitDisabled } from "../checkbox";
+import { addToStore, computedIsChecked, computedStore, computedIsLimitDisabled, computedIsShowText, computedShowText } from "../checkbox";
 const api = ["state", "handleChange"];
 const initState = ({ reactive, computed, api: api2 }) => {
   const state = reactive({
@@ -27,7 +27,9 @@ const initState = ({ reactive, computed, api: api2 }) => {
     isDisabled: computed(() => api2.computedIsDisabled()),
     activeStyle: computed(() => api2.computedActiveStyle()),
     checkboxGroup: computed(() => api2.computedCheckboxGroup()),
-    isLimitDisabled: computed(() => api2.computedIsLimitDisabled())
+    isLimitDisabled: computed(() => api2.computedIsLimitDisabled()),
+    showText: computed(() => api2.computedShowText()),
+    isShowText: computed(() => api2.computedIsShowText())
   });
   return state;
 };
@@ -45,7 +47,9 @@ const initApi = ({ api: api2, state, props, formItemSize, parent, constants, emi
     computedGetModelGet: computedGetModelGet({ state, props }),
     computedCheckboxGroup: computedCheckboxGroup({ parent, constants }),
     handleChange: handleChange({ state, props, emit, nextTick, dispatch, constants }),
-    computedGetModelSet: computedGetModelSet({ state, props, emit, dispatch, constants })
+    computedGetModelSet: computedGetModelSet({ state, props, emit, dispatch, constants }),
+    computedIsShowText: computedIsShowText({ props }),
+    computedShowText: computedShowText({ props })
   });
 };
 const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive }, { parent, emit, dispatch, constants, nextTick }) => {

package/input/vue.js

@@ -91,7 +91,7 @@ const initState = ({ reactive, computed, mode, props, parent, constants }) => {
     validateIcon: computed(() => constants.VALIDATE_ICON[state.validateState]),
     showWordLimit: computed(() => props.showWordLimit && parent.$attrs.maxlength),
     inputDisabled: computed(
-      () => props.disabled || (parent.auiForm || {}).disabled || state.isDisplayOnly || (parent.tinyForm || {}).displayOnly
+      () => props.disabled || (parent.tinyForm || {}).disabled || state.isDisplayOnly || (parent.tinyForm || {}).displayOnly
     ),
     validateState: computed(() => parent.formItem ? parent.formItem.validateState : ""),
     textareaStyle: computed(() => __spreadProps(__spreadValues({}, state.textareaCalcStyle), {

package/ip-address/index.js

@@ -6,7 +6,9 @@ const ipValidator = ({ props, api }) => (value) => {
   let result = true;
   if (props.type) {
     if (api.isIP6(props.type)) {
-      result = typeof value === "string";
+      result = /^(((([\da-fA-F]{1,4}):){7}([\da-fA-F]{1,4}))|(((([\da-fA-F]{1,4}):){1,7}:)|((([\da-fA-F]{1,4}):){6}:([\da-fA-F]{1,4}))|((([\da-fA-F]{1,4}):){5}:(([\da-fA-F]{1,4}):)?([\da-fA-F]{1,4}))|((([\da-fA-F]{1,4}):){4}:(([\da-fA-F]{1,4}):){0,2}([\da-fA-F]{1,4}))|((([\da-fA-F]{1,4}):){3}:(([\da-fA-F]{1,4}):){0,3}([\da-fA-F]{1,4}))|((([\da-fA-F]{1,4}):){2}:(([\da-fA-F]{1,4}):){0,4}([\da-fA-F]{1,4}))|((([\da-fA-F]{1,4}):){1}:(([\da-fA-F]{1,4}):){0,5}([\da-fA-F]{1,4}))|(::(([\da-fA-F]{1,4}):){0,6}([\da-fA-F]{1,4}))|(::([\da-fA-F]{1,4})?))|(((([\da-fA-F]{1,4}):){6}(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))|((([\da-fA-F]{1,4}):){5}:(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))|((([\da-fA-F]{1,4}):){4}:(([\da-fA-F]{1,4}):)?(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))|((([\da-fA-F]{1,4}):){3}:(([\da-fA-F]{1,4}):){0,2}(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))|((([\da-fA-F]{1,4}):){2}:(([\da-fA-F]{1,4}):){0,3}(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))|(([\da-fA-F]{1,4})::(([\da-fA-F]{1,4}):){0,4}(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))|(::(([\da-fA-F]{1,4}):){0,5}(((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5]))\.){3}((1?[1-9]?\d)|(10\d)|(2[0-4]\d)|(25[0-5])))))$/.test(
+        value
+      );
     } else if (api.isIP4(props.type)) {
       result = /^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}$/.test(value);
     }
@@ -30,7 +32,13 @@ const getValue = ({ api, props, state }) => () => {
   const valueArr = [];
   let result = "";
   if (api.isIP6(props.type)) {
-    result = state.address[0].value || "";
+    state.address.forEach((item) => {
+      if (item.value) {
+        item.value = item.value.replace(/[^a-fA-F\d]/g, "");
+      }
+      item.value && valueArr.push(item.value);
+    });
+    result = state.address.filter((item) => item.value).length === 8 ? valueArr.join(":") : "";
   } else {
     state.address.forEach((item) => {
       if (api.isIP4(props.type) && item.value) {
@@ -46,13 +54,25 @@ const setValue = ({ api, props, state }) => (value) => {
   if (value) {
     if (api.ipValidator(value)) {
       if (api.isIP6(props.type)) {
-        state.address = [{ value }];
+        state.address = value.split(":").map((item) => ({ value: item }));
+        if (state.address.length < 8) {
+          let insertIndex = 0;
+          state.address.forEach((item, index) => {
+            if (item.value === "") {
+              item.value = "0000";
+              insertIndex = index;
+            }
+          });
+          for (var i = 0; i <= 8 - state.address.length; i++) {
+            state.address.splice(insertIndex, 0, { value: "0000" });
+          }
+        }
       } else {
         state.address = value.split(".").map((item) => ({ value: item }));
       }
     }
   } else {
-    state.address = api.isIP6(props.type) ? [{ value: "" }] : [{ value: "" }, { value: "" }, { value: "" }, { value: "" }];
+    state.address = api.isIP6(props.type) ? new Array(8).fill({ value: "" }) : new Array(4).fill({ value: "" });
   }
 };
 const activeEvent = ({ emit, parent, state, index, event, type }) => {
@@ -87,7 +107,11 @@ const inputEvent = ({ api, componentName, emit, eventName, props }) => ({ item,
       item.value = "";
     }
   } else {
-    item.value = val.replace(/[\u4E00-\u9FA5]/g, "");
+    if (!index && api.ipValidator(val)) {
+      api.setValue(val);
+    } else if (val.length > 4) {
+      item.value = item.value.slice(0, 4);
+    }
   }
   value = api.getValue();
   emit("update:modelValue", value, index);
@@ -125,15 +149,31 @@ const keyup = ({ api, props }) => ({ item, index, event }) => {
       return false;
     }
   }
+  if (api.isIP6(props.type)) {
+    if ([KEY_CODE.Tab, KEY_CODE.Space, KEY_CODE.NumpadDecimal, KEY_CODE.NumpadComma].includes(keyCode) && value) {
+      api.select({ index: nextIndex });
+      return false;
+    }
+    if ((value.length === 4 || value === "0000") && (!isNaN(event.key) || keyCode >= KEY_CODE.KeyA && keyCode <= KEY_CODE.KeyF)) {
+      api.focus({ index: nextIndex });
+      api.select({ index: nextIndex });
+      return false;
+    }
+  }
 };
 const checkError1 = ({ Tab, Space, NumpadDecimal, NumpadComma, keyCode, value }) => [Tab, Space, NumpadDecimal, NumpadComma].includes(keyCode) && value;
 const checkError2 = (newValue) => newValue && (isNaN(newValue) || newValue > IPTHRESHOLD.Max);
 const checkError3 = ({ isfilterKeyCodes, isSelected, value }) => !isfilterKeyCodes && !isSelected && value === "0";
 const checkError4 = ({ isfilterKeyCodes, isSelected, value, key }) => !isfilterKeyCodes && !isSelected && value + key > IPTHRESHOLD.Max;
 const checkError5 = ({ key, isfilterKeyCodes, value, ctrlKey, keyCode, KeyV }) => isNaN(key) && !isfilterKeyCodes && !(!value && ctrlKey && keyCode === KeyV);
-const isError = ({ key, value, isSelected, isfilterKeyCodes, ctrlKey, keyCode, newValue }) => {
-  const { Tab, Space, NumpadDecimal, NumpadComma, KeyV } = KEY_CODE;
-  return checkError1({ Tab, Space, NumpadDecimal, NumpadComma, keyCode, value }) || checkError2(newValue) || checkError3({ isfilterKeyCodes, isSelected, value }) || checkError4({ isfilterKeyCodes, isSelected, value, key }) || checkError5({ key, isfilterKeyCodes, value, ctrlKey, keyCode, KeyV });
+const checkError6 = ({ KeyA, KeyF, key, isfilterKeyCodes, value, keyCode }) => !(keyCode >= KeyA && keyCode <= KeyF) && isNaN(key) && !isfilterKeyCodes && value;
+const isError = ({ key, value, isSelected, isfilterKeyCodes, ctrlKey, keyCode, newValue, api, props }) => {
+  const { Tab, Space, KeyA, KeyF, NumpadDecimal, NumpadComma, KeyV } = KEY_CODE;
+  if (api.isIP4(props.type)) {
+    return checkError1({ Tab, Space, NumpadDecimal, NumpadComma, keyCode, value }) || checkError2(newValue) || checkError3({ isfilterKeyCodes, isSelected, value }) || checkError4({ isfilterKeyCodes, isSelected, value, key }) || checkError5({ key, isfilterKeyCodes, value, ctrlKey, keyCode, KeyV });
+  } else if (api.isIP6(props.type)) {
+    return checkError1({ Tab, Space, NumpadDecimal, NumpadComma, keyCode, value }) || checkError6({ KeyA, KeyF, key, isfilterKeyCodes, value, keyCode });
+  }
 };
 const keydown = ({ api, props, state }) => ({ item, index, event }) => {
   const { target, key, keyCode, ctrlKey } = event;
@@ -146,34 +186,34 @@ const keydown = ({ api, props, state }) => ({ item, index, event }) => {
   const nextIndex = index + 1;
   const lastIndex = index - 1;
   const newValue = isSelected && !isfilterKeyCodes && value.substr(0, selectionStart) + key + value.substr(selectionEnd);
-  if (api.isIP4(props.type)) {
-    state.isDel = keyCode === KEY_CODE.Backspace || keyCode === KEY_CODE.Delete;
-    if (keyCode === KEY_CODE.Backspace && cursorPosition === 0 && !selectionEnd) {
-      api.focus({ index: lastIndex });
-      return false;
-    }
-    if (keyCode === KEY_CODE.ArrowLeft && cursorPosition === 0) {
-      api.focus({ index: lastIndex });
-      event.preventDefault();
-      return false;
-    }
-    if (keyCode === KEY_CODE.ArrowRight && cursorPosition === value.length) {
-      api.focus({ index: nextIndex });
-      event.preventDefault();
-      return false;
-    }
-    if (isError({
-      key,
-      value,
-      isSelected,
-      isfilterKeyCodes,
-      ctrlKey,
-      keyCode,
-      newValue
-    })) {
-      event.preventDefault();
-      return false;
-    }
+  state.isDel = keyCode === KEY_CODE.Backspace || keyCode === KEY_CODE.Delete;
+  if (keyCode === KEY_CODE.Backspace && cursorPosition === 0 && !selectionEnd) {
+    api.focus({ index: lastIndex });
+    return false;
+  }
+  if (keyCode === KEY_CODE.ArrowLeft && cursorPosition === 0) {
+    api.focus({ index: lastIndex });
+    event.preventDefault();
+    return false;
+  }
+  if (keyCode === KEY_CODE.ArrowRight && cursorPosition === value.length) {
+    api.focus({ index: nextIndex });
+    event.preventDefault();
+    return false;
+  }
+  if (isError({
+    key,
+    value,
+    isSelected,
+    isfilterKeyCodes,
+    ctrlKey,
+    keyCode,
+    newValue,
+    api,
+    props
+  })) {
+    event.preventDefault();
+    return false;
   }
 };
 const getHeightOfSize = (size, isLineHeight = "height") => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/vue-renderless",
-  "version": "3.9.1",
+  "version": "3.9.3",
   "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
   "homepage": "https://opentiny.design/tiny-vue",
   "keywords": [

package/select/index.js

@@ -4,6 +4,7 @@ import {
 } from "../chunk-PKUHTIDK.js";
 import { find } from "../common/array";
 import { getObj, isEqual } from "../common/object";
+import { hasClass } from "../common/deps/dom";
 import { isKorean } from "../common/string";
 import scrollIntoView from "../common/deps/scroll-into-view";
 import PopupManager from "../common/deps/popup-manager";
@@ -231,37 +232,42 @@ const getResultOfSetSelected = ({ props, isGrid, isTree, api }) => {
   }
   return result;
 };
-const setSelected = ({ api, constants, nextTick, props, refs, state }) => () => {
+const setGridOrTreeSelected = ({ props, state, vm, isTree, api }) => () => {
+  if (!props.modelValue) {
+    state.selectedLabel = "";
+    state.selected = {};
+    state.currentKey = "";
+    vm.$refs.selectGrid && vm.$refs.selectGrid.clearRadioRow();
+    vm.$refs.selectTree && vm.$refs.selectTree.setCurrentKey && vm.$refs.selectTree.setCurrentKey(null);
+    return;
+  }
+  const isRemote = state.filterOrSearch && props.remote && typeof props.remoteMethod === "function";
+  const nestdata = isRemote ? state.remoteData : isTree ? api.getTreeData(state.treeData) : state.gridData;
+  const data = find(nestdata, (item) => props.modelValue == item[props.valueField]);
+  if (isEmptyObject(data)) {
+    return;
+  }
+  const obj = __spreadValues({}, data);
+  const label = data[props.textField];
+  obj.currentLabel = label;
+  state.selectedLabel = label;
+  state.selected = obj;
+  state.currentKey = data[props.valueField];
+};
+const setSelected = ({ api, constants, nextTick, props, vm, state }) => () => {
   const isTree = props.renderType === constants.TYPE.Tree;
   const isGrid = props.renderType === constants.TYPE.Grid;
   if (!props.multiple) {
     if (isGrid || isTree) {
-      if (!props.modelValue) {
-        state.selectedLabel = "";
-        state.selected = {};
-        state.currentKey = "";
-        refs.selectGrid && refs.selectGrid.clearRadioRow();
-        refs.selectTree && refs.selectTree.setCurrentKey && refs.selectTree.setCurrentKey(null);
-        return;
-      }
-      const isRemote = state.filterOrSearch && props.remote && typeof props.remoteMethod === "function";
-      const nestdata = isRemote ? state.remoteData : isTree ? api.getTreeData(state.treeData) : state.gridData;
-      const data = find(nestdata, (item) => props.modelValue == item[props.valueField]);
-      if (isEmptyObject(data)) {
-        return;
-      }
-      const obj = __spreadValues({}, data);
-      const label = data[props.textField];
-      obj.currentLabel = label;
-      state.selectedLabel = label;
-      state.selected = obj;
-      state.currentKey = data[props.valueField];
+      setGridOrTreeSelected({ props, state, vm, isTree, api });
     } else {
       const option = getOptionOfSetSelected({ api, props });
       nextTick(() => {
         state.selected = option;
         state.selectedLabel = option.state.currentLabel || option.currentLabel;
-        props.filterable && (state.query = state.selectedLabel);
+        if (state.filterOrSearch && !props.shape && !props.allowCreate) {
+          state.query = state.selectedLabel;
+        }
       });
     }
     return;
@@ -269,7 +275,7 @@ const setSelected = ({ api, constants, nextTick, props, refs, state }) => () =>
   const result = getResultOfSetSelected({ props, isGrid, isTree, api });
   state.selectCls = result.length ? result.length === state.options.length ? "checked-sur" : "halfselect" : "check";
   state.selected = result;
-  refs.selectTree && refs.selectTree.setCheckedNodes && refs.selectTree.setCheckedNodes(state.selected);
+  vm.$refs.selectTree && vm.$refs.selectTree.setCheckedNodes && vm.$refs.selectTree.setCheckedNodes(state.selected);
   state.tips = state.selected.map((item) => item.state ? item.state.currentLabel : item.currentLabel).join(",");
   nextTick(api.resetInputHeight);
 };
@@ -410,8 +416,9 @@ const resetInputHeight = ({ constants, nextTick, props, refs, state }) => () =>
     if (!refs.reference) {
       return;
     }
-    let inputChildNodes = refs.reference.$el.childNodes;
-    let input = [].filter.call(inputChildNodes, (item) => item.tagName === "INPUT")[0];
+    const inputChildNodes = refs.reference.$el.childNodes;
+    const inputContainer = [].filter.call(inputChildNodes, (item) => hasClass(item, "tiny-input-display-only"))[0];
+    const input = inputContainer && inputContainer.querySelector("input");
     const tags = refs.tags;
     if (!input) {
       return;
@@ -1288,6 +1295,7 @@ export {
   scrollToOption,
   selectChange,
   selectOption,
+  setGridOrTreeSelected,
   setSelected,
   setSoftFocus,
   showTip,

package/select/vue.js

@@ -223,14 +223,14 @@ const initState = ({ reactive, computed, props, api: api2, emitter, parent, cons
 };
 const addApi = ({ api: api2, props, state, refs, emit, constants, parent, nextTick, dispatch, vm, designConfig }) => {
   Object.assign(api2, {
-    resetInputHeight: resetInputHeight({ api: api2, constants, nextTick, props, refs, state }),
+    resetInputHeight: resetInputHeight({ constants, nextTick, props, refs, state }),
     calcOverFlow: calcOverFlow({ refs, props, state }),
     handleFocus: handleFocus({ api: api2, emit, props, state }),
     deleteTag: deleteTag({ api: api2, constants, emit, props, vm, state }),
     watchValue: watchValue({ api: api2, constants, dispatch, props, refs, state }),
     toHide: toHide({ constants, state, props, vm, api: api2 }),
     toVisible: toVisible({ constants, state, props, vm, api: api2, nextTick }),
-    setSelected: setSelected({ api: api2, constants, nextTick, props, refs, state }),
+    setSelected: setSelected({ api: api2, constants, nextTick, props, vm, state }),
     selectOption: selectOption({ api: api2, state, props }),
     handleResize: handleResize({ api: api2, props }),
     watchOptions: watchOptions({ api: api2, constants, nextTick, parent, props, state }),
@@ -327,27 +327,37 @@ const initApi = ({
 };
 const addWatch = ({ watch, props, api: api2, state }) => {
   watch(() => [...state.options], api2.watchOptions);
-  watch(() => state.gridData, api2.setSelected, { immediate: true });
-  watch(() => state.treeData, api2.setSelected, { immediate: true });
+  if (props.renderType === "grid") {
+    watch(() => state.gridData, api2.setSelected, { immediate: true });
+  }
+  if (props.renderType === "tree") {
+    watch(() => state.treeData, api2.setSelected, { immediate: true });
+  }
   watch(() => state.hoverIndex, api2.watchHoverIndex);
-  props.options && watch(() => props.options, api2.watchPropsOption, { immediate: true, deep: true });
+  if (props.options) {
+    watch(() => props.options, api2.watchPropsOption, { immediate: true, deep: true });
+  }
   watch(() => state.optimizeOpts, api2.watchOptimizeOpts);
 };
 const initWatch = ({ watch, props, api: api2, state, nextTick, refs }) => {
-  props.treeOp.data && watch(
-    () => props.treeOp.data,
-    (data) => {
-      state.treeData = data;
-    },
-    { immediate: true, deep: true }
-  );
-  props.gridOp.data && watch(
-    () => props.gridOp.data,
-    (data) => {
-      state.gridData = data;
-    },
-    { immediate: true, deep: true }
-  );
+  if (props.renderType === "tree" && props.treeOp.data) {
+    watch(
+      () => props.treeOp.data,
+      (data) => {
+        state.treeData = data;
+      },
+      { immediate: true, deep: true }
+    );
+  }
+  if (props.renderType === "grid" && props.gridOp.data) {
+    watch(
+      () => props.gridOp.data,
+      (data) => {
+        state.gridData = data;
+      },
+      { immediate: true, deep: true }
+    );
+  }
   watch(
     () => state.selectDisabled,
     () => nextTick(api2.resetInputHeight)