@craterapp/vue-sdk/dist/PhoneType-7z0wZZBx.js

Embedded Invoicing & Bill Pay for platforms.

import { c as s, t as c, r as m, a as p, u as f, d as v, b as q } from "./index-IlzZ4Xqv.js";
import { defineComponent as y, computed as _, resolveDirective as $, openBlock as b, createBlock as S, unref as a, withCtx as V, withDirectives as g, createVNode as h } from "vue";
const x = /* @__PURE__ */ y({
  __name: "PhoneType",
  props: {
    modelValue: {
      type: String,
      default: null
    },
    requirements: {
      type: Array,
      default: () => []
    },
    field: {
      type: Object,
      required: !0
    },
    placeholder: {
      type: String,
      default: ""
    },
    validationScope: {
      type: String,
      required: !0
    },
    step: {
      type: Object,
      required: !0
    }
  },
  setup(e) {
    const r = e, l = {
      value: {
        required: s.withMessage(
          c("validation.required"),
          m(r.field.is_required)
        )
      }
    }, t = p(
      l,
      _(() => r.field),
      { $scope: r.validationScope }
    );
    return f(), (k, i) => {
      const o = v, u = q, d = $("maska");
      return b(), S(u, {
        label: e.field.label,
        required: !!e.field.is_required,
        error: a(t).value.$error && a(t).value.$errors[0].$message
      }, {
        default: V(() => [
          g(h(o, {
            modelValue: e.field.value,
            "onUpdate:modelValue": i[0] || (i[0] = (n) => e.field.value = n),
            type: "tel",
            "inline-addon": "+1",
            invalid: a(t).value.$error
          }, null, 8, ["modelValue", "invalid"]), [
            [d, "##########"]
          ])
        ]),
        _: 1
      }, 8, ["label", "required", "error"]);
    };
  }
});
export {
  x as default
};