@opentinyvue/vue-cascader-mobile 2.21.0 → 3.21.0

package/lib/index.js

@@ -4,37 +4,41 @@ import { IconCheck, IconYes, IconLoading, IconCheckedSur, IconHalfselect, IconSe
 import Button from '@opentinyvue/vue-button';
 import ActionSheet from '@opentinyvue/vue-action-sheet';
 import Exception from '@opentinyvue/vue-exception';
+import { resolveComponent, openBlock, createElementBlock, createBlock, resolveDynamicComponent, normalizeClass, createCommentVNode, createElementVNode, renderSlot, toDisplayString, createVNode, withDirectives, withCtx, Fragment, renderList, vShow, vModelText, createTextVNode } from 'vue';
 import { t } from '@opentinyvue/vue-locale';
 
-function normalizeComponent(scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
-  var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
-  if (render) {
-    options.render = render;
-    options.staticRenderFns = staticRenderFns;
-    options._compiled = true;
+function _createForOfIteratorHelperLoose(r, e) {
+  var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (t) return (t = t.call(r)).next.bind(t);
+  if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
+    t && (r = t);
+    var o = 0;
+    return function() {
+      return o >= r.length ? { done: true } : { done: false, value: r[o++] };
+    };
   }
-  var hook;
-  if (injectStyles) {
-    hook = injectStyles;
-  }
-  if (hook) {
-    if (options.functional) {
-      options._injectStyles = hook;
-      var originalRender = options.render;
-      options.render = function renderWithStyleInjection(h, context) {
-        hook.call(context);
-        return originalRender(h, context);
-      };
-    } else {
-      var existing = options.beforeCreate;
-      options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
-    }
+  throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if ("string" == typeof r) return _arrayLikeToArray(r, a);
+    var t = {}.toString.call(r).slice(8, -1);
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
   }
-  return {
-    exports: scriptExports,
-    options
-  };
 }
+function _arrayLikeToArray(r, a) {
+  (null == a || a > r.length) && (a = r.length);
+  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+  return n;
+}
+var _export_sfc = function _export_sfc2(sfc, props) {
+  var target = sfc.__vccOpts || sfc;
+  for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
+    var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
+    target[key] = val;
+  }
+  return target;
+};
 
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function(n) {
@@ -45,77 +49,7 @@ function _extends() {
     return n;
   }, _extends.apply(null, arguments);
 }
-var render$1 = function render$12() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("div", {
-    staticClass: "flex items-start leading-5.5 py-3 cursor-pointer select-none",
-    on: {
-      "click": function click($event) {
-        return _vm.$emit("click", $event);
-      }
-    }
-  }, [_vm.multiple ? _c(_vm.selected ? "icon-checked-sur" : "icon-check", {
-    tag: "component",
-    class: ["flex-none mt-1 mr-2", _vm.selected ? "fill-color-brand" : "fill-color-icon-disabled"],
-    attrs: {
-      "custom-class": "w-4.5 h-4.5"
-    }
-  }) : _vm._e(), _c("div", {
-    class: ["flex-auto flex w-full text-sm", {
-      "truncate": _vm.ellipsis
-    }, {
-      "text-color-brand": !_vm.multiple && _vm.selected
-    }]
-  }, [_vm._t("default", function() {
-    return [_c("div", {
-      class: ["flex-auto", {
-        "truncate": _vm.ellipsis
-      }]
-    }, [_c("div", {
-      staticClass: "flex"
-    }, [_c("div", {
-      class: [{
-        "min-w-[theme(spacing.14)]": !_vm.textField3
-      }, {
-        "truncate": _vm.ellipsis
-      }]
-    }, [_vm._v(" " + _vm._s(_vm.data[_vm.textField]) + " ")]), _vm.textField2 ? _c("div", {
-      class: ["ml-5 text-color-text-placeholder", {
-        "truncate": _vm.ellipsis
-      }]
-    }, [_vm._v(" " + _vm._s(_vm.data[_vm.textField2]) + " ")]) : _vm._e()]), _vm.textField3 ? _c("div", {
-      class: ["text-color-text-placeholder", {
-        "truncate": _vm.ellipsis
-      }]
-    }, [_vm._v(" " + _vm._s(_vm.data[_vm.textField3]) + " ")]) : _vm._e()]), !_vm.loading && !_vm.multiple && _vm.selected ? _c("div", {
-      staticClass: "flex flex-none w-5 items-center justify-center ml-2"
-    }, [_c("IconYes", {
-      staticClass: "fill-color-brand",
-      attrs: {
-        "custom-class": "w-5 h-5"
-      }
-    })], 1) : _vm._e(), _vm.option.loading ? _c("div", {
-      staticClass: "flex flex-none w-5 items-center justify-center ml-2"
-    }, [_c("svg", {
-      staticClass: "animate-[spin_1.5s_linear_infinite] fill-current",
-      attrs: {
-        "viewBox": "25 25 50 50"
-      }
-    }, [_c("circle", {
-      staticClass: "stroke-color-brand tiny-loading-path",
-      attrs: {
-        "cx": "50",
-        "cy": "50",
-        "r": "24",
-        "fill": "none"
-      }
-    })])]) : _vm._e()];
-  })], 2)], 1);
-};
-var staticRenderFns$1 = [];
-var __vue2_script$1 = {
+var _sfc_main$1 = {
   emits: ["click"],
   components: {
     IconCheck: IconCheck(),
@@ -131,16 +65,109 @@ var __vue2_script$1 = {
     }
   }
 };
-var __cssModules$1 = {};
-var __component__$1 = /* @__PURE__ */ normalizeComponent(__vue2_script$1, render$1, staticRenderFns$1, false, __vue2_injectStyles$1);
-function __vue2_injectStyles$1(context) {
-  for (var o in __cssModules$1) {
-    this[o] = __cssModules$1[o];
-  }
+var _hoisted_1$1 = {
+  class: "flex"
+};
+var _hoisted_2$1 = {
+  key: 0,
+  class: "flex flex-none w-5 items-center justify-center ml-2"
+};
+var _hoisted_3$1 = {
+  key: 1,
+  class: "flex flex-none w-5 items-center justify-center ml-2"
+};
+var _hoisted_4$1 = /* @__PURE__ */ createElementVNode(
+  "svg",
+  {
+    class: "animate-[spin_1.5s_linear_infinite] fill-current",
+    viewBox: "25 25 50 50"
+  },
+  [/* @__PURE__ */ createElementVNode("circle", {
+    class: "stroke-color-brand tiny-loading-path",
+    cx: "50",
+    cy: "50",
+    r: "24",
+    fill: "none"
+  })],
+  -1
+  /* HOISTED */
+);
+var _hoisted_5$1 = [_hoisted_4$1];
+function _sfc_render$1(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_IconYes = resolveComponent("IconYes");
+  return openBlock(), createElementBlock("div", {
+    class: "flex items-start leading-5.5 py-3 cursor-pointer select-none",
+    onClick: _cache[0] || (_cache[0] = function($event) {
+      return _ctx.$emit("click", $event);
+    })
+  }, [$props2.multiple ? (openBlock(), createBlock(resolveDynamicComponent($props2.selected ? "icon-checked-sur" : "icon-check"), {
+    key: 0,
+    class: normalizeClass(["flex-none mt-1 mr-2", $props2.selected ? "fill-color-brand" : "fill-color-icon-disabled"]),
+    "custom-class": "w-4.5 h-4.5"
+  }, null, 8, ["class"])) : createCommentVNode("v-if", true), createElementVNode(
+    "div",
+    {
+      class: normalizeClass(["flex-auto flex w-full text-sm", {
+        "truncate": $props2.ellipsis
+      }, {
+        "text-color-brand": !$props2.multiple && $props2.selected
+      }])
+    },
+    [renderSlot(_ctx.$slots, "default", {}, function() {
+      return [createElementVNode(
+        "div",
+        {
+          class: normalizeClass(["flex-auto", {
+            "truncate": $props2.ellipsis
+          }])
+        },
+        [createElementVNode("div", _hoisted_1$1, [createElementVNode(
+          "div",
+          {
+            class: normalizeClass([{
+              "min-w-[theme(spacing.14)]": !$props2.textField3
+            }, {
+              "truncate": $props2.ellipsis
+            }])
+          },
+          toDisplayString($options.data[$props2.textField]),
+          3
+          /* TEXT, CLASS */
+        ), $props2.textField2 ? (openBlock(), createElementBlock(
+          "div",
+          {
+            key: 0,
+            class: normalizeClass(["ml-5 text-color-text-placeholder", {
+              "truncate": $props2.ellipsis
+            }])
+          },
+          toDisplayString($options.data[$props2.textField2]),
+          3
+          /* TEXT, CLASS */
+        )) : createCommentVNode("v-if", true)]), $props2.textField3 ? (openBlock(), createElementBlock(
+          "div",
+          {
+            key: 0,
+            class: normalizeClass(["text-color-text-placeholder", {
+              "truncate": $props2.ellipsis
+            }])
+          },
+          toDisplayString($options.data[$props2.textField3]),
+          3
+          /* TEXT, CLASS */
+        )) : createCommentVNode("v-if", true)],
+        2
+        /* CLASS */
+      ), !$props2.loading && !$props2.multiple && $props2.selected ? (openBlock(), createElementBlock("div", _hoisted_2$1, [createVNode(_component_IconYes, {
+        "custom-class": "w-5 h-5",
+        class: "fill-color-brand"
+      })])) : createCommentVNode("v-if", true), $props2.option.loading ? (openBlock(), createElementBlock("div", _hoisted_3$1, _hoisted_5$1)) : createCommentVNode("v-if", true)];
+    })],
+    2
+    /* CLASS */
+  )]);
 }
-var Option = /* @__PURE__ */ function() {
-  return __component__$1.exports;
-}();
+var Option = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 var $constants = {
   defaultNodeConfig: {
     lazy: false,
@@ -157,7 +184,7 @@ var $constants = {
     filterNodeMethod: null
   }
 };
-var __vue2_script = defineComponent({
+var _sfc_main = defineComponent({
   name: $prefix + "CascaderMobile",
   emits: ["click", "search-click", "node-expand", "close", "update:modelValue", "confirm", "update:visible", "update:text"],
   components: {
@@ -250,290 +277,324 @@ var __vue2_script = defineComponent({
     });
   }
 });
-var render = function render2() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("div", {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.visible,
-      expression: "visible"
-    }],
-    attrs: {
-      "data-tag": "tiny-cascader-mobile"
-    }
-  }, [_c("tiny-action-sheet", {
-    attrs: {
-      "tiny_mode": "mobile-first",
-      "title": _vm.title,
+var _hoisted_1 = {
+  "data-tag": "tiny-cascader-mobile"
+};
+var _hoisted_2 = {
+  class: "h-11 flex-none flex items-center border-b-0.5 border-color-border-separator overflow-auto whitespace-nowrap scrollbar-size-0"
+};
+var _hoisted_3 = {
+  class: "px-4 flex"
+};
+var _hoisted_4 = {
+  key: 0,
+  class: "px-2 text-color-text-placeholder"
+};
+var _hoisted_5 = ["onClick"];
+var _hoisted_6 = /* @__PURE__ */ createElementVNode(
+  "div",
+  {
+    class: "flex-auto"
+  },
+  null,
+  -1
+  /* HOISTED */
+);
+var _hoisted_7 = {
+  "data-tag": "search-header",
+  class: "flex leading-6 pt-4 pb-4 px-4 text-base items-center"
+};
+var _hoisted_8 = {
+  class: "flex-auto flex items-center h-8 py-1 px-3 bg-color-bg-4 rounded-full"
+};
+var _hoisted_9 = ["placeholder"];
+var _hoisted_10 = {
+  class: "flex items-center pl-3 cursor-pointer"
+};
+var _hoisted_11 = {
+  "data-tag": "tabs",
+  class: "flex-auto"
+};
+var _hoisted_12 = {
+  "data-tag": "search-box",
+  class: "flex flex-col flex-auto"
+};
+var _hoisted_13 = {
+  "data-tag": "search-body",
+  class: "flex-auto overflow-auto flex flex-col"
+};
+var _hoisted_14 = {
+  class: /* @__PURE__ */ normalizeClass(["flex flex-col px-4"])
+};
+var _hoisted_15 = {
+  key: 0,
+  class: "text-color-brand"
+};
+var _hoisted_16 = {
+  class: "w-full flex justify-center items-center text-center flex-auto"
+};
+function _sfc_render(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_IconSearch = resolveComponent("IconSearch");
+  var _component_tiny_option = resolveComponent("tiny-option");
+  var _component_tiny_exception = resolveComponent("tiny-exception");
+  var _component_tiny_button = resolveComponent("tiny-button");
+  var _component_tiny_action_sheet = resolveComponent("tiny-action-sheet");
+  return withDirectives((openBlock(), createElementBlock(
+    "div",
+    _hoisted_1,
+    [createVNode(_component_tiny_action_sheet, {
+      tiny_mode: "mobile-first",
+      title: _ctx.title,
       "show-footer": "",
-      "visible": _vm.state.toggle,
-      "show-header": !_vm.state.search.show,
+      visible: _ctx.state.toggle,
+      "onUpdate:visible": _cache[4] || (_cache[4] = function($event) {
+        return _ctx.$emit("update:visible", $event);
+      }),
+      onClose: _ctx.close,
+      "show-header": !_ctx.state.search.show,
       "custom-class": ["min-h-[95%] pb-4"]
-    },
-    on: {
-      "update:visible": function updateVisible($event) {
-        return _vm.$emit("update:visible", $event);
-      },
-      "close": _vm.close
-    },
-    scopedSlots: _vm._u([{
-      key: "body-top",
-      fn: function fn() {
-        return [_c("div", {
-          directives: [{
-            name: "show",
-            rawName: "v-show",
-            value: !_vm.state.search.show,
-            expression: "!state.search.show"
-          }],
-          staticClass: "h-11 flex-none flex items-center border-b-0.5 border-color-border-separator overflow-auto whitespace-nowrap scrollbar-size-0"
-        }, [_c("div", {
-          staticClass: "px-4 flex"
-        }, [_vm._l(_vm.state.computedNavList, function(option, index) {
-          return _c("div", {
-            key: index,
-            staticClass: "flex-none flex leading-5.5"
-          }, [index <= _vm.state.level ? [index !== 0 ? _c("span", {
-            staticClass: "px-2 text-color-text-placeholder"
-          }, [_vm._v("/")]) : _vm._e(), _c("span", {
-            class: ["flex-none max-w-[theme(spacing.24)] truncate", {
-              "text-color-brand": index === _vm.state.level
-            }, _vm.disabledNavOption(index, option) ? "text-color-text-disabled" : "cursor-pointer"],
-            on: {
-              "click": function click($event) {
-                return _vm.setLevel(index, option);
-              }
-            }
-          }, [_vm._v(_vm._s(option.data[_vm.textField]))])] : _vm._e()], 2);
-        }), _c("div", {
-          staticClass: "flex-auto"
-        })], 2)]), _c("div", {
-          directives: [{
-            name: "show",
-            rawName: "v-show",
-            value: _vm.state.search.show,
-            expression: "state.search.show"
-          }],
-          staticClass: "flex leading-6 pt-4 pb-4 px-4 text-base items-center",
-          attrs: {
-            "data-tag": "search-header"
-          }
-        }, [_c("div", {
-          staticClass: "flex-auto flex items-center h-8 py-1 px-3 bg-color-bg-4 rounded-full"
-        }, [_c("IconSearch", {
-          staticClass: "mr-1 fill-color-icon-disabled",
-          attrs: {
-            "custom-class": "h-4 w-4"
-          }
-        }), _c("input", {
-          directives: [{
-            name: "model",
-            rawName: "v-model",
-            value: _vm.state.search.input,
-            expression: "state.search.input"
-          }],
-          staticClass: "h-5 flex-auto text-xs bg-transparent outline-0",
-          attrs: {
-            "placeholder": _vm.t("ui.select.pleaseSearch")
-          },
-          domProps: {
-            "value": _vm.state.search.input
-          },
-          on: {
-            "input": [function($event) {
-              if ($event.target.composing) return;
-              _vm.$set(_vm.state.search, "input", $event.target.value);
-            }, _vm.searchMethod]
-          }
-        })], 1), _c("div", {
-          staticClass: "flex items-center pl-3 cursor-pointer"
-        }, [_c("div", {
-          on: {
-            "click": function click($event) {
-              return _vm.searchBoxToggle(false);
-            }
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.base.cancel")))])])])];
-      },
-      proxy: true
-    }, {
-      key: "header-left",
-      fn: function fn() {
-        return [!_vm.state.search.show ? _c("IconSearch", {
-          staticClass: "cursor-pointer",
-          attrs: {
-            "custom-class": "h-5 w-5"
-          },
-          on: {
-            "click": function click($event) {
-              return _vm.searchBoxToggle(true);
-            }
-          }
-        }) : _vm._e()];
-      },
-      proxy: true
-    }, {
-      key: "footer",
-      fn: function fn() {
-        return [_c("tiny-button", {
-          directives: [{
-            name: "show",
-            rawName: "v-show",
-            value: _vm.state.showButton,
-            expression: "state.showButton"
-          }],
-          staticClass: "flex-1 mx-4 sm:mx-0",
-          attrs: {
-            "tiny_mode": "mobile-first",
-            "type": "primary",
-            "reset-time": 0
-          },
-          on: {
-            "click": _vm.confirm
-          }
-        }, [_vm._v(_vm._s(_vm.t("ui.button.confirm")))])];
-      },
-      proxy: true
-    }])
-  }, [_c("div", {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: !_vm.state.search.show,
-      expression: "!state.search.show"
-    }],
-    staticClass: "flex-auto",
-    attrs: {
-      "data-tag": "tabs"
-    }
-  }, _vm._l(_vm.state.options, function(currentList, index) {
-    return _c("div", {
-      directives: [{
-        name: "show",
-        rawName: "v-show",
-        value: index === _vm.state.level,
-        expression: "index === state.level"
-      }],
-      key: index,
-      staticClass: "flex flex-col px-4 overflow-auto pt-2",
-      attrs: {
-        "data-tag": "tab-item"
-      }
-    }, _vm._l(currentList, function(item, itemIndex) {
-      return _c("tiny-option", {
-        key: item.data[_vm.valueField],
-        attrs: {
-          "multiple": _vm.multiple,
-          "ellipsis": _vm.ellipsis,
-          "text-field": _vm.textField,
-          "text-field2": _vm.textField2,
-          "text-field3": _vm.textField3,
-          "loading": _vm.state.loading,
-          "option": item,
-          "selected": _vm.isSelected(item)
-        },
-        on: {
-          "click": function click($event) {
-            return _vm.selectOption(item, $event);
-          }
-        }
-      }, [_vm._t("default", null, {
-        "item": item,
-        "index": itemIndex
-      })], 2);
-    }), 1);
-  }), 0), _c("div", {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.state.search.show,
-      expression: "state.search.show"
-    }],
-    staticClass: "flex flex-col flex-auto",
-    attrs: {
-      "data-tag": "search-box"
-    }
-  }, [_c("div", {
-    staticClass: "flex-auto overflow-auto flex flex-col",
-    attrs: {
-      "data-tag": "search-body"
-    }
-  }, [_c("div", {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.state.search.filterOptions.length,
-      expression: "state.search.filterOptions.length"
-    }],
-    class: ["flex flex-col px-4"]
-  }, _vm._l(_vm.state.search.filterOptions, function(item, index) {
-    return _c("tiny-option", {
-      key: index,
-      attrs: {
-        "multiple": _vm.multiple,
-        "ellipsis": _vm.ellipsis,
-        "text-field": _vm.textField,
-        "text-field2": _vm.textField2,
-        "text-field3": _vm.textField3,
-        "option": item,
-        "selected": _vm.isSelected(item)
-      },
-      on: {
-        "click": function click($event) {
-          return _vm.searchSelectHandler(item, index);
-        }
-      }
-    }, [_vm.searchConfig.openSearchSlot ? _vm._t("search-item", null, {
-      "item": item,
-      "index": index
-    }) : _vm._t("default", function() {
-      return [_c("div", {
-        class: ["flex-auto", {
-          "truncate": _vm.ellipsis
-        }]
-      }, _vm._l(_vm.renderSearchOption(item[_vm.textField]), function(text, textIndex) {
-        return _c("span", {
-          key: text
-        }, [textIndex ? _c("span", {
-          staticClass: "text-color-brand"
-        }, [_vm._v(_vm._s(_vm.state.search.input))]) : _vm._e(), _vm._v(_vm._s(text) + " ")]);
-      }), 0)];
     }, {
-      "item": item,
-      "index": index
-    })], 2);
-  }), 1), _c("div", {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.state.search.input && !_vm.state.search.filterOptions.length,
-      expression: "state.search.input && !state.search.filterOptions.length"
-    }],
-    staticClass: "w-full flex justify-center items-center text-center flex-auto"
-  }, [_c("tiny-exception", {
-    attrs: {
-      "component-page": "",
-      "type": "noresult",
-      "tiny_mode": "mobile-first",
-      "tiny_mode_root": ""
-    }
-  })], 1)])])])], 1);
-};
-var staticRenderFns = [];
-var __cssModules = {};
-var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles);
-function __vue2_injectStyles(context) {
-  for (var o in __cssModules) {
-    this[o] = __cssModules[o];
-  }
+      "body-top": withCtx(function() {
+        return [withDirectives(createElementVNode(
+          "div",
+          _hoisted_2,
+          [createElementVNode("div", _hoisted_3, [(openBlock(true), createElementBlock(
+            Fragment,
+            null,
+            renderList(_ctx.state.computedNavList, function(option, index) {
+              return openBlock(), createElementBlock("div", {
+                key: index,
+                class: "flex-none flex leading-5.5"
+              }, [index <= _ctx.state.level ? (openBlock(), createElementBlock(
+                Fragment,
+                {
+                  key: 0
+                },
+                [index !== 0 ? (openBlock(), createElementBlock("span", _hoisted_4, "/")) : createCommentVNode("v-if", true), createElementVNode("span", {
+                  class: normalizeClass(["flex-none max-w-[theme(spacing.24)] truncate", {
+                    "text-color-brand": index === _ctx.state.level
+                  }, _ctx.disabledNavOption(index, option) ? "text-color-text-disabled" : "cursor-pointer"]),
+                  onClick: function onClick($event) {
+                    return _ctx.setLevel(index, option);
+                  }
+                }, toDisplayString(option.data[_ctx.textField]), 11, _hoisted_5)],
+                64
+                /* STABLE_FRAGMENT */
+              )) : createCommentVNode("v-if", true)]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          )), _hoisted_6])],
+          512
+          /* NEED_PATCH */
+        ), [[vShow, !_ctx.state.search.show]]), withDirectives(createElementVNode(
+          "div",
+          _hoisted_7,
+          [createElementVNode("div", _hoisted_8, [createVNode(_component_IconSearch, {
+            "custom-class": "h-4 w-4",
+            class: "mr-1 fill-color-icon-disabled"
+          }), withDirectives(createElementVNode("input", {
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
+              return _ctx.state.search.input = $event;
+            }),
+            class: "h-5 flex-auto text-xs bg-transparent outline-0",
+            placeholder: _ctx.t("ui.select.pleaseSearch"),
+            onInput: _cache[1] || (_cache[1] = function() {
+              return _ctx.searchMethod && _ctx.searchMethod.apply(_ctx, arguments);
+            })
+          }, null, 40, _hoisted_9), [[vModelText, _ctx.state.search.input]])]), createElementVNode("div", _hoisted_10, [createElementVNode(
+            "div",
+            {
+              onClick: _cache[2] || (_cache[2] = function($event) {
+                return _ctx.searchBoxToggle(false);
+              })
+            },
+            toDisplayString(_ctx.t("ui.base.cancel")),
+            1
+            /* TEXT */
+          )])],
+          512
+          /* NEED_PATCH */
+        ), [[vShow, _ctx.state.search.show]])];
+      }),
+      "header-left": withCtx(function() {
+        return [!_ctx.state.search.show ? (openBlock(), createBlock(_component_IconSearch, {
+          key: 0,
+          "custom-class": "h-5 w-5",
+          class: "cursor-pointer",
+          onClick: _cache[3] || (_cache[3] = function($event) {
+            return _ctx.searchBoxToggle(true);
+          })
+        })) : createCommentVNode("v-if", true)];
+      }),
+      footer: withCtx(function() {
+        return [withDirectives(createVNode(_component_tiny_button, {
+          tiny_mode: "mobile-first",
+          class: "flex-1 mx-4 sm:mx-0",
+          type: "primary",
+          "reset-time": 0,
+          onClick: _ctx.confirm
+        }, {
+          default: withCtx(function() {
+            return [createTextVNode(
+              toDisplayString(_ctx.t("ui.button.confirm")),
+              1
+              /* TEXT */
+            )];
+          }),
+          _: 1
+          /* STABLE */
+        }, 8, ["onClick"]), [[vShow, _ctx.state.showButton]])];
+      }),
+      default: withCtx(function() {
+        return [withDirectives(createElementVNode(
+          "div",
+          _hoisted_11,
+          [(openBlock(true), createElementBlock(
+            Fragment,
+            null,
+            renderList(_ctx.state.options, function(currentList, index) {
+              return withDirectives((openBlock(), createElementBlock("div", {
+                "data-tag": "tab-item",
+                key: index,
+                class: "flex flex-col px-4 overflow-auto pt-2"
+              }, [(openBlock(true), createElementBlock(
+                Fragment,
+                null,
+                renderList(currentList, function(item, itemIndex) {
+                  return openBlock(), createBlock(_component_tiny_option, {
+                    key: item.data[_ctx.valueField],
+                    multiple: _ctx.multiple,
+                    ellipsis: _ctx.ellipsis,
+                    "text-field": _ctx.textField,
+                    "text-field2": _ctx.textField2,
+                    "text-field3": _ctx.textField3,
+                    loading: _ctx.state.loading,
+                    option: item,
+                    selected: _ctx.isSelected(item),
+                    onClick: function onClick($event) {
+                      return _ctx.selectOption(item, $event);
+                    }
+                  }, {
+                    default: withCtx(function() {
+                      return [renderSlot(_ctx.$slots, "default", {
+                        item,
+                        index: itemIndex
+                      })];
+                    }),
+                    _: 2
+                    /* DYNAMIC */
+                  }, 1032, ["multiple", "ellipsis", "text-field", "text-field2", "text-field3", "loading", "option", "selected", "onClick"]);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))])), [[vShow, index === _ctx.state.level]]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))],
+          512
+          /* NEED_PATCH */
+        ), [[vShow, !_ctx.state.search.show]]), withDirectives(createElementVNode(
+          "div",
+          _hoisted_12,
+          [createElementVNode("div", _hoisted_13, [withDirectives(createElementVNode(
+            "div",
+            _hoisted_14,
+            [(openBlock(true), createElementBlock(
+              Fragment,
+              null,
+              renderList(_ctx.state.search.filterOptions, function(item, index) {
+                return openBlock(), createBlock(_component_tiny_option, {
+                  key: index,
+                  multiple: _ctx.multiple,
+                  ellipsis: _ctx.ellipsis,
+                  "text-field": _ctx.textField,
+                  "text-field2": _ctx.textField2,
+                  "text-field3": _ctx.textField3,
+                  option: item,
+                  selected: _ctx.isSelected(item),
+                  onClick: function onClick($event) {
+                    return _ctx.searchSelectHandler(item, index);
+                  }
+                }, {
+                  default: withCtx(function() {
+                    return [_ctx.searchConfig.openSearchSlot ? renderSlot(_ctx.$slots, "search-item", {
+                      key: 0,
+                      item,
+                      index
+                    }) : renderSlot(_ctx.$slots, "default", {
+                      key: 1,
+                      item,
+                      index
+                    }, function() {
+                      return [createElementVNode(
+                        "div",
+                        {
+                          class: normalizeClass(["flex-auto", {
+                            "truncate": _ctx.ellipsis
+                          }])
+                        },
+                        [(openBlock(true), createElementBlock(
+                          Fragment,
+                          null,
+                          renderList(_ctx.renderSearchOption(item[_ctx.textField]), function(text, textIndex) {
+                            return openBlock(), createElementBlock("span", {
+                              key: text
+                            }, [textIndex ? (openBlock(), createElementBlock(
+                              "span",
+                              _hoisted_15,
+                              toDisplayString(_ctx.state.search.input),
+                              1
+                              /* TEXT */
+                            )) : createCommentVNode("v-if", true), createTextVNode(
+                              toDisplayString(text),
+                              1
+                              /* TEXT */
+                            )]);
+                          }),
+                          128
+                          /* KEYED_FRAGMENT */
+                        ))],
+                        2
+                        /* CLASS */
+                      )];
+                    })];
+                  }),
+                  _: 2
+                  /* DYNAMIC */
+                }, 1032, ["multiple", "ellipsis", "text-field", "text-field2", "text-field3", "option", "selected", "onClick"]);
+              }),
+              128
+              /* KEYED_FRAGMENT */
+            ))],
+            512
+            /* NEED_PATCH */
+          ), [[vShow, _ctx.state.search.filterOptions.length]]), withDirectives(createElementVNode(
+            "div",
+            _hoisted_16,
+            [createVNode(_component_tiny_exception, {
+              "component-page": "",
+              type: "noresult",
+              tiny_mode: "mobile-first",
+              tiny_mode_root: ""
+            })],
+            512
+            /* NEED_PATCH */
+          ), [[vShow, _ctx.state.search.input && !_ctx.state.search.filterOptions.length]])])],
+          512
+          /* NEED_PATCH */
+        ), [[vShow, _ctx.state.search.show]])];
+      }),
+      _: 3
+      /* FORWARDED */
+    }, 8, ["title", "visible", "onClose", "show-header"])],
+    512
+    /* NEED_PATCH */
+  )), [[vShow, _ctx.visible]]);
 }
-var CascaderMobile = /* @__PURE__ */ function() {
-  return __component__.exports;
-}();
-var version = "2.21.0";
+var CascaderMobile = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+var version = "3.21.0";
 CascaderMobile.model = {
   prop: "modelValue",
   event: "update:modelValue"

package/package.json

@@ -1,19 +1,19 @@
 {
   "name": "@opentinyvue/vue-cascader-mobile",
-  "version": "2.21.0",
+  "version": "3.21.0",
   "description": "",
   "main": "./lib/index.js",
   "module": "./lib/index.js",
   "sideEffects": false,
   "type": "module",
   "dependencies": {
-    "@opentinyvue/vue-button": "~2.21.0",
-    "@opentinyvue/vue-action-sheet": "~2.21.0",
-    "@opentinyvue/vue-exception": "~2.21.0",
-    "@opentinyvue/vue-common": "~2.21.0",
+    "@opentinyvue/vue-button": "~3.21.0",
+    "@opentinyvue/vue-action-sheet": "~3.21.0",
+    "@opentinyvue/vue-exception": "~3.21.0",
+    "@opentinyvue/vue-common": "~3.21.0",
     "@opentinyvue/vue-renderless": "~3.21.0",
-    "@opentinyvue/vue-icon": "~2.21.0",
-    "@opentinyvue/vue-locale": "~2.21.0"
+    "@opentinyvue/vue-icon": "~3.21.0",
+    "@opentinyvue/vue-locale": "~3.21.0"
   },
   "license": "MIT",
   "types": "index.d.ts",

package/src/mobile-first.vue.d.ts

@@ -1,2 +1,233 @@
-declare const _default: any;
+declare const _default: import("@vue/runtime-core").DefineComponent<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            defaultNodeConfig: {
+                lazy: boolean;
+                load: null;
+                isLeaf: string;
+                afterLoad: null;
+                currentNodeKey: null;
+                checkStrictly: boolean;
+                checkDescendants: null;
+                defaultCheckedKeys: null;
+                defaultExpandedKeys: null;
+                autoExpandParent: null;
+                defaultExpandAll: null;
+                filterNodeMethod: null;
+            };
+        };
+    };
+    data: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    modelValue: (StringConstructor | ArrayConstructor | NumberConstructor)[];
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    ellipsis: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    valueField: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: (StringConstructor | ArrayConstructor)[];
+        default: any;
+    };
+    childrenField: {
+        type: StringConstructor;
+        default: string;
+    };
+    textField: {
+        type: StringConstructor;
+        default: string;
+    };
+    textField2: {
+        type: StringConstructor;
+        default: string;
+    };
+    textField3: {
+        type: StringConstructor;
+        default: string;
+    };
+    title: StringConstructor;
+    textSplit: {
+        type: StringConstructor;
+        default: string;
+    };
+    showHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiple: BooleanConstructor;
+    searchConfig: {
+        type: ObjectConstructor;
+        default: () => {
+            options: never[];
+            searchMethod: null;
+            openSearchSlot: boolean;
+        };
+    };
+    nodeConfig: {
+        type: ObjectConstructor;
+        default: () => {
+            lazy: boolean;
+            load: null;
+            isLeaf: string;
+            afterLoad: null;
+            currentNodeKey: null;
+            checkStrictly: boolean;
+            checkDescendants: null;
+            defaultCheckedKeys: null;
+            defaultExpandedKeys: null;
+            autoExpandParent: null;
+            defaultExpandAll: null;
+            filterNodeMethod: null;
+        };
+    };
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}, {
+    t: (this: any, path: any, options?: any) => any;
+    vm: any;
+    f: (props: any, attrs?: {}) => {};
+    a: (attrs: any, filters: any, include: any) => {};
+    d: (props: any) => void;
+    dp: (props: any) => void;
+    gcls: (key: any) => any;
+    m: (...cssClasses: any[]) => string;
+}, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("click" | "close" | "update:modelValue" | "update:visible" | "confirm" | "node-expand" | "update:text" | "search-click")[], "click" | "close" | "update:modelValue" | "update:visible" | "confirm" | "node-expand" | "update:text" | "search-click", import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            defaultNodeConfig: {
+                lazy: boolean;
+                load: null;
+                isLeaf: string;
+                afterLoad: null;
+                currentNodeKey: null;
+                checkStrictly: boolean;
+                checkDescendants: null;
+                defaultCheckedKeys: null;
+                defaultExpandedKeys: null;
+                autoExpandParent: null;
+                defaultExpandAll: null;
+                filterNodeMethod: null;
+            };
+        };
+    };
+    data: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    modelValue: (StringConstructor | ArrayConstructor | NumberConstructor)[];
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    ellipsis: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    valueField: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: (StringConstructor | ArrayConstructor)[];
+        default: any;
+    };
+    childrenField: {
+        type: StringConstructor;
+        default: string;
+    };
+    textField: {
+        type: StringConstructor;
+        default: string;
+    };
+    textField2: {
+        type: StringConstructor;
+        default: string;
+    };
+    textField3: {
+        type: StringConstructor;
+        default: string;
+    };
+    title: StringConstructor;
+    textSplit: {
+        type: StringConstructor;
+        default: string;
+    };
+    showHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiple: BooleanConstructor;
+    searchConfig: {
+        type: ObjectConstructor;
+        default: () => {
+            options: never[];
+            searchMethod: null;
+            openSearchSlot: boolean;
+        };
+    };
+    nodeConfig: {
+        type: ObjectConstructor;
+        default: () => {
+            lazy: boolean;
+            load: null;
+            isLeaf: string;
+            afterLoad: null;
+            currentNodeKey: null;
+            checkStrictly: boolean;
+            checkDescendants: null;
+            defaultCheckedKeys: null;
+            defaultExpandedKeys: null;
+            autoExpandParent: null;
+            defaultExpandAll: null;
+            filterNodeMethod: null;
+        };
+    };
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}>> & {
+    onClick?: ((...args: any[]) => any) | undefined;
+    onClose?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+    "onNode-expand"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:text"?: ((...args: any[]) => any) | undefined;
+    "onSearch-click"?: ((...args: any[]) => any) | undefined;
+}, {
+    data: unknown[];
+    ellipsis: boolean;
+    tiny_mode_root: boolean;
+    _constants: Record<string, any>;
+    textField: string;
+    valueField: string;
+    visible: boolean;
+    showHeader: boolean;
+    placeholder: string | unknown[];
+    multiple: boolean;
+    searchConfig: Record<string, any>;
+    childrenField: string;
+    textSplit: string;
+    nodeConfig: Record<string, any>;
+    textField2: string;
+    textField3: string;
+}, {}>;
 export default _default;

package/src/option.vue.d.ts

@@ -1,2 +1,33 @@
-declare const _default: import("vue/types/vue").ExtendedVue<import("vue").default, any, any, any, Record<"option" | "ellipsis" | "selected" | "textField" | "multiple" | "loading" | "textField2" | "textField3", any>>;
+declare const _default: import("@vue/runtime-core").DefineComponent<Readonly<{
+    ellipsis?: any;
+    option?: any;
+    selected?: any;
+    textField?: any;
+    loading?: any;
+    multiple?: any;
+    textField2?: any;
+    textField3?: any;
+}>, any, any, {
+    data(): any;
+}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, "click"[], "click", import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
+    ellipsis?: any;
+    option?: any;
+    selected?: any;
+    textField?: any;
+    loading?: any;
+    multiple?: any;
+    textField2?: any;
+    textField3?: any;
+}>>> & {
+    onClick?: ((...args: any[]) => any) | undefined;
+}, {
+    readonly ellipsis?: any;
+    readonly option?: any;
+    readonly selected?: any;
+    readonly textField?: any;
+    readonly loading?: any;
+    readonly multiple?: any;
+    readonly textField2?: any;
+    readonly textField3?: any;
+}, {}>;
 export default _default;