import { defineComponent as O, toRefs as $, computed as _, resolveComponent as o, resolveDirective as A, createBlock as s, openBlock as d, unref as a, normalizeClass as E, createSlots as U, withCtx as n, createVNode as p, createElementVNode as j, createCommentVNode as m, renderSlot as z, createTextVNode as K, toDisplayString as W, withDirectives as H } from "vue";
import { z as P, D as R, _ as T } from "./install-BuMO14Rb.js";
const q = { class: "wt-search-bar__icon-controls" }, F = /* @__PURE__ */ O({
  __name: "wt-search-bar",
  props: {
    v: {
      type: Object
    },
    customValidators: {
      type: Array,
      default: () => []
    },
    /**
     * Current search-bar value (`v-model`)
     */
    value: {
      type: String,
      default: ""
    },
    /**
     * search-bar placeholder
     */
    placeholder: {
      type: String
    },
    hint: {
      type: String,
      description: 'Adds hint icon + tooltip with text, passed as "hint" prop'
    },
    searchMode: {
      type: [
        String,
        Object
      ]
    },
    searchModeOptions: {
      type: Array,
      default: () => []
    },
    /**
     * When true, width is unset (parent controls width). When false, uses --wt-search-bar-width.
     */
    fullWidth: {
      type: Boolean,
      default: !1
    }
  },
  emits: ["input", "search", "enter", "update:search-mode", "change:search-mode"],
  setup(t, { emit: k }) {
    const c = t, l = k, { v: f, customValidators: v } = $(c), { invalid: i } = P({
      v: f,
      customValidators: v
    }), u = _(
      () => i.value ? "error" : "default"
    ), S = _(
      () => c.value || c.searchMode || c.hint
    ), w = R((e) => {
      l("search", e);
    }, 1e3);
    function h(e) {
      l("input", e), w(e);
    }
    function g(e) {
      e.key === "Enter" ? (w(e.target.value), e.preventDefault()) : e.key === "Esc" && (h(""), e.preventDefault());
    }
    function x({ option: e }) {
      l("update:search-mode", e), l("change:search-mode", e);
    }
    return (e, y) => {
      const C = o("wt-icon"), b = o("wt-icon-btn"), M = o("wt-hint"), V = o("wt-radio"), B = o("wt-context-menu"), D = o("wt-input-text"), I = A("tooltip");
      return d(), s(D, {
        "model-value": t.value,
        placeholder: t.placeholder || e.$t("webitelUI.searchBar.placeholder"),
        invalid: a(i),
        class: E(["wt-search-bar", { "wt-search-bar--full-width": t.fullWidth }]),
        type: "search",
        v: a(f),
        "custom-validators": a(v),
        "onUpdate:modelValue": h,
        onKeyup: g
      }, U({
        prefix: n(() => [
          p(C, {
            color: u.value,
            icon: t.searchMode?.icon || "search"
          }, null, 8, ["color", "icon"])
        ]),
        _: 2
      }, [
        S.value ? {
          name: "suffix",
          fn: n(() => [
            j("div", q, [
              t.value ? (d(), s(b, {
                key: 0,
                color: u.value,
                class: "wt-search-bar__reset-icon-btn",
                icon: "close",
                onClick: y[0] || (y[0] = (r) => h(""))
              }, null, 8, ["color"])) : m("", !0),
              t.hint ? (d(), s(M, {
                key: 1,
                "icon-color": u.value
              }, {
                default: n(() => [
                  K(W(t.hint), 1)
                ], void 0, !0),
                _: 1
              }, 8, ["icon-color"])) : m("", !0),
              t.searchMode ? (d(), s(B, {
                key: 2,
                options: t.searchModeOptions,
                onClick: x
              }, {
                activator: n(({ toggle: r }) => [
                  H(p(b, {
                    color: a(i) ? "error" : "default",
                    icon: "filter",
                    onClick: r
                  }, null, 8, ["color", "onClick"]), [
                    [I, e.$t("webitelUI.searchBar.settingsHint")]
                  ])
                ]),
                option: n(({ value: r, text: N }) => [
                  p(V, {
                    label: N,
                    selected: (typeof t.searchMode == "string" ? t.searchMode : t.searchMode.value) === r,
                    value: !0
                  }, null, 8, ["label", "selected"])
                ]),
                _: 1
              }, 8, ["options"])) : m("", !0),
              z(e.$slots, "additional-actions", { invalid: a(i) }, void 0, !0)
            ])
          ]),
          key: "0"
        } : void 0
      ]), 1032, ["model-value", "placeholder", "invalid", "class", "v", "custom-validators"]);
    };
  }
}), L = /* @__PURE__ */ T(F, [["__scopeId", "data-v-0b6f18a7"]]);
export {
  L as default
};
