cc-ui-plus/dist/input/index.mjs

import { defineComponent as b, openBlock as f, createElementBlock as x, createElementVNode as y, provide as re, renderSlot as k, inject as j, computed as L, onBeforeMount as ue, h as se, createBlock as C, unref as a, withCtx as E, ref as $, watch as ie, normalizeClass as w, normalizeStyle as Q, resolveDynamicComponent as U, createCommentVNode as v, withDirectives as F, vModelText as ce, vModelDynamic as ae, createVNode as T, toDisplayString as K, nextTick as fe } from "vue";
function H(e, n) {
  return e.install = (t) => {
    t.component(n, e);
  }, e;
}
const de = {
  xmlns: "http://www.w3.org/2000/svg",
  "xmlns:xlink": "http://www.w3.org/1999/xlink",
  viewBox: "0 0 1024 1024"
}, he = /* @__PURE__ */ y(
  "path",
  {
    d: "M685.4 354.8c0-4.4-3.6-8-8-8l-66 .3L512 465.6l-99.3-118.4l-66.1-.3c-4.4 0-8 3.5-8 8c0 1.9.7 3.7 1.9 5.2l130.1 155L340.5 670a8.32 8.32 0 0 0-1.9 5.2c0 4.4 3.6 8 8 8l66.1-.3L512 564.4l99.3 118.4l66 .3c4.4 0 8-3.5 8-8c0-1.9-.7-3.7-1.9-5.2L553.5 515l130.1-155c1.2-1.4 1.8-3.3 1.8-5.2z",
    fill: "currentColor"
  },
  null,
  -1
), me = /* @__PURE__ */ y(
  "path",
  {
    d: "M512 65C264.6 65 64 265.6 64 513s200.6 448 448 448s448-200.6 448-448S759.4 65 512 65zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372s372 166.6 372 372s-166.6 372-372 372z",
    fill: "currentColor"
  },
  null,
  -1
), xe = [he, me], ge = b({
  name: "CloseCircleOutlined",
  render: function(n, t) {
    return f(), x("svg", de, xe);
  }
}), ye = {
  xmlns: "http://www.w3.org/2000/svg",
  "xmlns:xlink": "http://www.w3.org/1999/xlink",
  viewBox: "0 0 1024 1024"
}, pe = /* @__PURE__ */ y(
  "path",
  {
    d: "M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512C791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 0 0 0-51.5zm-63.57-320.64L836 122.88a8 8 0 0 0-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 0 0 0 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 0 0 0 11.31L155.17 889a8 8 0 0 0 11.31 0l712.15-712.12a8 8 0 0 0 0-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 0 0-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 0 1 146.2-106.69L401.31 546.2A112 112 0 0 1 396 512z",
    fill: "currentColor"
  },
  null,
  -1
), we = /* @__PURE__ */ y(
  "path",
  {
    d: "M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 0 0 227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 0 1-112 112z",
    fill: "currentColor"
  },
  null,
  -1
), ve = [pe, we], Ce = b({
  name: "EyeInvisibleOutlined",
  render: function(n, t) {
    return f(), x("svg", ye, ve);
  }
}), be = {
  xmlns: "http://www.w3.org/2000/svg",
  "xmlns:xlink": "http://www.w3.org/1999/xlink",
  viewBox: "0 0 1024 1024"
}, $e = /* @__PURE__ */ y(
  "path",
  {
    d: "M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 0 0 0 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3c7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176s176-78.8 176-176s-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112s112 50.1 112 112s-50.1 112-112 112z",
    fill: "currentColor"
  },
  null,
  -1
), Ee = [$e], ke = b({
  name: "EyeOutlined",
  render: function(n, t) {
    return f(), x("svg", be, Ee);
  }
});
function A(e, n, t) {
  let o = e;
  return n && (o += `__${n}`), t && (o += `--${t}`), o;
}
function ze(e) {
  const n = `cc-${e}`;
  return {
    b: () => A(n),
    e: (l) => l ? A(n, l) : "",
    m: (l) => l ? A(n, "", l) : "",
    em: (l, s) => l && s ? A(n, l, s) : ""
  };
}
function Ae(e) {
  let n = 0;
  for (let t = 0; t < e.length; ++t)
    e[t] === "&" && ++n;
  return n;
}
const J = /\s*,(?![^(]*\))\s*/g, Ie = /\s+/g;
function Be(e, n) {
  const t = [];
  return n.split(J).forEach((o) => {
    let r = Ae(o);
    if (r) {
      if (r === 1) {
        e.forEach((l) => {
          t.push(o.replace("&", l));
        });
        return;
      }
    } else {
      e.forEach((l) => {
        t.push(
          (l && l + " ") + o
        );
      });
      return;
    }
    let u = [
      o
    ];
    for (; r--; ) {
      const l = [];
      u.forEach((s) => {
        e.forEach((c) => {
          l.push(s.replace("&", c));
        });
      }), u = l;
    }
    u.forEach((l) => t.push(l));
  }), t;
}
function Se(e, n) {
  const t = [];
  return n.split(J).forEach((o) => {
    e.forEach((r) => {
      t.push((r && r + " ") + o);
    });
  }), t;
}
function Le(e) {
  let n = [""];
  return e.forEach((t) => {
    t = t && t.trim(), t && (t.includes("&") ? n = Be(n, t) : n = Se(n, t));
  }), n.join(", ").replace(Ie, " ");
}
const Te = /[A-Z]/g;
function X(e) {
  return e.replace(Te, (n) => "-" + n.toLowerCase());
}
function Me(e, n = "  ") {
  return typeof e == "object" && e !== null ? ` {
` + Object.entries(e).map((t) => n + `  ${X(t[0])}: ${t[1]};`).join(`
`) + `
` + n + "}" : `: ${e};`;
}
function Re(e, n, t) {
  return typeof e == "function" ? e({
    context: n.context,
    props: t
  }) : e;
}
function Z(e, n, t, o) {
  if (!n)
    return "";
  const r = Re(n, t, o);
  if (!r)
    return "";
  if (typeof r == "string")
    return `${e} {
${r}
}`;
  const u = Object.keys(r);
  if (u.length === 0)
    return t.config.keepEmptyBlock ? e + ` {
}` : "";
  const l = e ? [
    e + " {"
  ] : [];
  return u.forEach((s) => {
    const c = r[s];
    if (s === "raw") {
      l.push(`
` + c + `
`);
      return;
    }
    s = X(s), c != null && l.push(`  ${s}${Me(c)}`);
  }), e && l.push("}"), l.join(`
`);
}
function V(e, n, t) {
  !e || e.forEach((o) => {
    if (Array.isArray(o))
      V(o, n, t);
    else if (typeof o == "function") {
      const r = o(n);
      Array.isArray(r) ? V(r, n, t) : r && t(r);
    } else
      o && t(o);
  });
}
function Y(e, n, t, o, r, u) {
  const l = e.$;
  !l || typeof l == "string" ? n.push(l) : typeof l == "function" ? n.push(l({
    context: o.context,
    props: r
  })) : (l.before && l.before(o.context), !l.$ || typeof l.$ == "string" ? n.push(l.$) : l.$ && n.push(l.$({
    context: o.context,
    props: r
  })));
  const s = Le(n), c = Z(s, e.props, o, r);
  u && c && u.insertRule(c), !u && c.length && t.push(c), e.children && V(e.children, {
    context: o.context,
    props: r
  }, (d) => {
    if (typeof d == "string") {
      const p = Z(s, { raw: d }, o, r);
      u ? u.insertRule(p) : t.push(p);
    } else
      Y(d, n, t, o, r, u);
  }), n.pop(), l && l.after && l.after(o.context);
}
function _(e, n, t, o = !1) {
  const r = [];
  return Y(e, [], r, n, t, o ? e.instance.__styleSheet : void 0), o ? "" : r.join(`

`);
}
function je(e) {
  for (var n = 0, t, o = 0, r = e.length; r >= 4; ++o, r -= 4)
    t = e.charCodeAt(o) & 255 | (e.charCodeAt(++o) & 255) << 8 | (e.charCodeAt(++o) & 255) << 16 | (e.charCodeAt(++o) & 255) << 24, t = (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16), t ^= t >>> 24, n = (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16) ^ (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16);
  switch (r) {
    case 3:
      n ^= (e.charCodeAt(o + 2) & 255) << 16;
    case 2:
      n ^= (e.charCodeAt(o + 1) & 255) << 8;
    case 1:
      n ^= e.charCodeAt(o) & 255, n = (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16);
  }
  return n ^= n >>> 13, n = (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16), ((n ^ n >>> 15) >>> 0).toString(36);
}
function M(e) {
  if (!e)
    return;
  const n = e.parentElement;
  n && n.removeChild(e);
}
function q(e) {
  return document.querySelector(`style[cssr-id="${e}"]`);
}
function Ve(e) {
  const n = document.createElement("style");
  return n.setAttribute("cssr-id", e), n;
}
window && (window.__cssrContext = {});
function ee(e) {
  const n = e.getAttribute("mount-count");
  return n === null ? null : Number(n);
}
function N(e, n) {
  e.setAttribute("mount-count", String(n));
}
function G(e, n, t, o) {
  const { els: r } = n;
  if (t === void 0)
    r.forEach(M), n.els = [];
  else {
    const u = q(t);
    if (u && r.includes(u)) {
      const l = ee(u);
      o ? l === null ? console.error(`[css-render/unmount]: The style with target='${t}' is mounted in count mode.`) : l <= 1 ? (M(u), n.els = r.filter((s) => s !== u)) : N(u, l - 1) : l !== null ? console.error(`[css-render/unmount]: The style with target='${t}' is mounted in no-count mode.`) : (M(u), n.els = r.filter((s) => s !== u));
    }
  }
}
function Ne(e, n) {
  e.push(n);
}
function qe(e, n, t, o, r, u, l, s, c) {
  if (l && !c) {
    if (t === void 0) {
      console.error("[css-render/mount]: `id` is required in `boost` mode.");
      return;
    }
    const g = window.__cssrContext;
    g[t] || (g[t] = !0, _(n, e, o, l));
    return;
  }
  let d;
  const { els: p } = n;
  let h;
  if (t === void 0 && (h = n.render(o), t = je(h)), c) {
    c(t, h != null ? h : n.render(o));
    return;
  }
  const m = q(t);
  if (s || m === null) {
    if (d = m === null ? Ve(t) : m, h === void 0 && (h = n.render(o)), d.textContent = h, m !== null)
      return;
    if (r) {
      const g = document.head.getElementsByTagName("style")[0] || null;
      document.head.insertBefore(d, g);
    } else
      document.head.appendChild(d);
    u && N(d, 1), Ne(p, d);
  } else {
    const g = ee(m);
    u ? g === null ? console.error(`[css-render/mount]: The style with id='${t}' has been mounted in no-count mode.`) : N(m, g + 1) : g !== null && console.error(`[css-render/mount]: The style with id='${t}' has been mounted in count mode.`);
  }
  return m != null ? m : d;
}
function Oe(e) {
  return _(this, this.instance, e);
}
function Pe(e = {}) {
  const { target: n, id: t, ssr: o, props: r, count: u = !1, head: l = !1, boost: s = !1, force: c = !1 } = e;
  return qe(this.instance, this, t != null ? t : n, r, l, u, s, c, o);
}
function De(e = {}) {
  const { id: n, target: t, delay: o = 0, count: r = !1 } = e;
  o === 0 ? G(this.instance, this, n != null ? n : t, r) : setTimeout(() => G(this.instance, this, n != null ? n : t, r), o);
}
const I = function(e, n, t, o) {
  return {
    instance: e,
    $: n,
    props: t,
    children: o,
    els: [],
    render: Oe,
    mount: Pe,
    unmount: De
  };
}, We = function(e, n, t, o) {
  return Array.isArray(n) ? I(e, { $: null }, null, n) : Array.isArray(t) ? I(e, n, null, t) : Array.isArray(o) ? I(e, n, t, o) : I(e, n, t, null);
};
function Qe(e = {}) {
  let n = null;
  const t = {
    c: (...o) => We(t, ...o),
    use: (o, ...r) => o.install(t, ...r),
    find: q,
    context: {},
    config: e,
    get __styleSheet() {
      if (!n) {
        const o = document.createElement("style");
        return document.head.appendChild(o), n = document.styleSheets[document.styleSheets.length - 1], n;
      }
      return n;
    }
  };
  return t;
}
const { c: R } = Qe(), Ue = R(".xicon", {
  width: "1em",
  height: "1em",
  display: "inline-flex"
}, [
  R("svg", {
    width: "1em",
    height: "1em"
  }),
  R("svg:not([fill])", {
    fill: "currentColor"
  })
]), Fe = () => {
  Ue.mount({ id: "xicons-icon" });
}, ne = {
  size: [String, Number],
  color: String,
  tag: String
}, te = Symbol("IconConfigInjection");
b({
  name: "IconConfigProvider",
  props: ne,
  setup(e, { slots: n }) {
    return re(te, e), () => k(n, "default");
  }
});
const Ke = "span", Ze = b({
  name: "Icon",
  props: ne,
  setup(e, { slots: n }) {
    const t = j(te, null), o = L(() => {
      var l;
      const s = (l = e.size) !== null && l !== void 0 ? l : t == null ? void 0 : t.size;
      if (s !== void 0)
        return typeof s == "number" || /^\d+$/.test(s) ? `${s}px` : s;
    }), r = L(() => {
      const { color: l } = e;
      return l === void 0 ? t ? t.color : void 0 : l;
    }), u = L(() => {
      var l;
      const { tag: s } = e;
      return s === void 0 ? (l = t == null ? void 0 : t.tag) !== null && l !== void 0 ? l : Ke : s;
    });
    return ue(() => {
      Fe();
    }), () => se(u.value, {
      class: "xicon",
      style: {
        color: r.value,
        fontSize: o.value
      }
    }, [
      k(n, "default")
    ]);
  }
}), Ge = /* @__PURE__ */ b({
  __name: "icon",
  props: {
    color: { default: "inherit" },
    size: { default: 16 },
    tag: { default: "span" }
  },
  setup(e) {
    return (n, t) => (f(), C(a(Ze), {
      size: e.size,
      color: e.color,
      tag: e.tag
    }, {
      default: E(() => [
        k(n.$slots, "default")
      ]),
      _: 3
    }, 8, ["size", "color", "tag"]));
  }
}), B = H(Ge, "cc-icon"), He = ["maxlength"], Je = ["type", "placeholder", "readonly", "disabled", "maxlength"], Xe = /* @__PURE__ */ b({
  __name: "input",
  props: {
    modelValue: null,
    type: { default: "text" },
    placeholder: { default: "" },
    maxlength: null,
    minlength: null,
    clearable: { type: Boolean, default: !1 },
    disabled: { type: Boolean, default: !1 },
    readonly: { type: Boolean, default: !1 },
    showPassword: { type: Boolean, default: !1 },
    showWordLimit: { type: Boolean, default: !1 },
    prefixIcon: null,
    suffixIcon: null,
    rows: { default: 1 }
  },
  emits: [
    "update:modelValue",
    "input",
    "blur",
    "focus",
    "clear",
    "change"
  ],
  setup(e, { expose: n, emit: t }) {
    const o = e, r = ze("input"), u = j(
      "setValidateChangeFlag",
      void 0
    ), l = j(
      "setValidateBlurFlag",
      void 0
    ), s = $(0), c = $(0), d = $(), p = $(o.showPassword), h = $(o.modelValue), m = async () => {
      var i;
      await fe(), (i = d.value) == null || i.focus();
    }, g = () => {
      var i;
      return (i = d.value) == null ? void 0 : i.blur();
    }, O = (i) => {
      o.disabled || (t("update:modelValue", i.target.value), t("input", i.target.value), s.value++, u == null || u(s.value));
    }, P = (i) => {
      o.disabled || (t("blur", i), c.value++, l == null || l(c.value));
    }, D = (i) => {
      o.disabled || (u == null || u(0), l == null || l(0), t("focus", i));
    }, W = (i) => {
      t("change", i.target.value);
    }, oe = (i) => {
      t("update:modelValue", ""), t("clear", i), m();
    }, le = () => {
      p.value = !p.value, m();
    };
    return ie(
      () => o.modelValue,
      (i) => {
        h.value = i;
      }
    ), n({
      foucs: m,
      blur: g
    }), (i, z) => (f(), x("div", {
      class: w([a(r).b(), { "is-disabled": e.disabled }])
    }, [
      y("div", {
        class: w([a(r).e("wrapper"), `${e.disabled ? a(r).e("wrapper-disabled") : ""}`]),
        style: Q({ padding: e.type === "textarea" ? "0" : "0px 12px" })
      }, [
        i.$slots.prefix || e.prefixIcon ? (f(), x("span", {
          key: 0,
          style: { color: "#a8abb2" },
          class: w([a(r).e("wrapper-content")])
        }, [
          y("span", null, [
            e.prefixIcon ? (f(), C(a(B), { key: 0 }, {
              default: E(() => [
                (f(), C(U(e.prefixIcon)))
              ]),
              _: 1
            })) : k(i.$slots, "prefix", { key: 1 })
          ])
        ], 2)) : v("", !0),
        e.type === "textarea" ? F((f(), x("textarea", {
          key: 1,
          "onUpdate:modelValue": z[0] || (z[0] = (S) => h.value = S),
          class: w([a(r).e("textarea")]),
          style: Q([{ height: 40 * Number(e.rows) + "px" }, { width: "100%" }]),
          maxlength: e.maxlength,
          onInput: O,
          onBlur: P,
          onFocus: D,
          onChange: W
        }, null, 46, He)), [
          [ce, h.value]
        ]) : v("", !0),
        e.type === "text" ? F((f(), x("input", {
          key: 2,
          ref_key: "inputRef",
          ref: d,
          "onUpdate:modelValue": z[1] || (z[1] = (S) => h.value = S),
          type: `${p.value ? "password" : e.type}`,
          placeholder: e.placeholder,
          readonly: e.readonly,
          disabled: e.disabled,
          maxlength: Number(e.maxlength),
          class: w([a(r).e("input"), `${e.disabled ? a(r).e("input-disabled") : ""}`]),
          onInput: O,
          onBlur: P,
          onFocus: D,
          onChange: W
        }, null, 42, Je)), [
          [ae, h.value]
        ]) : v("", !0),
        i.$slots.suffix || e.suffixIcon ? (f(), x("span", {
          key: 3,
          style: { color: "#a8abb2" },
          class: w([a(r).e("input-wrapper")])
        }, [
          y("span", null, [
            e.suffixIcon ? (f(), C(a(B), { key: 0 }, {
              default: E(() => [
                (f(), C(U(e.suffixIcon)))
              ]),
              _: 1
            })) : k(i.$slots, "suffix", { key: 1 })
          ])
        ], 2)) : v("", !0),
        e.clearable && e.modelValue.length ? (f(), x("span", {
          key: 4,
          style: { color: "#a8abb2" },
          class: w([a(r).e("clear")]),
          onClick: oe
        }, [
          y("span", null, [
            T(a(B), null, {
              default: E(() => [
                T(a(ge))
              ]),
              _: 1
            })
          ])
        ], 2)) : v("", !0),
        e.showPassword && h.value.length ? (f(), x("span", {
          key: 5,
          style: { color: "#a8abb2" },
          class: w([a(r).e("password")]),
          onClick: le
        }, [
          y("span", null, [
            T(a(B), null, {
              default: E(() => [
                p.value ? (f(), C(a(ke), { key: 0 })) : (f(), C(a(Ce), { key: 1 }))
              ]),
              _: 1
            })
          ])
        ], 2)) : v("", !0),
        e.maxlength && e.showWordLimit ? (f(), x("div", {
          key: 6,
          class: w([a(r).e("limit")])
        }, K(h.value.length) + " / " + K(e.maxlength), 3)) : v("", !0)
      ], 6)
    ], 2));
  }
}), _e = H(Xe, "cc-input");
export {
  _e as default
};