import { jsx as t, jsxs as S, Fragment as L } from "react/jsx-runtime";
import { useState as v, useEffect as w, useContext as _, useRef as E } from "react";
import { utils as x, SearchProvider as T, SearchContext as b } from "@devgateway/wp-react-lib";
import z from "./CustomSemanticSearch.js";
import { createPortal as P } from "react-dom";
import { Icon as F } from "semantic-ui-react";
import { injectIntl as I, IntlProvider as $ } from "react-intl";
const C = (n, s) => {
  if (!n || !s) return n || "";
  const o = new RegExp(`(${s})`, "gi");
  return n.replace(o, "<strong>$1</strong>");
}, N = I(
  ({
    ID: n,
    title: s,
    slug: o,
    parent_title: i,
    parent_slug: e,
    parent_link: r,
    extract: a,
    type: l,
    link: d,
    terms: y,
    subtype: p,
    bread_crumbs: u = [],
    metadata: c,
    intl: { locale: m },
    searchTerm: g
    // Added searchTerm prop
  }) => {
    let h = r ? x.replaceLink(r, m) + `#${o}` : x.replaceLink(d, m);
    const f = c == null ? void 0 : c.redirect_url;
    h = f ? f + `#${o}` : h;
    const M = C(String(s), g), R = C(a, g);
    return /* @__PURE__ */ t(
      "div",
      {
        className: "search-results-wrapper searching-results",
        style: { display: "flex", flexDirection: "column" },
        children: /* @__PURE__ */ S(
          "div",
          {
            className: "has-standard-12-font-size",
            onClick: (q) => document.location.href = h,
            children: [
              /* @__PURE__ */ t(
                "h5",
                {
                  className: "breadcrumbs-search",
                  dangerouslySetInnerHTML: {
                    __html: u && u.length > 0 ? C(u.join(" / "), g) : ""
                  }
                }
              ),
              /* @__PURE__ */ t("div", { className: "has-standard-14-font-size", children: /* @__PURE__ */ t(
                "h4",
                {
                  className: "search-title",
                  dangerouslySetInnerHTML: {
                    __html: M
                  }
                }
              ) }),
              /* @__PURE__ */ t(
                "div",
                {
                  className: "search-content",
                  dangerouslySetInnerHTML: {
                    __html: x.replaceHTMLinks(R, m)
                  }
                }
              )
            ]
          }
        )
      }
    );
  }
), j = ({ results: n, meta: s, perPage: o, intl: i, searchTerm: e }) => {
  const r = s ? s["x-wp-total"] : 0;
  return s && s["x-wp-totalpages"], /* @__PURE__ */ S("div", { id: "float-results-container", children: [
    /* @__PURE__ */ t("span", { className: "float-results-header", children: i.formatMessage(
      {
        id: "search.results.summary",
        defaultMessage: "{count} of {total} Results"
      },
      { count: r < o ? r : o, total: r }
    ) }),
    n.map((a) => /* @__PURE__ */ t(N, { ...a, searchTerm: e }, a.ID))
  ] });
}, k = ({
  onSearch: n,
  perPage: s,
  loading: o,
  results: i,
  meta: e,
  intl: r,
  searchTerm: a
}) => (e && e["x-wp-total"], e && e["x-wp-totalpages"], /* @__PURE__ */ t(
  "input",
  {
    placeholder: r.formatMessage({
      id: "search.placeholder",
      defaultMessage: "Search..."
    }),
    type: "text",
    className: "input search",
    name: "search",
    value: a,
    onChange: (l) => {
      n(l.target.value);
    }
  }
)), D = ({
  onSearch: n,
  onSetSelected: s,
  perPage: o,
  loading: i,
  results: e,
  meta: r,
  locale: a,
  intl: l,
  searchTerm: d,
  // Added search from SearchConsumer
  selected: y
  // Added selected prop to track menu selection
}) => {
  const [p, u] = v(!1), c = E(null), m = () => {
    u(!1);
  };
  return w(() => {
    const h = document.createElement("div");
    h.setAttribute("id", "float-input-container"), h.setAttribute("class", "input container"), h.style.display = "none";
    const f = document.getElementById("root");
    return f && (f.appendChild(h), c.current = h), () => {
      c.current && c.current.parentNode && c.current.parentNode.removeChild(c.current);
    };
  }, []), w(() => {
    c.current && (c.current.style.display = p ? "block" : "none");
  }, [p]), /* @__PURE__ */ S(L, { children: [
    /* @__PURE__ */ t(
      "div",
      {
        id: "ui-float-search",
        className: `ui float-search${p ? " ui-float-search-active" : ""}`,
        onMouseOver: () => {
          u(!0);
        },
        children: /* @__PURE__ */ t(F, { name: "search", size: "small" })
      }
    ),
    c.current && P(
      p ? /* @__PURE__ */ S("div", { onMouseLeave: m, children: [
        /* @__PURE__ */ t("div", { className: "float-search-container", children: /* @__PURE__ */ t(
          k,
          {
            onSearch: n,
            perPage: o,
            loading: i,
            results: e,
            meta: r,
            intl: l,
            searchTerm: d
          }
        ) }),
        e && e.length > 0 && /* @__PURE__ */ t($, { locale: a, children: /* @__PURE__ */ t(
          j,
          {
            results: e,
            meta: r,
            perPage: o,
            intl: l,
            searchTerm: d
          }
        ) })
      ] }) : null,
      c.current
    )
  ] });
}, H = ({ onSearch: n, perPage: s, loading: o, results: i, meta: e, intl: r }) => {
  const a = e ? e["x-wp-total"] : 0, l = e ? e["x-wp-totalpages"] : 0, [d, y] = v("");
  w(() => {
    const u = setTimeout(() => {
      n(d);
    }, 300);
    return () => clearTimeout(u);
  }, [d]);
  const p = (u) => /* @__PURE__ */ t(N, { ...u, searchTerm: d });
  return /* @__PURE__ */ t(
    z,
    {
      value: d,
      loading: o,
      placeholder: r.formatMessage({
        id: "search.placeholder",
        defaultMessage: "Search..."
      }),
      onResultSelect: (u, c) => null,
      total: a,
      perPage: s,
      totalPages: l,
      onSearchChange: (u, c) => {
        y(c.value);
      },
      resultRenderer: p,
      results: i,
      showNoResults: !1,
      intl: r,
      searchTerm: d
    }
  );
}, U = I((n) => {
  const { intl: s, onSetSelected: o } = n, [i, e] = v(""), [r, a] = v(!1);
  return w(() => {
    const l = () => {
      a(window.innerWidth <= 1365);
    };
    return l(), window.addEventListener("resize", l), () => window.removeEventListener("resize", l);
  }, []), /* @__PURE__ */ t(T, { search: i, perPage: 5, locale: s.locale, children: /* @__PURE__ */ t(
    A,
    {
      ...n,
      onSetSelected: o,
      setQuery: e,
      query: i,
      isSmallScreen: r,
      intl: s
    }
  ) });
}), A = ({ onSetSelected: n, selected: s, setQuery: o, query: i, isSmallScreen: e, intl: r, ...a }) => {
  const l = _(b);
  return a.settings.react_search_type === "floating" || e ? /* @__PURE__ */ t(
    D,
    {
      onSetSelected: n,
      selected: s,
      onSearch: o,
      perPage: 5,
      intl: r,
      ...a,
      ...l,
      searchTerm: i
    }
  ) : /* @__PURE__ */ t(
    H,
    {
      onSetSelected: n,
      onSearch: o,
      perPage: 5,
      intl: r,
      ...a,
      ...l
    }
  );
};
export {
  U as default
};
