@devgateway/dvz-ui-react 1.4.0 → 1.5.1

package/dist/esm/layout/SearchControl.js

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