/* empty css                                               */
/* empty css                                                */
/* empty css                                               */
/* empty css                                               */
/* empty css                                                */
import { getCurrentInstance, computed, ref, watch, createElementBlock, openBlock, Fragment, createVNode, withDirectives, renderSlot, mergeProps, unref, isRef, createSlots, renderList, withCtx, createElementVNode, toDisplayString, createTextVNode, vModelText } from "vue";
import { getUnit, textFormatter, textFormatter4Input, reverseTextFormatter } from "../../../utils/formatterUtil.mjs";
import { useCursor } from "../../../utils/use-cursor.mjs";
/* empty css            */
import { Field } from "../../../../node_modules/vant/es/field/index.mjs";
const _sfc_main = {
  __name: "Field",
  props: {
    modelValue: {
      type: String,
      default: ""
    },
    fieldType: {
      type: String
    },
    disabled: {
      type: Boolean,
      default: false
    },
    readonly: {
      type: Boolean,
      default: false
    },
    clickable: {
      type: Boolean,
      default: false
    },
    dataFormatter: {
      type: String,
      default: ""
    },
    showUnit: {
      type: Boolean,
      default: true
    },
    maxlength: {
      type: Number,
      default: 0
    },
    formData: Object
  },
  emits: ["openPicker", "update:modelValue"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const instance = getCurrentInstance();
    const ctx = instance.proxy;
    const realMaxLength = computed(() => {
      return Math.floor(props.maxLength / (ctx.$dbFieldLengthRatio || 1)) || "-";
    });
    const unit = ref("");
    const fieldInputRef = ref();
    const [recordCursor, setCursor] = useCursor();
    const emit = __emit;
    const textValue = ref("");
    const compValue = computed({
      get: () => props.modelValue,
      set: (val) => {
        emit("update:modelValue", val);
      }
    });
    watch(
      () => props.modelValue,
      (newVal) => {
        unit.value = getUnit(props.dataFormatter);
        if (!props.fieldType || props.fieldType === "text") {
          textValue.value = textFormatter(newVal, props.dataFormatter);
        } else {
          textValue.value = newVal;
        }
      },
      { immediate: true, flush: "post" }
    );
    const compClickable = computed(() => {
      if (props.disabled || props.readonly) {
        return false;
      }
      return true;
    });
    var isComposing = false;
    const handleInput = (e) => {
      if (isComposing) return;
      const inputElement = e.target;
      recordCursor(inputElement);
      inputElement.value = textFormatter4Input(
        inputElement.value,
        props.dataFormatter
      );
      setCursor(inputElement);
      const unformattedValue = reverseTextFormatter(
        inputElement.value,
        props.dataFormatter
      );
      compValue.value = unformattedValue;
    };
    const handleCompositionStart = () => {
      isComposing = true;
    };
    const handleCompositionEnd = (e) => {
      isComposing = false;
      doSomethingFunction(e);
    };
    const doSomethingFunction = (e) => {
      const inputElement = e.target;
      recordCursor(inputElement);
      inputElement.value = textFormatter4Input(
        inputElement.value,
        props.dataFormatter
      );
      setCursor(inputElement);
      const unformattedValue = reverseTextFormatter(
        inputElement.value,
        props.dataFormatter
      );
      compValue.value = unformattedValue;
    };
    return (_ctx, _cache) => {
      const _component_van_field = Field;
      return openBlock(), createElementBlock(Fragment, null, [
        createVNode(_component_van_field, mergeProps(_ctx.$attrs, {
          type: _ctx.$attrs.type == "number" ? "text" : _ctx.$attrs.type,
          modelValue: unref(textValue),
          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(textValue) ? textValue.value = $event : null),
          maxlength: unref(realMaxLength),
          disabled: __props.disabled,
          readonly: __props.readonly,
          clearable: "",
          clickable: unref(compClickable),
          "clear-trigger": "focus",
          onClick: _cache[1] || (_cache[1] = ($event) => !__props.disabled && emit("openPicker")),
          ref_key: "fieldInputRef",
          ref: fieldInputRef,
          onInput: handleInput,
          onCompositionstart: handleCompositionStart,
          onCompositionend: handleCompositionEnd,
          "input-align": "right"
        }), createSlots({ _: 2 }, [
          renderList(_ctx.$slots, (item, key) => {
            return {
              name: key,
              fn: withCtx(() => [
                renderSlot(_ctx.$slots, key)
              ])
            };
          }),
          __props.disabled ? {
            name: "input",
            fn: withCtx(() => [
              createElementVNode("div", null, toDisplayString(unref(textValue)), 1)
            ]),
            key: "0"
          } : void 0,
          __props.showUnit && unref(unit) ? {
            name: "button",
            fn: withCtx(() => [
              createTextVNode(toDisplayString(unref(unit)), 1)
            ]),
            key: "1"
          } : void 0
        ]), 1040, ["type", "modelValue", "maxlength", "disabled", "readonly", "clickable"]),
        withDirectives(createElementVNode("input", {
          type: "hidden",
          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(compValue) ? compValue.value = $event : null)
        }, null, 512), [
          [vModelText, unref(compValue)]
        ]),
        renderSlot(_ctx.$slots, "default")
      ], 64);
    };
  }
};
export {
  _sfc_main as default
};
