import '@das-fed/upf-ui/packages/components/select-input/style.css';
import { withInstall as S } from "@das-fed/upf-utils/with-install/index";
import { computed as y, ref as w, defineComponent as F, openBlock as H, createBlock as z, unref as t, normalizeClass as k, isRef as x, createSlots as L, withCtx as b, createVNode as v } from "vue";
import { DasInput as E } from "@das-fed/upf-ui/packages/components/input/index";
import { DasIconSearch as W } from "@das-fed/upf-ui/packages/icons/search/index";
import { DasSelect as D } from "@das-fed/upf-ui/packages/components/select/index";
import { useModelValue as C } from "@das-fed/upf-utils/vue";
import "@das-fed/upf-ui/packages/global/theme";
const K = (e, a) => {
  const o = C(e, "modelValue"), i = C(e, "optionValue"), l = C(e, "isExpandAtFocus"), u = y(() => typeof e.width == "number" ? e.width + "px" : e == null ? void 0 : e.width), p = () => {
    a("update:modelValue", o.value);
  }, f = (n) => {
    a("update:modelValue", n), a("inputChange", n);
  }, m = (n) => {
    a("update:modelValue", n), a("dasInput", n);
  }, h = (n) => {
    a("update:optionValue", n), a("selectChange", n);
  }, s = w(""), d = w(!1);
  return {
    innerValue: o,
    selectValue: i,
    inputChangeHandler: f,
    selectChangeHandler: h,
    inputInputHandler: m,
    searchHandler: p,
    inputWidth: s,
    isFocus: d,
    onFocus: () => {
      var c;
      if (!l.value) return;
      let n = (c = u.value) == null ? void 0 : c.replace("px", "");
      s.value = u.value && n * 1 > 400 ? u.value : "400px", d.value = !0;
    },
    onBlur: () => {
      l.value && (s.value = "", d.value = !1);
    },
    isExpandInput: l,
    selectInputWidth: u
  };
}, N = /* @__PURE__ */ F({
  __name: "Index",
  props: {
    options: { default: [] },
    optionValue: { default: "" },
    optionsLabelKey: { default: "label" },
    optionsValueKey: { default: "value" },
    getPopupContainer: {},
    modelValue: { default: "" },
    hasIcon: { type: Boolean, default: !0 },
    maxLength: {},
    disabled: { type: Boolean },
    isView: { type: Boolean },
    error: { type: Boolean },
    isSearch: { type: Boolean, default: !1 },
    isExpandAtFocus: { type: Boolean, default: !1 },
    width: { default: "268px" },
    formSize: {}
  },
  emits: ["update:modelValue", "update:optionValue", "inputChange", "dasInput", "selectChange"],
  setup(e, { emit: a }) {
    const o = e, i = a, {
      innerValue: l,
      selectValue: u,
      inputChangeHandler: p,
      selectChangeHandler: f,
      inputInputHandler: m,
      searchHandler: h,
      inputWidth: s,
      isFocus: d,
      onFocus: g,
      onBlur: I,
      isExpandInput: n,
      selectInputWidth: c
    } = K(o, i), B = y(() => o.formSize);
    return (M, r) => (H(), z(t(E), {
      class: k(["das-select-input", { "is-error": e.error, "is-search": e.isSearch, "is-disabled": e.disabled }]),
      modelValue: t(l),
      "onUpdate:modelValue": r[1] || (r[1] = (V) => x(l) ? l.value = V : null),
      width: t(n) && t(d) ? t(s) : t(c),
      disabled: e.disabled,
      isView: e.isView,
      maxLength: e.maxLength,
      filterSpace: !1,
      isTitle: !e.isExpandAtFocus,
      onInput: t(m),
      onChange: t(p),
      onFocus: t(g),
      onBlur: t(I),
      size: B.value || "default"
    }, L({
      prepend: b(() => [
        v(t(D), {
          size: "mini",
          disabled: e.disabled,
          isView: e.isView,
          dropdownClassName: "das-select-input-select-container",
          modelValue: t(u),
          "onUpdate:modelValue": r[0] || (r[0] = (V) => x(u) ? u.value = V : null),
          width: "auto",
          dropdownMatchSelectWidth: !1,
          "border-type": "none",
          options: e.options,
          getPopupContainer: e.getPopupContainer,
          fieldNames: {
            value: e.optionsValueKey,
            label: e.optionsLabelKey
          },
          onChange: t(f)
        }, null, 8, ["disabled", "isView", "modelValue", "options", "getPopupContainer", "fieldNames", "onChange"])
      ]),
      _: 2
      /* DYNAMIC */
    }, [
      e.hasIcon ? {
        name: "suffix",
        fn: b(() => [
          v(t(W), {
            style: { cursor: "pointer" },
            onClick: t(h)
          }, null, 8, ["onClick"])
        ]),
        key: "0"
      } : void 0
    ]), 1032, ["class", "modelValue", "width", "disabled", "isView", "maxLength", "isTitle", "onInput", "onChange", "onFocus", "onBlur", "size"]));
  }
}), P = (e, a) => {
  const o = e.__vccOpts || e;
  for (const [i, l] of a)
    o[i] = l;
  return o;
}, A = /* @__PURE__ */ P(N, [["__scopeId", "data-v-c70ddced"]]), J = S(A);
export {
  J as DasSelectInput,
  J as default
};
