@nutui/nutui 4.0.0-beta.9 → 4.0.1-2.beta-1

package/dist/packages/_es/Picker.js

@@ -1,173 +1,132 @@
-import { reactive, ref, computed, watch, toRefs, onMounted, openBlock, createElementBlock, createElementVNode, normalizeStyle, Fragment, renderList, normalizeClass, toDisplayString, createCommentVNode, resolveComponent, renderSlot, createVNode } from "vue";
-import { c as createComponent, d as preventDefault, e as clamp } from "./component-81a4c1d0.js";
-import { p as pxCheck } from "./pxCheck-c6b9f6b7.js";
-import { u as useTouch } from "./index-7a7385e4.js";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+var le = Object.defineProperty, oe = Object.defineProperties;
+var ae = Object.getOwnPropertyDescriptors;
+var Q = Object.getOwnPropertySymbols;
+var re = Object.prototype.hasOwnProperty, se = Object.prototype.propertyIsEnumerable;
+var W = (e, n, a) => n in e ? le(e, n, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[n] = a, B = (e, n) => {
+  for (var a in n || (n = {}))
+    re.call(n, a) && W(e, a, n[a]);
+  if (Q)
+    for (var a of Q(n))
+      se.call(n, a) && W(e, a, n[a]);
+  return e;
+}, L = (e, n) => oe(e, ae(n));
+import { reactive as x, ref as $, computed as b, watch as E, toRefs as J, onMounted as ue, openBlock as S, createElementBlock as D, createElementVNode as N, normalizeStyle as I, Fragment as U, renderList as _, normalizeClass as ee, toDisplayString as R, createCommentVNode as j, resolveComponent as ie, renderSlot as X, createVNode as ce } from "vue";
+import { c as q, d as Z, e as me } from "./component-234624bc.js";
+import { p as de } from "./pxCheck-38173291.js";
+import { u as he } from "./index-53ec2d4d.js";
+import { _ as te } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-const { componentName: componentName$1 } = createComponent("picker");
-const usePicker = (props, emit) => {
-  const state = reactive({
-    formattedColumns: props.columns
-  });
-  let defaultValues = ref([]);
-  const pickerColumn = ref([]);
-  const swipeRef = (el) => {
-    if (el && pickerColumn.value.length < columnsList.value.length) {
-      pickerColumn.value.push(el);
-    }
-  };
-  const classes = computed(() => {
-    const prefixCls = componentName$1;
-    return {
-      [prefixCls]: true
-    };
-  });
-  const selectedOptions = computed(() => {
-    let optins = [];
-    columnsList.value.map((column2, index) => {
-      let currOptions = [];
-      currOptions = column2.filter((item) => item.value == defaultValues.value[index]);
-      optins.push(currOptions[0]);
-    });
-    return optins;
-  });
-  const columnsType = computed(() => {
-    const firstColumn = state.formattedColumns[0];
-    if (firstColumn) {
-      if (Array.isArray(firstColumn)) {
+const { componentName: fe } = q("picker"), ve = (e, n) => {
+  const a = x({
+    formattedColumns: e.columns
+  }), t = $([]), y = $([]), p = (l) => {
+    l && y.value.length < d.value.length && y.value.push(l);
+  }, r = b(() => ({
+    [fe]: !0
+  })), s = b(() => d.value.map((l, c) => l.find((T) => T.value === t.value[c]))), g = b(() => {
+    const l = a.formattedColumns[0];
+    if (l) {
+      if (Array.isArray(l))
         return "multiple";
-      }
-      if ("children" in firstColumn) {
+      if ("children" in l)
         return "cascade";
-      }
     }
     return "single";
-  });
-  const columnsList = computed(() => {
-    switch (columnsType.value) {
+  }), d = b(() => {
+    switch (g.value) {
       case "multiple":
-        return state.formattedColumns;
+        return a.formattedColumns;
       case "cascade":
-        return formatCascade(state.formattedColumns, defaultValues.value ? defaultValues.value : []);
+        return H(a.formattedColumns, t.value ? t.value : []);
       default:
-        return [state.formattedColumns];
+        return [a.formattedColumns];
     }
-  });
-  const formatCascade = (columns, defaultValues2) => {
-    const formatted = [];
-    let cursor = {
+  }), H = (l, c) => {
+    const T = [];
+    let u = {
       text: "",
       value: "",
-      children: columns
-    };
-    let columnIndex = 0;
-    while (cursor && cursor.children) {
-      const options = cursor.children;
-      const value = defaultValues2[columnIndex];
-      let index = options.findIndex((columnItem) => columnItem.value == value);
-      if (index == -1)
-        index = 0;
-      cursor = cursor.children[index];
-      columnIndex++;
-      formatted.push(options);
+      children: l
+    }, z = 0;
+    for (; u && u.children; ) {
+      const P = u.children, w = c[z];
+      let C = P.findIndex((O) => O.value === w);
+      C === -1 && (C = 0), u = u.children[C], z++, T.push(P);
     }
-    return formatted;
-  };
-  const cancel = () => {
-    emit("cancel", {
-      selectedValue: defaultValues.value,
-      selectedOptions: selectedOptions.value
+    return T;
+  }, M = () => {
+    n("cancel", {
+      selectedValue: t.value,
+      selectedOptions: s.value
     });
-  };
-  const changeHandler = (columnIndex, option) => {
-    if (option && Object.keys(option).length) {
-      defaultValues.value = defaultValues.value ? defaultValues.value : [];
-      if (columnsType.value === "cascade") {
-        defaultValues.value[columnIndex] = option.value ? option.value : "";
-        let index = columnIndex;
-        let cursor = option;
-        while (cursor && cursor.children && cursor.children[0]) {
-          defaultValues.value[index + 1] = cursor.children[0].value;
-          index++;
-          cursor = cursor.children[0];
-        }
-        if (cursor && cursor.children && cursor.children.length == 0) {
-          defaultValues.value = defaultValues.value.slice(0, index + 1);
-        }
-      } else {
-        defaultValues.value[columnIndex] = option.hasOwnProperty("value") ? option.value : "";
-      }
-      emit("change", {
-        columnIndex,
-        selectedValue: defaultValues.value,
-        selectedOptions: selectedOptions.value
+  }, A = (l, c) => {
+    if (c && Object.keys(c).length) {
+      if (t.value = t.value ? t.value : [], g.value === "cascade") {
+        t.value[l] = c.value ? c.value : "";
+        let T = l, u = c;
+        for (; u && u.children && u.children[0]; )
+          t.value[T + 1] = u.children[0].value, T++, u = u.children[0];
+        u && u.children && u.children.length === 0 && (t.value = t.value.slice(0, T + 1));
+      } else
+        t.value[l] = c.hasOwnProperty("value") ? c.value : "";
+      n("change", {
+        columnIndex: l,
+        selectedValue: t.value,
+        selectedOptions: s.value
       });
     }
-  };
-  const confirm = () => {
-    if (defaultValues.value && !defaultValues.value.length) {
-      columnsList.value.forEach((columns) => {
-        defaultValues.value.push(columns[0].value);
-      });
-    }
-    emit("confirm", {
-      selectedValue: defaultValues.value,
-      selectedOptions: selectedOptions.value
+  }, f = () => {
+    t.value && !t.value.length && d.value.forEach((l) => {
+      t.value.push(l[0].value);
+    }), n("confirm", {
+      selectedValue: t.value,
+      selectedOptions: s.value
     });
-  };
-  const isSameValue = (valA, valB) => JSON.stringify(valA) === JSON.stringify(valB);
-  watch(
-    () => props.modelValue,
-    (newValues) => {
-      if (!isSameValue(newValues, defaultValues.value)) {
-        defaultValues.value = newValues;
-      }
+  }, Y = (l, c) => JSON.stringify(l) === JSON.stringify(c);
+  return E(
+    () => e.modelValue,
+    (l) => {
+      Y(l, t.value) || (t.value = l);
     },
-    { deep: true, immediate: true }
-  );
-  watch(
-    defaultValues,
-    (newValues) => {
-      if (!isSameValue(newValues, props.modelValue)) {
-        emit("update:modelValue", newValues);
-      }
+    { deep: !0, immediate: !0 }
+  ), E(
+    t,
+    (l) => {
+      Y(l, e.modelValue) || n("update:modelValue", l);
     },
-    { deep: true }
-  );
-  watch(
-    () => props.columns,
-    (val) => {
-      if (val.length)
-        state.formattedColumns = val;
+    { deep: !0 }
+  ), E(
+    () => e.columns,
+    (l) => {
+      l.length && (a.formattedColumns = l);
     }
-  );
-  return {
-    classes,
-    ...toRefs(state),
-    columnsType,
-    columnsList,
-    cancel,
-    changeHandler,
-    confirm,
-    defaultValues,
-    pickerColumn,
-    swipeRef,
-    selectedOptions,
-    isSameValue
-  };
-};
-const { create: create$1 } = createComponent("picker-column");
-const _sfc_main$1 = create$1({
+  ), L(B({
+    classes: r
+  }, J(a)), {
+    columnsType: g,
+    columnsList: d,
+    cancel: M,
+    changeHandler: A,
+    confirm: f,
+    defaultValues: t,
+    pickerColumn: y,
+    swipeRef: p,
+    selectedOptions: s,
+    isSameValue: Y
+  });
+}, { create: pe } = q("picker-column"), ge = pe({
   props: {
+    // 当前选中项
     value: [String, Number],
     columnsType: String,
     column: {
       type: Array,
       default: () => []
     },
+    // 是否开启3D效果
     threeDimensional: {
       type: Boolean,
-      default: true
+      default: !0
     },
     swipeDuration: {
       type: [Number, String],
@@ -183,9 +142,8 @@ const _sfc_main$1 = create$1({
     }
   },
   emits: ["click", "change"],
-  setup(props, { emit }) {
-    const touch = useTouch();
-    const state = reactive({
+  setup(e, { emit: n }) {
+    const a = he(), t = x({
       touchParams: {
         startY: 0,
         endY: 0,
@@ -198,228 +156,141 @@ const _sfc_main$1 = create$1({
       transformY: 0,
       scrollDistance: 0,
       rotation: 20
-    });
-    const roller = ref(null);
-    const moving = ref(false);
-    const touchDeg = ref(0);
-    const touchTime = ref(0);
-    const DEFAULT_DURATION = 200;
-    const INERTIA_TIME = 300;
-    const INERTIA_DISTANCE = 15;
-    const touchRollerStyle = computed(() => {
-      return {
-        transition: `transform ${touchTime.value}ms cubic-bezier(0.17, 0.89, 0.45, 1)`,
-        transform: `rotate3d(1, 0, 0, ${touchDeg.value})`,
-        top: `calc(50% - ${+props.optionHeight / 2}px)`
-      };
-    });
-    const touchTileStyle = computed(() => {
-      const { optionHeight } = props;
+    }), y = $(null), p = $(!1), r = $(0), s = $(0), g = 200, d = 300, H = 15, M = b(() => ({
+      transition: `transform ${s.value}ms cubic-bezier(0.17, 0.89, 0.45, 1)`,
+      transform: `rotate3d(1, 0, 0, ${r.value})`,
+      top: `calc(50% - ${+e.optionHeight / 2}px)`
+    })), A = b(() => {
+      const { optionHeight: o } = e;
       return {
-        transition: `transform ${touchTime.value}ms cubic-bezier(0.17, 0.89, 0.45, 1)`,
-        transform: `translate3d(0, ${state.scrollDistance}px, 0)`,
-        top: `calc(50% - ${+optionHeight / 2}px)`,
-        height: `${optionHeight}px`
+        transition: `transform ${s.value}ms cubic-bezier(0.17, 0.89, 0.45, 1)`,
+        transform: `translate3d(0, ${t.scrollDistance}px, 0)`,
+        top: `calc(50% - ${+o / 2}px)`,
+        height: `${o}px`
       };
-    });
-    const setRollerStyle = (index) => {
-      return `transform: rotate3d(1, 0, 0, ${-state.rotation * index}deg) translate3d(0px, 0px, 104px)`;
-    };
-    const maskStyles = computed(() => {
-      return {
-        backgroundSize: `100% ${(+props.visibleOptionNum - 1) * +props.optionHeight / 2}px`
-      };
-    });
-    const onTouchStart = (event) => {
-      touch.start(event);
-      if (moving.value) {
-        let dom = roller.value;
-        const { transform } = window.getComputedStyle(dom);
-        if (props.threeDimensional) {
-          const circle = Math.floor(touchDeg.value / 360);
-          const cos = +transform.split(", ")[5];
-          const sin = +transform.split(", ")[6] < 0 ? 180 : 0;
-          const endDeg = circle * 360 + Math.acos(cos) / Math.PI * 180 + sin;
-          state.scrollDistance = -Math.abs((endDeg / state.rotation - 1) * +props.optionHeight);
-        } else {
-          state.scrollDistance = +transform.slice(7, transform.length - 1).split(", ")[5];
-        }
+    }), f = (o) => `transform: rotate3d(1, 0, 0, ${-t.rotation * o}deg) translate3d(0px, 0px, 104px)`, Y = b(() => ({
+      backgroundSize: `100% ${(+e.visibleOptionNum - 1) * +e.optionHeight / 2}px`
+    })), l = (o) => {
+      if (a.start(o), p.value) {
+        let m = y.value;
+        const { transform: i } = window.getComputedStyle(m);
+        if (e.threeDimensional) {
+          const h = Math.floor(parseInt(r.value) / 360), v = +i.split(", ")[5], k = +i.split(", ")[6] < 0 ? 180 : 0, V = h * 360 + Math.acos(v) / Math.PI * 180 + k;
+          t.scrollDistance = -Math.abs((V / t.rotation - 1) * +e.optionHeight);
+        } else
+          t.scrollDistance = +i.slice(7, i.length - 1).split(", ")[5];
       }
-      state.touchParams.startY = touch.deltaY.value;
-      state.touchParams.startTime = Date.now();
-      state.transformY = state.scrollDistance;
-    };
-    const onTouchMove = (event) => {
-      touch.move(event);
-      if (touch.isVertical()) {
-        moving.value = true;
-        preventDefault(event, true);
-      }
-      state.touchParams.lastY = touch.deltaY.value;
-      let move = state.touchParams.lastY - state.touchParams.startY;
-      setMove(move);
-    };
-    const onTouchEnd = () => {
-      state.touchParams.lastY = touch.deltaY.value;
-      state.touchParams.lastTime = Date.now();
-      let move = state.touchParams.lastY - state.touchParams.startY;
-      let moveTime = state.touchParams.lastTime - state.touchParams.startTime;
-      if (moveTime <= INERTIA_TIME && Math.abs(move) > INERTIA_DISTANCE) {
-        const distance = momentum(move, moveTime);
-        setMove(distance, "end", +props.swipeDuration);
+      Z(o, !0), t.touchParams.startY = a.deltaY.value, t.touchParams.startTime = Date.now(), t.transformY = t.scrollDistance;
+    }, c = (o) => {
+      a.move(o), a.isVertical() && (p.value = !0, Z(o, !0)), t.touchParams.lastY = a.deltaY.value;
+      let m = t.touchParams.lastY - t.touchParams.startY;
+      w(m);
+    }, T = () => {
+      t.touchParams.lastY = a.deltaY.value, t.touchParams.lastTime = Date.now();
+      let o = t.touchParams.lastY - t.touchParams.startY, m = t.touchParams.lastTime - t.touchParams.startTime;
+      if (m <= d && Math.abs(o) > H) {
+        const i = u(o, m);
+        w(i, "end", +e.swipeDuration);
         return;
-      } else {
-        setMove(move, "end");
-      }
+      } else
+        w(o, "end");
       setTimeout(() => {
-        touch.reset();
-        moving.value = false;
+        a.reset(), p.value = !1;
       }, 0);
-    };
-    const momentum = (distance, duration) => {
-      const speed = Math.abs(distance / duration);
-      distance = speed / 3e-3 * (distance < 0 ? -1 : 1);
-      return distance;
-    };
-    const isHidden = (index) => {
-      if (index >= state.currIndex + 8 || index <= state.currIndex - 8) {
-        return true;
+    }, u = (o, m) => (o = Math.abs(o / m) / 3e-3 * (o < 0 ? -1 : 1), o), z = (o) => o >= t.currIndex + 8 || o <= t.currIndex - 8, P = (o = 0, m, i = g, h) => {
+      m === "end" ? s.value = i : s.value = 0, r.value = h, t.scrollDistance = o;
+    }, w = (o, m, i) => {
+      const { optionHeight: h } = e;
+      let v = o + t.transformY;
+      if (m === "end") {
+        v > 0 && (v = 0), v < -(e.column.length - 1) * +h && (v = -(e.column.length - 1) * +h);
+        let k = Math.round(v / +h) * +h, V = `${(Math.abs(Math.round(k / +h)) + 1) * t.rotation}deg`;
+        P(k, m, i, V), t.currIndex = Math.abs(Math.round(k / +h)) + 1;
       } else {
-        return false;
+        let k = 0, V = (-v / +h + 1) * t.rotation;
+        const G = (e.column.length + 1) * t.rotation, K = 0;
+        k = me(V, K, G), K < k && k < G && (P(v, null, void 0, k + "deg"), t.currIndex = Math.abs(Math.round(v / +h)) + 1);
       }
+    }, C = () => {
+      n("change", e.column[t.currIndex - 1]);
+    }, O = (o) => {
+      const { column: m } = e;
+      let i = m.findIndex((v) => v.value === e.value);
+      t.currIndex = i === -1 ? 1 : i + 1;
+      let h = i === -1 ? 0 : i * +e.optionHeight;
+      o && C(), w(-h);
+    }, ne = () => {
+      p.value = !1, s.value = 0, C();
     };
-    const setTransform = (translateY = 0, type, time = DEFAULT_DURATION, deg) => {
-      if (type === "end") {
-        touchTime.value = time;
-      } else {
-        touchTime.value = 0;
-      }
-      touchDeg.value = deg;
-      state.scrollDistance = translateY;
-    };
-    const setMove = (move, type, time) => {
-      const { optionHeight } = props;
-      let updateMove = move + state.transformY;
-      if (type === "end") {
-        if (updateMove > 0) {
-          updateMove = 0;
-        }
-        if (updateMove < -(props.column.length - 1) * +optionHeight) {
-          updateMove = -(props.column.length - 1) * +optionHeight;
-        }
-        let endMove = Math.round(updateMove / +optionHeight) * +optionHeight;
-        let deg = `${(Math.abs(Math.round(endMove / +optionHeight)) + 1) * state.rotation}deg`;
-        setTransform(endMove, type, time, deg);
-        state.currIndex = Math.abs(Math.round(endMove / +optionHeight)) + 1;
-      } else {
-        let deg = 0;
-        let currentDeg = (-updateMove / +optionHeight + 1) * state.rotation;
-        const maxDeg = (props.column.length + 1) * state.rotation;
-        const minDeg = 0;
-        deg = clamp(currentDeg, minDeg, maxDeg);
-        if (minDeg < deg && deg < maxDeg) {
-          setTransform(updateMove, null, void 0, deg + "deg");
-          state.currIndex = Math.abs(Math.round(updateMove / +optionHeight)) + 1;
-        }
-      }
-    };
-    const setChooseValue = () => {
-      emit("change", props.column[state.currIndex - 1]);
-    };
-    const modifyStatus = (type) => {
-      const { column: column2 } = props;
-      let index = column2.findIndex((columnItem) => columnItem.value == props.value);
-      state.currIndex = index === -1 ? 1 : index + 1;
-      let move = index === -1 ? 0 : index * +props.optionHeight;
-      type && setChooseValue();
-      setMove(-move);
-    };
-    const stopMomentum = () => {
-      moving.value = false;
-      touchTime.value = 0;
-      setChooseValue();
-    };
-    watch(
-      () => props.column,
-      (val) => {
-        if (props.column && props.column.length > 0) {
-          state.transformY = 0;
-          modifyStatus(false);
-        }
+    return E(
+      () => e.column,
+      (o) => {
+        e.column && e.column.length > 0 && (t.transformY = 0, O(!1));
       },
       {
-        deep: true
+        deep: !0
       }
-    );
-    watch(
-      () => props.value,
-      (val) => {
-        state.transformY = 0;
-        modifyStatus(false);
+    ), E(
+      () => e.value,
+      (o) => {
+        t.transformY = 0, O(!1);
       },
       {
-        deep: true
+        deep: !0
       }
-    );
-    onMounted(() => {
-      modifyStatus(true);
+    ), ue(() => {
+      O(!0);
+    }), L(B(B({}, J(t)), J(e)), {
+      setRollerStyle: f,
+      isHidden: z,
+      roller: y,
+      onTouchStart: l,
+      onTouchMove: c,
+      onTouchEnd: T,
+      touchRollerStyle: M,
+      touchTileStyle: A,
+      setMove: w,
+      stopMomentum: ne,
+      pxCheck: de,
+      maskStyles: Y
     });
-    return {
-      ...toRefs(state),
-      ...toRefs(props),
-      setRollerStyle,
-      isHidden,
-      roller,
-      onTouchStart,
-      onTouchMove,
-      onTouchEnd,
-      touchRollerStyle,
-      touchTileStyle,
-      setMove,
-      stopMomentum,
-      pxCheck,
-      maskStyles
-    };
   }
 });
-function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("view", {
+function ye(e, n, a, t, y, p) {
+  return S(), D("view", {
     class: "nut-picker__list",
-    onTouchstart: _cache[1] || (_cache[1] = (...args) => _ctx.onTouchStart && _ctx.onTouchStart(...args)),
-    onTouchmove: _cache[2] || (_cache[2] = (...args) => _ctx.onTouchMove && _ctx.onTouchMove(...args)),
-    onTouchend: _cache[3] || (_cache[3] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args))
+    onTouchstart: n[1] || (n[1] = (...r) => e.onTouchStart && e.onTouchStart(...r)),
+    onTouchmove: n[2] || (n[2] = (...r) => e.onTouchMove && e.onTouchMove(...r)),
+    onTouchend: n[3] || (n[3] = (...r) => e.onTouchEnd && e.onTouchEnd(...r))
   }, [
-    createElementVNode("view", {
+    N("view", {
       class: "nut-picker-roller",
       ref: "roller",
-      style: normalizeStyle(_ctx.threeDimensional ? _ctx.touchRollerStyle : _ctx.touchTileStyle),
-      onTransitionend: _cache[0] || (_cache[0] = (...args) => _ctx.stopMomentum && _ctx.stopMomentum(...args))
+      style: I(e.threeDimensional ? e.touchRollerStyle : e.touchTileStyle),
+      onTransitionend: n[0] || (n[0] = (...r) => e.stopMomentum && e.stopMomentum(...r))
     }, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.column, (item, index) => {
-        return openBlock(), createElementBlock(Fragment, {
-          key: item.value ? item.value : index
-        }, [
-          item && item.text && _ctx.threeDimensional ? (openBlock(), createElementBlock("view", {
-            key: 0,
-            class: normalizeClass(["nut-picker-roller-item", { "nut-picker-roller-item-hidden": _ctx.isHidden(index + 1) }]),
-            style: normalizeStyle(_ctx.setRollerStyle(index + 1))
-          }, toDisplayString(item.text), 7)) : createCommentVNode("", true),
-          item && item.text && !_ctx.threeDimensional ? (openBlock(), createElementBlock("view", {
-            key: 1,
-            class: "nut-picker-roller-item-tile",
-            style: normalizeStyle({ height: _ctx.pxCheck(_ctx.optionHeight) })
-          }, toDisplayString(item.text), 5)) : createCommentVNode("", true)
-        ], 64);
-      }), 128))
+      (S(!0), D(U, null, _(e.column, (r, s) => (S(), D(U, {
+        key: r.value ? r.value : s
+      }, [
+        r && r.text && e.threeDimensional ? (S(), D("view", {
+          key: 0,
+          class: ee(["nut-picker-roller-item", { "nut-picker-roller-item-hidden": e.isHidden(s + 1) }]),
+          style: I(e.setRollerStyle(s + 1))
+        }, R(r.text), 7)) : j("", !0),
+        r && r.text && !e.threeDimensional ? (S(), D("view", {
+          key: 1,
+          class: "nut-picker-roller-item-tile",
+          style: I({ height: e.pxCheck(e.optionHeight), lineHeight: e.pxCheck(e.optionHeight) })
+        }, R(r.text), 5)) : j("", !0)
+      ], 64))), 128))
     ], 36),
-    createElementVNode("view", {
+    N("view", {
       class: "nut-picker-roller-mask",
-      style: normalizeStyle(_ctx.maskStyles)
+      style: I(e.maskStyles)
     }, null, 4)
   ], 32);
 }
-const column = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
-const baseProps = {
+const F = /* @__PURE__ */ te(ge, [["render", ye]]), Te = {
   modelValue: {
     type: Array,
     default: () => []
@@ -438,13 +309,11 @@ const baseProps = {
   },
   columns: {
     type: Array,
-    default: () => {
-      return [];
-    }
+    default: () => []
   },
   threeDimensional: {
     type: Boolean,
-    default: true
+    default: !0
   },
   swipeDuration: {
     type: [Number, String],
@@ -452,7 +321,7 @@ const baseProps = {
   },
   showToolbar: {
     type: Boolean,
-    default: true
+    default: !0
   },
   visibleOptionNum: {
     type: [Number, String],
@@ -462,102 +331,87 @@ const baseProps = {
     type: [Number, String],
     default: 36
   }
-};
-const { componentName, create, translate } = createComponent("picker");
-const _sfc_main = create({
+}, { componentName: Ve, create: ke, translate: Se } = q("picker"), De = ke({
   components: {
-    [column.name]: column
+    [F.name]: F
   },
-  props: baseProps,
+  props: Te,
   emits: ["cancel", "change", "confirm", "update:modelValue"],
-  setup(props, { emit }) {
-    const { changeHandler, confirm, defaultValues, columnsList, columnsType, classes, cancel } = usePicker(props, emit);
-    const pickerColumn = ref([]);
-    const swipeRef = (el) => {
-      if (el && pickerColumn.value.length < columnsList.value.length) {
-        pickerColumn.value.push(el);
-      }
-    };
-    const columnStyle = computed(() => {
-      const styles = {};
-      styles.height = `${+props.visibleOptionNum * +props.optionHeight}px`;
-      styles["--lineHeight"] = `${+props.optionHeight}px`;
-      return styles;
+  setup(e, { emit: n }) {
+    const { changeHandler: a, confirm: t, defaultValues: y, columnsList: p, columnsType: r, classes: s, cancel: g } = ve(e, n), d = $([]), H = (f) => {
+      f && d.value.length < p.value.length && d.value.push(f);
+    }, M = b(() => {
+      const f = {};
+      return f.height = `${+e.visibleOptionNum * +e.optionHeight}px`, f["--lineHeight"] = `${+e.optionHeight}px`, f;
     });
-    const confirmHandler = () => {
-      pickerColumn.value.length > 0 && pickerColumn.value.forEach((column2) => {
-        column2.stopMomentum();
-      });
-      confirm();
-    };
     return {
-      classes,
-      column,
-      columnsType,
-      columnsList,
-      cancel,
-      changeHandler,
-      confirmHandler,
-      defaultValues,
-      translate,
-      pickerColumn,
-      swipeRef,
-      columnStyle
+      classes: s,
+      column: F,
+      columnsType: r,
+      columnsList: p,
+      cancel: g,
+      changeHandler: a,
+      confirmHandler: () => {
+        d.value.length > 0 && d.value.forEach((f) => {
+          f.stopMomentum();
+        }), t();
+      },
+      defaultValues: y,
+      translate: Se,
+      pickerColumn: d,
+      swipeRef: H,
+      columnStyle: M
     };
   }
-});
-const _hoisted_1 = {
+}), be = {
   key: 0,
   class: "nut-picker__bar"
-};
-const _hoisted_2 = { class: "nut-picker__title" };
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_picker_column = resolveComponent("nut-picker-column");
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass(_ctx.classes)
+}, we = { class: "nut-picker__title" };
+function $e(e, n, a, t, y, p) {
+  const r = ie("nut-picker-column");
+  return S(), D("div", {
+    class: ee(e.classes)
   }, [
-    _ctx.showToolbar ? (openBlock(), createElementBlock("view", _hoisted_1, [
-      createElementVNode("view", {
+    e.showToolbar ? (S(), D("view", be, [
+      N("view", {
         class: "nut-picker__left",
-        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.cancel && _ctx.cancel(...args))
-      }, toDisplayString(_ctx.cancelText || _ctx.translate("cancel")), 1),
-      createElementVNode("view", _hoisted_2, toDisplayString(_ctx.title), 1),
-      createElementVNode("view", {
+        onClick: n[0] || (n[0] = (...s) => e.cancel && e.cancel(...s))
+      }, R(e.cancelText || e.translate("cancel")), 1),
+      N("view", we, R(e.title), 1),
+      N("view", {
         class: "nut-picker__right",
-        onClick: _cache[1] || (_cache[1] = ($event) => _ctx.confirmHandler())
-      }, toDisplayString(_ctx.okText || _ctx.translate("confirm")), 1)
-    ])) : createCommentVNode("", true),
-    renderSlot(_ctx.$slots, "top"),
-    createElementVNode("view", {
+        onClick: n[1] || (n[1] = (s) => e.confirmHandler())
+      }, R(e.okText || e.translate("confirm")), 1)
+    ])) : j("", !0),
+    X(e.$slots, "top"),
+    N("view", {
       class: "nut-picker__column",
-      style: normalizeStyle(_ctx.columnStyle)
+      style: I(e.columnStyle)
     }, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.columnsList, (column2, columnIndex) => {
-        return openBlock(), createElementBlock("view", {
-          class: "nut-picker__columnitem",
-          key: columnIndex
-        }, [
-          createVNode(_component_nut_picker_column, {
-            ref_for: true,
-            ref: _ctx.swipeRef,
-            column: column2,
-            columnsType: _ctx.columnsType,
-            value: _ctx.defaultValues && _ctx.defaultValues[columnIndex],
-            threeDimensional: _ctx.threeDimensional,
-            swipeDuration: _ctx.swipeDuration,
-            visibleOptionNum: _ctx.visibleOptionNum,
-            optionHeight: _ctx.optionHeight,
-            onChange: (option) => {
-              _ctx.changeHandler(columnIndex, option);
-            }
-          }, null, 8, ["column", "columnsType", "value", "threeDimensional", "swipeDuration", "visibleOptionNum", "optionHeight", "onChange"])
-        ]);
-      }), 128))
+      (S(!0), D(U, null, _(e.columnsList, (s, g) => (S(), D("view", {
+        class: "nut-picker__columnitem",
+        key: g
+      }, [
+        ce(r, {
+          ref_for: !0,
+          ref: e.swipeRef,
+          column: s,
+          columnsType: e.columnsType,
+          value: e.defaultValues && e.defaultValues[g],
+          threeDimensional: e.threeDimensional,
+          swipeDuration: e.swipeDuration,
+          visibleOptionNum: e.visibleOptionNum,
+          optionHeight: e.optionHeight,
+          onChange: (d) => {
+            e.changeHandler(g, d);
+          }
+        }, null, 8, ["column", "columnsType", "value", "threeDimensional", "swipeDuration", "visibleOptionNum", "optionHeight", "onChange"])
+      ]))), 128))
     ], 4),
-    renderSlot(_ctx.$slots, "default")
+    X(e.$slots, "default")
   ], 2);
 }
-const Picker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const Ie = /* @__PURE__ */ te(De, [["render", $e]]);
 export {
-  Picker as default
+  Ie as default
 };