mine-h5-ui/es/MeStepper/index.vue.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { defineComponent as r, useModel as f, openBlock as p, createElementBlock as v, normalizeStyle as b, unref as i, normalizeClass as n, createElementVNode as l, withDirectives as h, vModelText as x, mergeModels as g } from "vue";
import { useHandle as C } from "./hooks.js";
const c = ["maxlength"], V = /* @__PURE__ */ r({
  name: "MeStepper",
  __name: "index",
  props: /* @__PURE__ */ g({
    max: { default: 999 },
    min: { default: 1 },
    step: { default: 1 },
    maxlength: { default: 3 },
    height: { default: 36 },
    inputWidth: { default: 60 },
    color: {},
    borderColor: {},
    borderRadius: {},
    disabledColor: {},
    disabled: { type: Boolean, default: !1 },
    fontSize: { default: 14 }
  }, {
    modelValue: { default: 1 },
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(t) {
    const d = t, a = f(t, "modelValue"), { onClickBtn: s, onBlur: u, getStyle: m } = C(d, a);
    return (q, e) => (p(), v("div", {
      class: n(["me-stepper", { "me-disabled": t.disabled }]),
      style: b(i(m))
    }, [
      l("div", {
        class: n(["button", { "me-disabled": +a.value <= d.min }]),
        onClick: e[0] || (e[0] = (o) => i(s)(-d.step))
      }, [...e[4] || (e[4] = [
        l("svg", {
          focusable: "false",
          "data-icon": "minus",
          width: "1em",
          height: "1em",
          fill: "currentColor",
          "aria-hidden": "true",
          viewBox: "64 64 896 896"
        }, [
          l("path", { d: "M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z" })
        ], -1)
      ])], 2),
      h(l("input", {
        "onUpdate:modelValue": e[1] || (e[1] = (o) => a.value = o),
        type: "text",
        class: n(["input", { "me-disabled": t.disabled }]),
        maxlength: t.maxlength,
        onBlur: e[2] || (e[2] = //@ts-ignore
        (...o) => i(u) && i(u)(...o))
      }, null, 42, c), [
        [x, a.value]
      ]),
      l("div", {
        class: n(["button", { "me-disabled": +a.value >= d.max }]),
        onClick: e[3] || (e[3] = (o) => i(s)(d.step))
      }, [...e[5] || (e[5] = [
        l("svg", {
          focusable: "false",
          "data-icon": "plus",
          width: "1em",
          height: "1em",
          fill: "currentColor",
          "aria-hidden": "true",
          viewBox: "64 64 896 896"
        }, [
          l("path", { d: "M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z" }),
          l("path", { d: "M192 474h672q8 0 8 8v60q0 8-8 8H160q-8 0-8-8v-60q0-8 8-8z" })
        ], -1)
      ])], 2)
    ], 6));
  }
});
export {
  V as default
};