y-design-ssr/libs/stepper/index.mjs

SSR component library of YUI with Vue3

import { ref as v, reactive as M, inject as z, getCurrentInstance as E, watch as V, onUnmounted as F, defineComponent as w, computed as f, createVNode as d, withDirectives as A, vModelText as T } from "vue";
const b = (e, t) => t ? typeof t == "string" ? ` ${e}--${t}` : Array.isArray(t) ? t.reduce((l, n) => l + b(e, n), "") : Object.keys(t).reduce(
  (l, n) => l + (t[n] ? b(e, n) : ""),
  ""
) : "", k = (e) => (t, l) => {
  let n = t, i = l;
  return n && typeof n != "string" && (i = n, n = ""), n = n ? `${e}__${n}` : e, `${n}${b(n, i)}`;
}, D = () => (e, t) => t ? `${b(`y-${e}`, t)}` : `y-${e}`, R = {
  "pull-refresh": {
    pulling: "下拉刷新...",
    loosing: "释放刷新...",
    loading: "数据加载中...",
    success: "数据已更新",
    failed: "数据跟新失败，请稍后再试"
  },
  "form-item": {
    validateMessage: "请输入正确内容"
  }
};
v("zh-CN");
M({
  "zh-CN": R
});
const W = (e) => {
  const t = `y-${e}`;
  return [t, k(t), D()];
}, O = (e) => isNaN(Number(e)) && typeof e == "string" ? e : `${e}px`, U = "y-form-item", j = () => {
  const e = z(U, null), t = E();
  if (e && (t != null && t.proxy)) {
    const { setField: l } = e, { resetValidation: n, change: i, validateWithTrigger: s } = e;
    return V(
      () => t.proxy.modelValue,
      () => {
        e.instance && e.instance.exposed && (n(), i(), s("onChange"));
      }
    ), l(t), F(() => l(null)), {
      parent: e
    };
  }
  return {
    parent: null
  };
}, [G, m, N] = W("stepper"), P = /* @__PURE__ */ w({
  name: G,
  props: {
    modelValue: {
      type: [Number, String],
      default: null
    },
    placeholder: {
      type: String,
      default: ""
    },
    min: {
      type: Number,
      default: 1
    },
    step: {
      type: Number,
      default: 1
    },
    integer: {
      type: Boolean,
      default: !1
    },
    max: {
      type: Number,
      default: Number.MAX_SAFE_INTEGER
    },
    disabled: {
      type: Boolean,
      default: !1
    },
    disableInput: {
      type: Boolean,
      default: !1
    },
    inputWidth: {
      type: [Number, String],
      default: ""
    },
    size: {
      type: String,
      default: null
    }
  },
  emits: ["change", "blur", "subtract", "addit", "foucs", "update:modelValue"],
  setup(e, {
    slots: t,
    emit: l
  }) {
    const {
      parent: n
    } = j(), i = v(e.modelValue), s = f(() => e.size || (n == null ? void 0 : n.getProp("size"))), g = f(() => e.modelValue <= e.min || e.disabled), y = f(() => e.modelValue >= e.max || e.disabled), p = (a) => {
      let u = e.integer;
      return a.toString().replace(/([^0-9\.\-])/g, "").replace(/\./g, (r) => u ? "" : (u = !0, r)).replace(/\-/g, (r, c) => c === 0 ? "-" : "");
    }, o = (a) => {
      const u = p(a);
      i.value = u, l("update:modelValue", u), l("change", u);
    };
    V(() => e.modelValue, (a) => {
      i.value = a;
    });
    const x = (a) => l("focus", a), $ = (a) => {
      const {
        value: u
      } = a.target;
      o(u);
    }, _ = (a) => {
      const {
        value: u
      } = a.target, r = Number(p(u));
      if (r && r < e.min ? o(e.min) : r && r > e.max ? o(e.max) : r && o(r), n) {
        const {
          validateWithTrigger: c
        } = n;
        c("onBlur");
      }
      l("blur", a);
    }, I = () => {
      const a = Number(e.modelValue) - e.step;
      o(a), l("subtract", a);
    }, S = () => {
      const a = Number(e.modelValue) + e.step;
      o(a), l("addit", a);
    };
    return () => {
      const {
        min: a,
        max: u,
        inputWidth: r,
        placeholder: c,
        disabled: B,
        disableInput: h
      } = e;
      return d("div", {
        class: m({
          [s.value]: s.value
        })
      }, [t.subtraction ? t.subtraction() : d("button", {
        type: "button",
        disabled: g.value,
        class: [m("subtraction"), N("el", {
          clickable: !g.value
        })],
        onClick: I
      }, null), A(d("input", {
        type: "text",
        class: m("input", {
          "only-disable": h
        }),
        style: {
          width: O(r)
        },
        "onUpdate:modelValue": (C) => i.value = C,
        role: "spinbutton",
        inputmode: "decimal",
        "aria-min": a,
        "aria-max": u,
        "aria-valuenow": i.value,
        onInput: $,
        onBlur: _,
        onFocus: x,
        placeholder: c,
        disabled: B || h
      }, null), [[T, i.value]]), t.addition ? t.addition() : d("button", {
        type: "button",
        disabled: y.value,
        class: [m("addition"), N("el", {
          clickable: !y.value
        })],
        onClick: S
      }, null)]);
    };
  }
});
function L(e) {
  const t = e;
  return t.install = (l) => {
    const { name: n } = e;
    n && l.component(n, e);
  }, t;
}
const q = L(P);
export {
  q as default
};