(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(".pl-text-field{--pl-text-field-text-color: var(--txt-01);--contour-color: var(--txt-01);--label-color: var(--txt-01);--contour-border-width: 1px;--contour-box-shadow: none;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--prefix-color: var(--color-placeholder);--show-clearable: none;width:100%;min-width:160px;min-height:var(--control-height);position:relative;border-radius:var(--border-radius-control);display:flex;flex-direction:row;align-items:center;outline:none}.pl-text-field__envelope{font-family:var(--font-family-base)}.pl-text-field input{font-family:var(--font-family-base);font-weight:500;min-height:calc(var(--control-height) - 2px);line-height:20px;width:100%;padding:0 12px;border:none;font-size:inherit;background-color:transparent;color:var(--pl-text-field-text-color);caret-color:var(--border-color-focus);cursor:inherit}.pl-text-field input:focus{outline:none}.pl-text-field input::placeholder{color:var(--color-placeholder)}.pl-text-field label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-text-field label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-text-field__contour{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--border-radius-control);border-width:var(--contour-border-width);border-color:var(--contour-color);border-style:solid;box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none}.pl-text-field__prefix{padding-left:12px;white-space:nowrap;margin-right:-12px;color:var(--prefix-color)}.pl-text-field__append{padding-right:12px;display:flex;flex-direction:row;align-items:center;gap:4px;cursor:text}.pl-text-field__append .icon-16{cursor:pointer}.pl-text-field__append .mask-16{--icon-color: var(--control-mask-fill);cursor:pointer}.pl-text-field__clearable{display:var(--show-clearable)!important;--icon-color: var(--ic-02) !important}.pl-text-field__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-text-field__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-text-field:hover{--contour-color: var(--control-hover-color);--show-clearable: inline-block}.pl-text-field:focus-within{--show-clearable: inline-block}.pl-text-field:focus-within:not(.error){--label-color: var(--txt-focus);--contour-color: var(--border-color-focus);--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--border-color-focus-shadow)}.pl-text-field:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.pl-text-field.dashed .pl-text-field__contour{border-style:dashed}.pl-text-field.nonEmpty{--prefix-color: var(--txt-01)}.pl-text-field.error{--contour-color: var(--txt-error);--label-color: var(--txt-error)}.pl-text-field.disabled{--contour-color: var(--color-dis-01);--label-color: var(--dis-01);--pl-text-field-text-color: var(--dis-01);--mask-icon-bg-color: var(--dis-01);cursor:not-allowed}")),document.head.appendChild(o)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
import { defineComponent as I, mergeModels as N, useSlots as $, useModel as O, ref as m, reactive as T, computed as s, createElementBlock as d, openBlock as t, createElementVNode as c, createCommentVNode as i, normalizeClass as j, withDirectives as z, createVNode as L, createBlock as p, unref as n, toDisplayString as f, withCtx as U, renderSlot as E, vModelDynamic as A, withModifiers as V } from "vue";
import G from "../../assets/images/required.svg.js";
import { getErrorMessage as H } from "../../helpers/error.js";
import J from "../../utils/DoubleContour.vue.js";
import { useLabelNotch as K } from "../../utils/useLabelNotch.js";
import { useValidation as Q } from "../../utils/useValidation.js";
import W from "../PlIcon16/PlIcon16.vue.js";
import X from "../PlIcon24/PlIcon24.vue.js";
import Y from "../PlSvg/PlSvg.vue.js";
import Z from "../PlTooltip/PlTooltip.vue.js";

const ee = { class: "pl-text-field__envelope" }, le = {
  key: 0,
  ref: "label"
}, oe = {
  key: 1,
  class: "pl-text-field__prefix"
}, re = ["disabled", "placeholder", "type"], te = {
  key: 0,
  class: "pl-text-field__error"
}, ae = {
  key: 1,
  class: "pl-text-field__helper"
}, se = {
  name: "PlTextField"
}, be = /* @__PURE__ */ I({
  ...se,
  props: /* @__PURE__ */ N({
    label: {},
    clearable: { type: [Boolean, Function] },
    parse: { type: Function },
    required: { type: Boolean },
    error: {},
    helper: {},
    placeholder: {},
    disabled: { type: Boolean },
    dashed: { type: Boolean },
    prefix: {},
    rules: {},
    type: {}
  }, {
    modelValue: {
      required: !0
    },
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(h) {
    const C = $(), o = O(h, "modelValue"), l = h, y = m(void 0), b = m(), u = m(!1), a = T({
      cached: void 0
    }), v = s({
      get() {
        return a.cached ? a.cached.value : o.value === void 0 || o.value === null ? "" : String(o.value);
      },
      set(e) {
        if (a.cached = void 0, l.parse)
          try {
            o.value = l.parse(e);
          } catch (r) {
            a.cached = {
              error: r instanceof Error ? r.message : String(r),
              value: e
            };
          }
        else
          o.value = e;
      }
    }), M = s(() => l.type && l.type === "password" ? u.value ? "text" : l.type : "text"), S = s(() => u.value ? "view-show" : "view-hide"), B = () => {
      l.clearable && (a.cached = void 0, o.value = l.clearable === !0 ? "" : l.clearable());
    }, _ = Q(v, l.rules || []), F = s(() => l.clearable ? l.clearable === !0 ? o.value === "" : o.value === l.clearable() : o.value === ""), k = s(() => !F.value), w = s(() => {
      const e = [], r = H(l.error);
      return r && e.push(r), a.cached && e.push(a.cached.error), _.value.isValid || e.push(..._.value.errors), e;
    }), g = s(() => w.value.length > 0), P = s(() => l.clearable && k.value && l.type !== "password" && !l.disabled), R = () => u.value = !u.value, D = () => {
      a.cached = void 0;
    }, q = () => {
      var e;
      return (e = b.value) == null ? void 0 : e.focus();
    };
    return K(y), (e, r) => (t(), d("div", ee, [
      c("div", {
        ref_key: "rootRef",
        ref: y,
        class: j(["pl-text-field", {
          error: g.value,
          disabled: e.disabled,
          dashed: e.dashed,
          nonEmpty: k.value
        }])
      }, [
        e.label ? (t(), d("label", le, [
          e.required ? (t(), p(n(Y), {
            key: 0,
            uri: n(G)
          }, null, 8, ["uri"])) : i("", !0),
          c("span", null, f(e.label), 1),
          n(C).tooltip ? (t(), p(n(Z), {
            key: 1,
            class: "info",
            position: "top"
          }, {
            tooltip: U(() => [
              E(e.$slots, "tooltip")
            ]),
            _: 3
          })) : i("", !0)
        ], 512)) : i("", !0),
        e.prefix ? (t(), d("div", oe, f(e.prefix), 1)) : i("", !0),
        z(c("input", {
          ref_key: "inputRef",
          ref: b,
          "onUpdate:modelValue": r[0] || (r[0] = (x) => v.value = x),
          disabled: e.disabled,
          placeholder: e.placeholder || "...",
          type: M.value,
          spellcheck: "false",
          onFocusout: D
        }, null, 40, re), [
          [A, v.value]
        ]),
        c("div", {
          class: "pl-text-field__append",
          onClick: q
        }, [
          P.value ? (t(), p(n(W), {
            key: 0,
            class: "pl-text-field__clearable",
            name: "delete-clear",
            onClick: V(B, ["stop"])
          })) : i("", !0),
          e.type === "password" ? (t(), p(n(X), {
            key: 1,
            name: S.value,
            style: { cursor: "pointer" },
            onClick: V(R, ["stop"])
          }, null, 8, ["name"])) : i("", !0),
          E(e.$slots, "append")
        ]),
        L(J, { class: "pl-text-field__contour" })
      ], 2),
      g.value ? (t(), d("div", te, f(w.value.join(" ")), 1)) : e.helper ? (t(), d("div", ae, f(e.helper), 1)) : i("", !0)
    ]));
  }
});
export {
  be as default
};
//# sourceMappingURL=PlTextField.vue.js.map
