@nutui/nutui 3.1.21 → 3.1.22-beta.5

package/dist/packages/_es/Rate.js

@@ -1,144 +1,42 @@
 /*!
-* @nutui/nutui v3.1.21 Mon May 30 2022 20:20:01 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { computed, resolveComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, normalizeStyle, createVNode, createBlock, createCommentVNode } from "vue";
-import { c as createComponent } from "./component.js";
-import { p as pxCheck } from "./pxCheck.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { c as e } from "./component.js";
+import { ref as o, computed as a, resolveComponent as t, openBlock as l, createElementBlock as n, normalizeClass as c, Fragment as i, renderList as r, normalizeStyle as s, createVNode as u, createBlock as f, createCommentVNode as m } from "vue";
+import { p as d } from "./pxCheck.js";
+import { u as p } from "./index4.js";
+import { _ as h } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { componentName, create } = createComponent("rate");
-const _sfc_main = create({
-  props: {
-    count: {
-      type: [String, Number],
-      default: 5
-    },
-    modelValue: {
-      type: [String, Number],
-      default: 0
-    },
-    iconSize: {
-      type: [String, Number],
-      default: 18
-    },
-    activeColor: {
-      type: String,
-      default: ""
-    },
-    voidColor: {
-      type: String,
-      default: ""
-    },
-    uncheckedIcon: {
-      type: String,
-      default: "star-n"
-    },
-    checkedIcon: {
-      type: String,
-      default: "star-fill-n"
-    },
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    allowHalf: {
-      type: Boolean,
-      default: false
-    },
-    spacing: {
-      type: [String, Number],
-      default: 14
-    },
-    classPrefix: {
-      type: String,
-      default: "nut-icon"
-    },
-    fontClassName: {
-      type: String,
-      default: "nutui-iconfont"
-    }
-  },
-  emits: ["update:modelValue", "change"],
-  setup(props, { emit }) {
-    const classes = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [prefixCls]: true
-      };
-    });
-    const onClick = (e, index2) => {
-      e.preventDefault();
-      e.stopPropagation();
-      if (props.disabled || props.readonly)
-        return;
-      let value = 0;
-      if (index2 === 1 && props.modelValue === index2)
-        ;
-      else {
-        value = index2;
-        if (props.allowHalf) {
-          if ((e == null ? void 0 : e.target).className.includes("__icon--half")) {
-            value -= 0.5;
-          }
+const { componentName: C } = e("rate"), k = ((e2 = true) => ({ props: { count: { type: [String, Number], default: 5 }, modelValue: { type: [String, Number], default: 0 }, iconSize: { type: [String, Number], default: 18 }, activeColor: { type: String, default: "" }, voidColor: { type: String, default: "" }, uncheckedIcon: { type: String, default: "star-n" }, checkedIcon: { type: String, default: "star-fill-n" }, readonly: { type: Boolean, default: false }, disabled: { type: Boolean, default: false }, allowHalf: { type: Boolean, default: false }, touchable: { type: Boolean, default: true }, spacing: { type: [String, Number], default: 14 }, classPrefix: { type: String, default: "nut-icon" }, fontClassName: { type: String, default: "nutui-iconfont" } }, emits: ["update:modelValue", "change"], setup(t2, { emit: l2 }) {
+  const n2 = o([]), c2 = a(() => ({ [C]: true })), i2 = (e3) => {
+    l2("update:modelValue", e3), l2("change", e3);
+  }, r2 = p(), s2 = { onTouchStart(e3) {
+    t2.touchable && r2.start(e3);
+  }, onTouchMove(o2) {
+    t2.touchable && e2 && (r2.move(o2), r2.isHorizontal() && n2.value && (o2.preventDefault(), i2(((e3, o3, a2) => {
+      let t3 = 0;
+      for (let l3 = o3.value.length - 1; l3 >= 0; l3--) {
+        const n3 = o3.value[l3];
+        if (e3 > n3.offsetLeft) {
+          t3 = a2 ? l3 + (e3 > n3.offsetLeft + n3.clientWidth / 2 ? 1 : 0.5) : l3 + 1;
+          break;
         }
       }
-      emit("update:modelValue", value);
-      emit("change", value);
-    };
-    return {
-      classes,
-      onClick,
-      pxCheck
-    };
-  }
-});
-const _hoisted_1 = ["onClick"];
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_icon = resolveComponent("nut-icon");
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes)
-  }, [
-    (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.count, (n) => {
-      return openBlock(), createElementBlock("view", {
-        class: "nut-rate-item",
-        key: n,
-        onClick: ($event) => _ctx.onClick($event, n),
-        style: normalizeStyle({ marginRight: _ctx.pxCheck(_ctx.spacing) })
-      }, [
-        createVNode(_component_nut_icon, {
-          size: _ctx.iconSize,
-          class: normalizeClass(["nut-rate-item__icon", { "nut-rate-item__icon--disabled": _ctx.disabled || n > _ctx.modelValue }]),
-          "font-class-name": _ctx.fontClassName,
-          "class-prefix": _ctx.classPrefix,
-          color: n <= _ctx.modelValue ? _ctx.activeColor : _ctx.voidColor,
-          name: n <= _ctx.modelValue ? _ctx.checkedIcon : _ctx.uncheckedIcon
-        }, null, 8, ["size", "class", "font-class-name", "class-prefix", "color", "name"]),
-        _ctx.allowHalf && _ctx.modelValue + 1 > n ? (openBlock(), createBlock(_component_nut_icon, {
-          key: 0,
-          class: "nut-rate-item__icon nut-rate-item__icon--half",
-          "font-class-name": _ctx.fontClassName,
-          "class-prefix": _ctx.classPrefix,
-          color: n <= _ctx.modelValue + 1 ? _ctx.activeColor : _ctx.voidColor,
-          size: _ctx.iconSize,
-          name: _ctx.checkedIcon
-        }, null, 8, ["font-class-name", "class-prefix", "color", "size", "name"])) : _ctx.allowHalf && _ctx.modelValue + 1 < n ? (openBlock(), createBlock(_component_nut_icon, {
-          key: 1,
-          class: "nut-rate-item__icon nut-rate-item__icon--disabled nut-rate-item__icon--half",
-          "font-class-name": _ctx.fontClassName,
-          "class-prefix": _ctx.classPrefix,
-          color: _ctx.voidColor,
-          size: _ctx.iconSize,
-          name: _ctx.uncheckedIcon
-        }, null, 8, ["font-class-name", "class-prefix", "color", "size", "name"])) : createCommentVNode("", true)
-      ], 12, _hoisted_1);
-    }), 128))
-  ], 2);
-}
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+      return t3;
+    })(r2.moveX.value, n2, t2.allowHalf))));
+  } }, u2 = Math.random().toString(36).slice(-8);
+  return { classes: c2, ...s2, onClick: (e3, o2) => {
+    if (t2.disabled || t2.readonly)
+      return;
+    let a2 = 0;
+    o2 === 1 && t2.modelValue === o2 || (a2 = o2, t2.allowHalf && e3 == 2 && (a2 -= 0.5)), i2(a2);
+  }, pxCheck: d, rateRefs: n2, refRandomId: u2 };
+} }))(), v = ["id"];
+const { create: g } = e("rate");
+var y = h(g(k), [["render", function(e2, o2, a2, d2, p2, h2) {
+  const C2 = t("nut-icon");
+  return l(), n("view", { class: c(e2.classes), onTouchstart: o2[0] || (o2[0] = (...o3) => e2.onTouchStart && e2.onTouchStart(...o3)), onTouchmove: o2[1] || (o2[1] = (...o3) => e2.onTouchMove && e2.onTouchMove(...o3)) }, [(l(true), n(i, null, r(Number(e2.count), (o3) => (l(), n("view", { class: "nut-rate-item", key: o3, ref: "rateRefs", id: "rateRefs-" + e2.refRandomId + o3, style: s({ marginRight: e2.pxCheck(e2.spacing) }) }, [u(C2, { size: e2.iconSize, class: c(["nut-rate-item__icon", { "nut-rate-item__icon--disabled": e2.disabled || o3 > e2.modelValue }]), onClick: (a3) => e2.onClick(1, o3), color: o3 <= e2.modelValue ? e2.activeColor : e2.voidColor, "font-class-name": e2.fontClassName, "class-prefix": e2.classPrefix, name: o3 <= e2.modelValue ? e2.checkedIcon : e2.uncheckedIcon }, null, 8, ["size", "onClick", "class", "color", "font-class-name", "class-prefix", "name"]), e2.allowHalf && Number(e2.modelValue) + 1 > o3 ? (l(), f(C2, { key: 0, class: "nut-rate-item__icon nut-rate-item__icon--half", onClick: (a3) => e2.onClick(2, o3), "font-class-name": e2.fontClassName, "class-prefix": e2.classPrefix, color: o3 <= Number(e2.modelValue) + 1 ? e2.activeColor : e2.voidColor, size: e2.iconSize, name: e2.checkedIcon }, null, 8, ["onClick", "font-class-name", "class-prefix", "color", "size", "name"])) : e2.allowHalf && Number(e2.modelValue) + 1 < o3 ? (l(), f(C2, { key: 1, class: "nut-rate-item__icon nut-rate-item__icon--disabled nut-rate-item__icon--half", onClick: (a3) => e2.onClick(2, o3), "font-class-name": e2.fontClassName, "class-prefix": e2.classPrefix, color: e2.voidColor, size: e2.iconSize, name: e2.uncheckedIcon }, null, 8, ["onClick", "font-class-name", "class-prefix", "color", "size", "name"])) : m("", true)], 12, v))), 128))], 34);
+}]]);
+export { y as default };

package/dist/packages/_es/Row.js

@@ -1,69 +1,27 @@
 /*!
-* @nutui/nutui v3.1.21 Mon May 30 2022 20:20:01 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { provide, openBlock, createElementBlock, normalizeClass, renderSlot } from "vue";
-import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { provide as t, openBlock as e, createElementBlock as r, normalizeClass as n, renderSlot as l } from "vue";
+import { c as a } from "./component.js";
+import { _ as o } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { componentName, create } = createComponent("row");
-const _sfc_main = create({
-  props: {
-    type: {
-      type: String,
-      default: ""
-    },
-    gutter: {
-      type: [String, Number],
-      default: ""
-    },
-    justify: {
-      type: String,
-      default: "start"
-    },
-    align: {
-      type: String,
-      default: "flex-start"
-    },
-    flexWrap: {
-      type: String,
-      default: "nowrap"
-    }
-  },
-  emits: ["click"],
-  setup(props, { emit }) {
-    const prefixCls = componentName;
-    provide("gutter", props.gutter);
-    const getClass = (prefix, type) => {
-      return prefix ? type ? `nut-row-${prefix}-${type}` : "" : `nut-row-${type}`;
-    };
-    const getClasses = () => {
-      return `
-              ${getClass("", props.type)}
-              ${getClass("justify", props.justify)}
-              ${getClass("align", props.align)}
-              ${getClass("flex", props.flexWrap)}
-              ${prefixCls}
-              `;
-    };
-    const handleClick = (evt) => {
-      evt.stopPropagation();
-      emit("click", evt);
-    };
-    return {
-      getClasses,
-      handleClick
-    };
-  }
-});
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.getClasses()),
-    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
-  }, [
-    renderSlot(_ctx.$slots, "default")
-  ], 2);
-}
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+const { componentName: i, create: s } = a("row");
+var p = o(s({ props: { type: { type: String, default: "" }, gutter: { type: [String, Number], default: "" }, justify: { type: String, default: "start" }, align: { type: String, default: "flex-start" }, flexWrap: { type: String, default: "nowrap" } }, emits: ["click"], setup(e2, { emit: r2 }) {
+  const n2 = i;
+  t("gutter", e2.gutter);
+  const l2 = (t2, e3) => t2 ? e3 ? `nut-row-${t2}-${e3}` : "" : `nut-row-${e3}`;
+  return { getClasses: () => `
+              ${l2("", e2.type)}
+              ${l2("justify", e2.justify)}
+              ${l2("align", e2.align)}
+              ${l2("flex", e2.flexWrap)}
+              ${n2}
+              `, handleClick: (t2) => {
+    t2.stopPropagation(), r2("click", t2);
+  } };
+} }), [["render", function(t2, a2, o2, i2, s2, p2) {
+  return e(), r("view", { class: n(t2.getClasses()), onClick: a2[0] || (a2[0] = (...e2) => t2.handleClick && t2.handleClick(...e2)) }, [l(t2.$slots, "default")], 2);
+}]]);
+export { p as default };

package/dist/packages/_es/SearchBar.js

@@ -1,262 +1,42 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 /*!
-* @nutui/nutui v3.1.21 Mon May 30 2022 20:20:01 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { reactive, computed, ref, onMounted, toRefs, resolveComponent, openBlock, createElementBlock, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, createElementVNode, withModifiers, withDirectives, createVNode, vShow } from "vue";
-import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { reactive as e, computed as a, ref as l, onMounted as t, toRefs as r, resolveComponent as n, openBlock as c, createElementBlock as u, normalizeStyle as i, toDisplayString as o, createCommentVNode as s, renderSlot as h, createElementVNode as p, withModifiers as d, withDirectives as g, createVNode as b, vShow as m } from "vue";
+import { c as f } from "./component.js";
+import { _ as y } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { create, translate } = createComponent("searchbar");
-const _sfc_main = create({
-  props: {
-    modelValue: {
-      type: [String, Number],
-      default: ""
-    },
-    inputType: {
-      type: String,
-      default: "textarea"
-    },
-    label: {
-      type: String,
-      default: ""
-    },
-    maxLength: {
-      type: [String, Number],
-      default: "9999"
-    },
-    placeholder: {
-      type: String,
-      default: ""
-    },
-    clearable: {
-      type: Boolean,
-      default: true
-    },
-    background: {
-      type: String,
-      default: ""
-    },
-    inputBackground: {
-      type: String,
-      default: ""
-    },
-    autofocus: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-    inputAlign: {
-      type: String,
-      default: "left"
-    }
-  },
-  emits: [
-    "change",
-    "update:modelValue",
-    "blur",
-    "focus",
-    "clear",
-    "search",
-    "click-input",
-    "click-left-icon",
-    "click-right-icon"
-  ],
-  setup(props, { emit }) {
-    const state = reactive({
-      active: false
-    });
-    const searchbarStyle = computed(() => {
-      return {
-        background: props.background
-      };
-    });
-    const inputSearchbarStyle = computed(() => {
-      return {
-        background: props.inputBackground
-      };
-    });
-    const valueChange = (event) => {
-      const input = event.target;
-      let val = input.value;
-      if (props.maxLength && val.length > Number(props.maxLength)) {
-        val = val.slice(0, Number(props.maxLength));
-      }
-      emit("update:modelValue", val, event);
-      emit("change", val, event);
-    };
-    const valueFocus = (event) => {
-      const input = event.target;
-      let value = input.value;
-      state.active = true;
-      emit("focus", value, event);
-    };
-    const valueBlur = (event) => {
-      setTimeout(() => {
-        state.active = false;
-      }, 0);
-      const input = event.target;
-      let value = input.value;
-      if (props.maxLength && value.length > Number(props.maxLength)) {
-        value = value.slice(0, Number(props.maxLength));
-      }
-      emit("blur", value, event);
-    };
-    const handleClear = (event) => {
-      emit("update:modelValue", "", event);
-      emit("change", "", event);
-      emit("clear", "");
-    };
-    const handleSubmit = () => {
-      emit("search", props.modelValue);
-    };
-    const clickInput = (event) => {
-      emit("click-input", event);
-    };
-    const leftIconClick = (event) => {
-      emit("click-left-icon", props.modelValue, event);
-    };
-    const rightIconClick = (event) => {
-      emit("click-right-icon", props.modelValue, event);
-    };
-    const styleSearchbar = computed(() => {
-      return {
-        "text-align": props.inputAlign
-      };
-    });
-    const inputsearch = ref(null);
-    onMounted(() => {
-      if (props.autofocus) {
-        inputsearch.value.focus();
-      }
-    });
-    return __spreadProps(__spreadValues({
-      inputsearch
-    }, toRefs(state)), {
-      valueChange,
-      valueFocus,
-      valueBlur,
-      handleClear,
-      handleSubmit,
-      searchbarStyle,
-      inputSearchbarStyle,
-      translate,
-      clickInput,
-      leftIconClick,
-      rightIconClick,
-      styleSearchbar
-    });
-  }
-});
-const _hoisted_1 = {
-  key: 0,
-  class: "nut-searchbar__search-label"
-};
-const _hoisted_2 = {
-  key: 1,
-  class: "nut-searchbar__search-icon nut-searchbar__left-search-icon"
-};
-const _hoisted_3 = { class: "nut-searchbar__input-inner" };
-const _hoisted_4 = ["type", "maxlength", "placeholder", "value", "disabled", "readonly"];
-const _hoisted_5 = {
-  key: 2,
-  class: "nut-searchbar__search-icon nut-searchbar__right-search-icon"
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_icon = resolveComponent("nut-icon");
-  return openBlock(), createElementBlock("view", {
-    class: "nut-searchbar",
-    style: normalizeStyle(_ctx.searchbarStyle)
-  }, [
-    _ctx.label ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(_ctx.label), 1)) : createCommentVNode("", true),
-    _ctx.$slots.leftout ? (openBlock(), createElementBlock("view", _hoisted_2, [
-      renderSlot(_ctx.$slots, "leftout")
-    ])) : createCommentVNode("", true),
-    createElementVNode("view", {
-      class: "nut-searchbar__search-input",
-      style: normalizeStyle(_ctx.inputSearchbarStyle)
-    }, [
-      _ctx.$slots.leftin ? (openBlock(), createElementBlock("view", {
-        key: 0,
-        class: "nut-searchbar__search-icon nut-searchbar__iptleft-search-icon",
-        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.leftIconClick && _ctx.leftIconClick(...args))
-      }, [
-        renderSlot(_ctx.$slots, "leftin")
-      ])) : createCommentVNode("", true),
-      createElementVNode("view", _hoisted_3, [
-        createElementVNode("form", {
-          action: "#",
-          onSubmit: _cache[5] || (_cache[5] = withModifiers((...args) => _ctx.handleSubmit && _ctx.handleSubmit(...args), ["prevent"]))
-        }, [
-          createElementVNode("input", {
-            ref: "inputsearch",
-            class: "nut-searchbar__input-bar",
-            type: _ctx.inputType,
-            maxlength: _ctx.maxLength,
-            placeholder: _ctx.placeholder || _ctx.translate("placeholder"),
-            value: _ctx.modelValue,
-            disabled: _ctx.disabled,
-            readonly: _ctx.readonly,
-            onClick: _cache[1] || (_cache[1] = (...args) => _ctx.clickInput && _ctx.clickInput(...args)),
-            onInput: _cache[2] || (_cache[2] = (...args) => _ctx.valueChange && _ctx.valueChange(...args)),
-            onFocus: _cache[3] || (_cache[3] = (...args) => _ctx.valueFocus && _ctx.valueFocus(...args)),
-            onBlur: _cache[4] || (_cache[4] = (...args) => _ctx.valueBlur && _ctx.valueBlur(...args)),
-            style: normalizeStyle(_ctx.styleSearchbar)
-          }, null, 44, _hoisted_4)
-        ], 32),
-        _ctx.clearable ? withDirectives((openBlock(), createElementBlock("view", {
-          key: 0,
-          onClick: _cache[6] || (_cache[6] = (...args) => _ctx.handleClear && _ctx.handleClear(...args)),
-          class: "nut-searchbar__input-clear"
-        }, [
-          createVNode(_component_nut_icon, {
-            name: "circle-close",
-            size: "12",
-            color: "#555"
-          })
-        ], 512)), [
-          [vShow, _ctx.modelValue.length > 0]
-        ]) : createCommentVNode("", true)
-      ]),
-      _ctx.$slots.rightin ? (openBlock(), createElementBlock("view", {
-        key: 1,
-        class: "nut-searchbar__search-icon nut-searchbar__iptright-sarch-icon",
-        onClick: _cache[7] || (_cache[7] = (...args) => _ctx.rightIconClick && _ctx.rightIconClick(...args))
-      }, [
-        renderSlot(_ctx.$slots, "rightin")
-      ])) : createCommentVNode("", true)
-    ], 4),
-    _ctx.$slots.rightout ? (openBlock(), createElementBlock("view", _hoisted_5, [
-      renderSlot(_ctx.$slots, "rightout")
-    ])) : createCommentVNode("", true)
-  ], 4);
-}
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+const { create: k, translate: v } = f("searchbar"), _ = k({ props: { modelValue: { type: [String, Number], default: "" }, inputType: { type: String, default: "textarea" }, label: { type: String, default: "" }, maxLength: { type: [String, Number], default: "9999" }, placeholder: { type: String, default: "" }, clearable: { type: Boolean, default: true }, background: { type: String, default: "" }, inputBackground: { type: String, default: "" }, autofocus: { type: Boolean, default: false }, disabled: { type: Boolean, default: false }, readonly: { type: Boolean, default: false }, inputAlign: { type: String, default: "left" } }, emits: ["change", "update:modelValue", "blur", "focus", "clear", "search", "click-input", "click-left-icon", "click-right-icon"], setup(n2, { emit: c2 }) {
+  const u2 = e({ active: false }), i2 = a(() => ({ background: n2.background })), o2 = a(() => ({ background: n2.inputBackground })), s2 = a(() => ({ "text-align": n2.inputAlign })), h2 = l(null);
+  return t(() => {
+    n2.autofocus && h2.value.focus();
+  }), { inputsearch: h2, ...r(u2), valueChange: (e2) => {
+    let a2 = e2.target.value;
+    n2.maxLength && a2.length > Number(n2.maxLength) && (a2 = a2.slice(0, Number(n2.maxLength))), c2("update:modelValue", a2, e2), c2("change", a2, e2);
+  }, valueFocus: (e2) => {
+    let a2 = e2.target.value;
+    u2.active = true, c2("focus", a2, e2);
+  }, valueBlur: (e2) => {
+    setTimeout(() => {
+      u2.active = false;
+    }, 0);
+    let a2 = e2.target.value;
+    n2.maxLength && a2.length > Number(n2.maxLength) && (a2 = a2.slice(0, Number(n2.maxLength))), c2("blur", a2, e2);
+  }, handleClear: (e2) => {
+    c2("update:modelValue", "", e2), c2("change", "", e2), c2("clear", "");
+  }, handleSubmit: () => {
+    c2("search", n2.modelValue);
+  }, searchbarStyle: i2, inputSearchbarStyle: o2, translate: v, clickInput: (e2) => {
+    c2("click-input", e2);
+  }, leftIconClick: (e2) => {
+    c2("click-left-icon", n2.modelValue, e2);
+  }, rightIconClick: (e2) => {
+    c2("click-right-icon", n2.modelValue, e2);
+  }, styleSearchbar: s2 };
+} }), S = { key: 0, class: "nut-searchbar__search-label" }, C = { key: 1, class: "nut-searchbar__search-icon nut-searchbar__left-search-icon" }, x = { class: "nut-searchbar__input-inner" }, B = ["type", "maxlength", "placeholder", "value", "disabled", "readonly"], I = { key: 2, class: "nut-searchbar__search-icon nut-searchbar__right-search-icon" };
+var V = y(_, [["render", function(e2, a2, l2, t2, r2, f2) {
+  const y2 = n("nut-icon");
+  return c(), u("view", { class: "nut-searchbar", style: i(e2.searchbarStyle) }, [e2.label ? (c(), u("span", S, o(e2.label), 1)) : s("", true), e2.$slots.leftout ? (c(), u("view", C, [h(e2.$slots, "leftout")])) : s("", true), p("view", { class: "nut-searchbar__search-input", style: i(e2.inputSearchbarStyle) }, [e2.$slots.leftin ? (c(), u("view", { key: 0, class: "nut-searchbar__search-icon nut-searchbar__iptleft-search-icon", onClick: a2[0] || (a2[0] = (...a3) => e2.leftIconClick && e2.leftIconClick(...a3)) }, [h(e2.$slots, "leftin")])) : s("", true), p("view", x, [p("form", { action: "#", onSubmit: a2[5] || (a2[5] = d((...a3) => e2.handleSubmit && e2.handleSubmit(...a3), ["prevent"])) }, [p("input", { ref: "inputsearch", class: "nut-searchbar__input-bar", type: e2.inputType, maxlength: e2.maxLength, placeholder: e2.placeholder || e2.translate("placeholder"), value: e2.modelValue, disabled: e2.disabled, readonly: e2.readonly, onClick: a2[1] || (a2[1] = (...a3) => e2.clickInput && e2.clickInput(...a3)), onInput: a2[2] || (a2[2] = (...a3) => e2.valueChange && e2.valueChange(...a3)), onFocus: a2[3] || (a2[3] = (...a3) => e2.valueFocus && e2.valueFocus(...a3)), onBlur: a2[4] || (a2[4] = (...a3) => e2.valueBlur && e2.valueBlur(...a3)), style: i(e2.styleSearchbar) }, null, 44, B)], 32), e2.clearable ? g((c(), u("view", { key: 0, onClick: a2[6] || (a2[6] = (...a3) => e2.handleClear && e2.handleClear(...a3)), class: "nut-searchbar__input-clear" }, [b(y2, { name: "circle-close", size: "12", color: "#555" })], 512)), [[m, e2.modelValue.length > 0]]) : s("", true)]), e2.$slots.rightin ? (c(), u("view", { key: 1, class: "nut-searchbar__search-icon nut-searchbar__iptright-sarch-icon", onClick: a2[7] || (a2[7] = (...a3) => e2.rightIconClick && e2.rightIconClick(...a3)) }, [h(e2.$slots, "rightin")])) : s("", true)], 4), e2.$slots.rightout ? (c(), u("view", I, [h(e2.$slots, "rightout")])) : s("", true)], 4);
+}]]);
+export { V as default };