@telia-ace/knowledge-widget-components-search 1.1.8 → 1.2.2

package/search-db55de94.mjs

@@ -1,981 +0,0 @@
-import { jsxs as O, jsx as y, Fragment as ke } from "react/jsx-runtime";
-import { css as j } from "@emotion/react";
-import z from "@emotion/styled";
-import { borderTabStyle as J, Text as se, Link as ie, SymbolBadge as X, useProperties as K, useDispatch as M, useRouteData as ae, useEventListener as U, useKeyPress as Q, Tooltip as xe, ItemTree as $e, contentBox as ce, useScroll as we, useContainer as le, Loader as Ce, useDebounce as Ae, usePrevious as ee, useChildren as Se, useWidgetEvent as ve, useTransitionEnd as Ie, convertToStringAttributes as Ee, Input as qe, Button as de } from "@telia-ace/knowledge-widget-ui";
-import { Component as ze } from "@telia-ace/widget-types-grid";
-import { appendClassNames as Y, deepClone as Le, categoryTrail as De } from "@telia-ace/widget-utilities";
-import { useRef as Z, useState as D, useCallback as I, useEffect as T, useMemo as Fe } from "react";
-const Ne = ({
-  text: e,
-  className: t,
-  filterType: o,
-  handleClick: c,
-  deleteAriaLabel: d = "",
-  ...l
-}) => {
-  const r = Z(), [w, k] = D(
-    document.activeElement === r.current
-  );
-  return /* @__PURE__ */ O(
-    se,
-    {
-      className: Y(
-        t,
-        "humany-filter-badge",
-        w ? "humany-filter-badge-focused" : ""
-      ),
-      onKeyDown: (x) => {
-        x.key === "Enter" && c(x, o);
-      },
-      children: [
-        e,
-        /* @__PURE__ */ y(
-          ie,
-          {
-            ...l,
-            ref: r,
-            tabIndex: 0,
-            onFocus: () => {
-              k(!0);
-            },
-            onBlur: () => {
-              k(!1);
-            },
-            role: "button",
-            "aria-label": d.replace("{{item}}", e),
-            onClick: (x) => c(x, o),
-            children: /* @__PURE__ */ y(X, { size: 13, symbol: { type: "Svg", content: "close" } })
-          }
-        )
-      ]
-    }
-  );
-}, Be = ({
-  inputHasFocus: e,
-  searchContainerRef: t,
-  showTag: o,
-  showGuideCategory: c,
-  position: d
-}) => {
-  const { activeFilterBadges: l, deleteFilterBadgeAriaLabel: r = "" } = K(), w = M(), { name: k, params: x } = ae(), [E, g] = D(!1), S = I((i) => {
-    const { key: a } = i;
-    ["ArrowLeft", "ArrowRight"].indexOf(a) === -1 && g(!1);
-  }, []);
-  U("keydown", S, window), U("click", S, window);
-  const { guideCategory: C, tag: m, tooltip: $ } = l || {}, u = (i) => {
-    const a = i.querySelectorAll(
-      ".humany-filter-badge > a"
-    );
-    return {
-      badges: a,
-      index: Array.from(a).findIndex((h) => document.activeElement === h)
-    };
-  }, n = I(
-    (i, a, h) => {
-      i.preventDefault(), w("quick-filter:remove", { types: [a], ids: [h] });
-    },
-    [w]
-  ), f = (i, a) => {
-    if (!t)
-      return;
-    const { badges: h, index: b } = u(t);
-    if (h.length) {
-      let q = null;
-      i === "left" ? b === -1 ? q = h.item(h.length - 1) : b > 0 && (q = h.item(b - 1)) : i === "right" && (b === h.length - 1 ? a && a.focus() : h.item(b + 1) && (q = h.item(b + 1))), q && (q.focus(), g(!0));
-    }
-  };
-  Q(
-    "ArrowLeft",
-    I(() => {
-      if (!t)
-        return;
-      const { index: i } = u(t);
-      if (e || i > -1) {
-        const a = t.querySelector('[data-type="search"]'), h = a && a.selectionStart !== null && a.selectionStart <= 0, b = i > -1;
-        (h || b) && f("left", a);
-      }
-    }, [e, t])
-  ), Q(
-    "ArrowRight",
-    I(() => {
-      if (!t)
-        return;
-      const { index: i } = u(t);
-      if (i > -1) {
-        const a = t.querySelector('[data-type="search"]');
-        i > -1 && f("right", a);
-      }
-    }, [t])
-  ), Q(
-    "Backspace",
-    I(
-      (i) => {
-        if (!t)
-          return;
-        let a = [];
-        const { index: h } = u(t), b = t.querySelector('[data-type="search"]');
-        if (h > -1)
-          h === 0 ? c ? a = ["guideCategory"] : o && (a = ["tag"]) : h === 1 && (a = ["tag"]);
-        else {
-          const p = document.activeElement === b;
-          b && b.selectionStart !== null && b.selectionStart <= 0 && p && (l != null && l.tag.length ? a = ["tag"] : l != null && l.guideCategory && (a = ["guideCategory"]));
-        }
-        if (a.length > 0) {
-          i.preventDefault();
-          let p;
-          if (a.includes("tag")) {
-            const F = l == null ? void 0 : l.tag.at(-1);
-            p = F == null ? void 0 : F.id;
-          }
-          w("quick-filter:remove", {
-            types: a,
-            ids: [p]
-          });
-        }
-      },
-      [
-        t,
-        l,
-        o,
-        c,
-        w
-      ]
-    )
-  );
-  const s = I(
-    (i) => i === "guideCategory" && C && c ? /* @__PURE__ */ y(
-      te,
-      {
-        text: `@${C.title}`,
-        routeName: k,
-        filterType: "guideCategory",
-        handleClick: n,
-        deleteAriaLabel: r,
-        params: {
-          ...x,
-          guideCategory: void 0
-        }
-      }
-    ) : i === "tag" && (m != null && m.length) && o ? m.map((a) => {
-      const h = m.reduce((b, q) => (q.id !== a.id && b.push(q.id), b), []);
-      return /* @__PURE__ */ y(
-        te,
-        {
-          className: "humany-filter-badge",
-          text: `#${a.title}`,
-          routeName: k,
-          filterType: "tag",
-          handleClick: (b) => n(b, "tag", a.id),
-          deleteAriaLabel: r,
-          params: {
-            ...x,
-            tag: h
-          }
-        },
-        a.id
-      );
-    }) : null,
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-      C,
-      m,
-      k,
-      x,
-      c,
-      o,
-      E,
-      n
-    ]
-  );
-  return !C && !m ? null : /* @__PURE__ */ O(Oe, { className: "humany-filter-badges", position: d, children: [
-    C && $ ? (
-      // eslint-disable-next-line react/jsx-no-useless-fragment
-      /* @__PURE__ */ y(xe, { content: /* @__PURE__ */ y(ke, { children: $ }), sticky: !1, children: s("guideCategory") })
-    ) : s("guideCategory"),
-    m && s("tag")
-  ] });
-}, Oe = z.div`
-  display: flex;
-  align-items: center;
-  flex-wrap: wrap;
-
-  ${(e) => {
-  var t, o;
-  return e.position === "inside" ? j`
-          &:not(:first-child) {
-            margin: 0 0 0 ${(t = e.theme.sizes) == null ? void 0 : t.normal};
-          }
-        ` : j`
-          margin: ${(o = e.theme.sizes) == null ? void 0 : o.small} 0 0 0;
-          span:first-child {
-            margin-left: 0;
-          }
-        `;
-}}
-`, te = z(Ne)`
-  display: flex;
-  align-items: center;
-  padding: ${(e) => {
-  var t, o;
-  return `${(t = e.theme.sizes) == null ? void 0 : t.small} calc(${(o = e.theme.sizes) == null ? void 0 : o.normal}/2) `;
-}};
-  background-color: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.primary;
-}};
-  border-radius: ${(e) => e.theme.borderRadius};
-  font-weight: 300;
-  font-size: ${(e) => {
-  var t;
-  return (t = e.theme.fonts) == null ? void 0 : t.normal;
-}};
-  font-style: italic;
-  color: #ffffff;
-  text-decoration: none;
-  white-space: nowrap;
-
-  margin: calc(${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.small;
-}} / 2);
-
-  &.humany-filter-badge-focused:focus-within {
-    ${J}
-    background-color: transparent;
-
-    svg {
-      path {
-        stroke: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.primary;
-}};
-      }
-    }
-    a {
-      outline: none;
-    }
-  }
-
-  svg {
-    width: 17px;
-    height: 11px;
-    margin: 1px 0 0 ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.small;
-}};
-    path {
-      stroke: #ffffff;
-      stroke-width: 2px;
-    }
-    order: 1;
-  }
-`, B = (e, t) => !t || !e ? !0 : e.toLowerCase().indexOf(t.toLowerCase()) > -1, Te = (e = [], t, o) => {
-  if (!o)
-    return e;
-  const c = Le(e);
-  if (t === "tag")
-    return c.filter((r) => B(r.title, o));
-  const d = je(c, o);
-  return ue(
-    c,
-    (r) => d.indexOf(r.id) > -1
-  );
-}, ue = (e, t) => e.filter((o) => (o.items && o.items.length && (o.items = ue(o.items, t)), t(o))), je = (e, t) => {
-  const c = fe(e).filter((l) => B(l.title, t)).map((l) => l.id);
-  let d = [];
-  return c.forEach((l) => {
-    const r = De(l, e);
-    d = d.concat(r);
-  }), d;
-}, fe = (e) => {
-  let t = [];
-  return e.forEach((o) => {
-    t.push(o), Array.isArray(o.items) && (t = t.concat(fe(o.items)));
-  }), t;
-}, G = (e) => {
-  const t = Array.from((e == null ? void 0 : e.getElementsByTagName("A")) || []).filter(
-    (o) => o.getAttribute("disabled") === null
-  );
-  return {
-    anchors: t,
-    focusedIndex: t.findIndex((o) => document.activeElement === o)
-  };
-}, Ke = (e) => e ? e.querySelector(
-  '[data-type="search"], input[type="search"]'
-) : null, H = (e) => {
-  if (!e)
-    return;
-  const t = Ke(e);
-  t && t.focus();
-}, Pe = ({
-  filterPhrase: e,
-  items: t,
-  filterType: o,
-  filterContainer: c,
-  searchContainer: d,
-  inputHasFocus: l
-}) => {
-  const [r, w] = D(t || []), [k, x] = D(null), E = M(), { activeFilterBadges: g, quickFilters: S } = K(), C = typeof S == "object" && !!S.autoSelect || typeof S == "boolean" && !!S;
-  T(() => {
-    w(Te(t, o, e));
-  }, [e, o, t]), T(() => {
-    var u;
-    if (c) {
-      const { anchors: n } = G(c), f = (u = n[0]) == null ? void 0 : u.getAttribute("data-id");
-      f && x(f);
-    }
-  }, [r, c]);
-  const m = I(
-    (u, n) => {
-      let f = ((g == null ? void 0 : g.tag) || []).map((i) => i.id);
-      n === "tag" && u.id && (f = f.includes(u.id) ? f.filter((i) => i !== u.id) : [...f, u.id]);
-      const s = {
-        category: g != null && g.guideCategory ? g.guideCategory.id : void 0,
-        tagIds: f
-      };
-      n === "guideCategory" && (s.category = u.id), E("quick-filter:add", s);
-    },
-    [g, E]
-  ), $ = (u) => u === "guideCategory" ? {
-    renderItem: (n, f) => /* @__PURE__ */ y(
-      re,
-      {
-        autoSelect: C && l && n.id === k,
-        disabled: !B(n.title, e),
-        tabIndex: B(n.title, e) ? 0 : -1,
-        onKeyDown: (s) => {
-          s.key === "Enter" && m(n, u);
-        },
-        "data-level": f,
-        onClick: () => {
-          m(n, u);
-        },
-        "data-id": n.id,
-        children: /* @__PURE__ */ y(
-          oe,
-          {
-            title: n.title,
-            phrase: e,
-            matches: B(n.title, e)
-          }
-        )
-      }
-    )
-  } : {
-    renderLi: !0,
-    renderItem: (n) => /* @__PURE__ */ y(
-      re,
-      {
-        autoSelect: C && l && n.id === k,
-        onKeyDown: (f) => {
-          f.key === "Enter" && m(n, u);
-        },
-        onClick: () => {
-          m(n, u);
-        },
-        "data-id": n.id,
-        children: /* @__PURE__ */ y(
-          oe,
-          {
-            symbol: "#",
-            title: n.title,
-            phrase: e,
-            matches: B(n.title, e)
-          }
-        )
-      }
-    )
-  };
-  return U(
-    "keydown",
-    (u) => {
-      var q;
-      const { key: n } = u;
-      if (!c || !(n === "ArrowDown" || n === "ArrowUp" || n === "Enter"))
-        return;
-      const { anchors: f, focusedIndex: s } = G(c);
-      if (n === "Enter") {
-        if (l && C) {
-          const p = (q = f[0]) == null ? void 0 : q.getAttribute("data-id");
-          p && m({ id: p }, o);
-        }
-        return;
-      }
-      const i = () => {
-        var p;
-        return (p = f[0]) == null ? void 0 : p.focus();
-      }, a = () => {
-        var p;
-        return (p = f[f.length - 1]) == null ? void 0 : p.focus();
-      }, h = () => {
-        var p;
-        return (p = f[s + 1]) == null ? void 0 : p.focus();
-      }, b = () => {
-        var p;
-        return (p = f[s - 1]) == null ? void 0 : p.focus();
-      };
-      l ? (u.preventDefault(), n === "ArrowDown" ? i() : a()) : s > -1 && (u.preventDefault(), n === "ArrowDown" ? f.length > s + 1 ? h() : H(d) : s - 1 < 0 ? H(d) : b());
-    },
-    window
-  ), /* @__PURE__ */ y(
-    $e,
-    {
-      tree: r,
-      renderEmpty: !1,
-      ulProps: { role: "listbox" },
-      liProps: { role: "option" },
-      ...$(o)
-    }
-  );
-}, oe = ({
-  title: e,
-  phrase: t,
-  matches: o,
-  symbol: c = ""
-}) => {
-  const d = () => {
-    if (!o || !t)
-      return [e];
-    const k = e.toLowerCase().indexOf(t.toLowerCase()), x = e.substr(0, k), E = e.slice(k, k + t.length), g = e.substr(k + t.length);
-    return [x, E, g];
-  }, [l, r, w] = d();
-  return /* @__PURE__ */ O(se, { children: [
-    c,
-    l,
-    r ? /* @__PURE__ */ y("strong", { children: r }) : null,
-    w || null
-  ] });
-}, We = j`
-  opacity: 0.5;
-  pointer-events: none;
-`, ne = (e) => {
-  var t, o;
-  return j`
-  background-color: ${(t = e.theme.colors) == null ? void 0 : t.text};
-  color: #ffffff;
-  outline: none;
-
-  span:first-child {
-    border-color: ${(o = e.theme.colors) == null ? void 0 : o.text};
-  }
-`;
-}, re = z(ie)`
-  display: block;
-  text-decoration: none;
-  font-size: ${(e) => {
-  var t;
-  return (t = e.theme.fonts) == null ? void 0 : t.normal;
-}};
-
-  ${(e) => e.disabled && We}
-  color: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.text;
-}};
-  background-color: transparent;
-
-  span {
-    display: block;
-    ${(e) => {
-  var t, o, c, d;
-  return e["data-level"] ? `padding: calc(${(t = e.theme.sizes) == null ? void 0 : t.normal} / 2) ${(o = e.theme.sizes) == null ? void 0 : o.normal};` : `padding: calc(${(c = e.theme.sizes) == null ? void 0 : c.normal} / 2) ${(d = e.theme.sizes) == null ? void 0 : d.medium};  `;
-}}
-    ${(e) => e["data-level"] && "border-left: 2px solid"}
-  }
-
-  span:first-child {
-    border-color: #e7e7e7;
-  }
-
-  ${(e) => {
-  var t;
-  return e["data-level"] && `padding: 0 calc(${(t = e.theme.sizes) == null ? void 0 : t.medium} * ${e["data-level"]});`;
-}}
-
-  ${(e) => e.autoSelect && ne}
-
-  &:hover,
-  &:focus {
-    ${ne}
-  }
-`, Me = ({ phrase: e = "", inputHasFocus: t, searchContainerRef: o }) => {
-  const {
-    quickFilter: c = {
-      open: !1,
-      loading: !1,
-      symbol: "",
-      type: "",
-      items: []
-    },
-    activeFilterBadges: d,
-    noMatchesLabel: l = "No matching items"
-  } = K(), [r, w] = we(!0), k = le(), { events: x } = k.get("$widget"), E = Z(), g = I(
-    (s) => (s && s.addEventListener(
-      "keydown",
-      () => {
-        G(s).focusedIndex > -1 && x.subscribeOnce("router:changed", () => {
-          H(o);
-        });
-      },
-      !0
-    ), E.current = s, s),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [o]
-  ), { items: S = [], symbol: C, type: m, open: $, loading: u } = c, n = Fe(() => {
-    const s = ((d == null ? void 0 : d.tag) || []).map((i) => i.id);
-    return S.filter((i) => !s.includes(i.id));
-  }, [S, d]);
-  if (!$ || !C)
-    return null;
-  const f = e.slice(e.indexOf(C) + 1);
-  return /* @__PURE__ */ O(
-    Qe,
-    {
-      ref: g,
-      "data-loading": u,
-      className: Y(
-        "humany-quick-filter-dropdown",
-        [m === "guideCategory", "humany-quick-filter-guide-categories"],
-        [m === "tag", "humany-quick-filter-tags"]
-      ),
-      children: [
-        /* @__PURE__ */ y(Xe, { className: "humany-quick-filter-dropdown-inner", css: r, ref: w, children: n.length > 0 ? /* @__PURE__ */ y(
-          Pe,
-          {
-            filterType: m,
-            items: n,
-            filterPhrase: f,
-            filterContainer: w.current,
-            searchContainer: o,
-            inputHasFocus: t
-          }
-        ) : /* @__PURE__ */ y(Ue, { children: l }) }),
-        /* @__PURE__ */ y(Ce, { loading: u })
-      ]
-    }
-  );
-}, Qe = z.div`
-  ${(e) => ce(e)};
-  position: absolute;
-  top: calc(100% + ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
-}});
-  left: 0;
-  right: 0;
-  z-index: 1;
-  overflow: hidden;
-`, Xe = z.div`
-  max-height: 300px;
-  overflow: auto;
-  padding: ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.medium;
-}} 0;
-  ${(e) => e.css}
-  ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-  }
-  li div {
-    ${(e) => {
-  var t;
-  return `margin: ${(t = e.theme.sizes) == null ? void 0 : t.normal} 0;`;
-}}
-  }
-`, Ue = z.p`
-  margin: 0 ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
-}};
-  color: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.text;
-}};
-`, W = (e, t) => {
-  if (e && !t || !e && t)
-    return !0;
-  if (e && t) {
-    if (!Array.isArray(e) && !Array.isArray(t)) {
-      if (e.id !== t.id)
-        return !0;
-    } else if (!((c, d) => c.length === d.length ? c.every((l, r) => l === d[r]) : !1)(e, t))
-      return !0;
-  }
-  return !1;
-}, Ge = (e, t = {}, o = !0) => {
-  const c = M(), {
-    quickFilters: d = !1,
-    quickFilter: l = { open: !1 },
-    activeFilterBadges: r,
-    filterBadges: w = !1,
-    incremental: k = 600
-  } = K(), x = Ae(
-    e,
-    typeof k == "boolean" ? 600 : k
-  ), E = ee(x), g = ee(r), S = Z(null), C = I(
-    (n = "") => {
-      var f;
-      if (w) {
-        const s = W(
-          r == null ? void 0 : r.guideCategory,
-          g == null ? void 0 : g.guideCategory
-        ) || W(r == null ? void 0 : r.tag, g == null ? void 0 : g.tag);
-        return c("search", {
-          value: n,
-          filtersChanged: s,
-          filters: {
-            tagIds: ((r == null ? void 0 : r.tag) || []).map((i) => i.id),
-            guideCategoryId: ((f = r == null ? void 0 : r.guideCategory) == null ? void 0 : f.id) || null
-          }
-        });
-      }
-      return c("search", { value: n });
-    },
-    [c, r]
-  ), m = I(
-    (n) => {
-      c("clear", { navigateToHome: n });
-    },
-    [c]
-  ), $ = (n) => d ? n.replace(/([@#].*)/g, "") : n, u = I(
-    (n) => {
-      if (l.open && n.preventDefault) {
-        n.preventDefault();
-        return;
-      }
-      const f = document.activeElement, s = S.current && typeof S.current.contains == "function" ? S.current.contains(f) : !1, i = $(e);
-      typeof n == "boolean" && n || i.length && s || r != null && r.guideCategory || r != null && r.tag.length && s ? C(i) : m(s);
-    },
-    [
-      S,
-      e,
-      l,
-      m,
-      r,
-      C
-    ]
-  );
-  return T(() => {
-    const n = W(
-      r == null ? void 0 : r.guideCategory,
-      g == null ? void 0 : g.guideCategory
-    ) || W(r == null ? void 0 : r.tag, g == null ? void 0 : g.tag), f = x && $(x), s = E && $(E);
-    typeof s < "u" && s !== f && f !== t.phrase && o && !l.open && u(n);
-  }, [x, l.open, r, u]), T(() => {
-    if (e && d) {
-      const n = typeof d == "boolean" && !!d || typeof d == "object" && !!d.guideCategory, f = typeof d == "boolean" && !!d || typeof d == "object" && !!d.tag;
-      n && e.indexOf("@") === e.length - 1 && c("quick-filter:open", { type: "guideCategory", symbol: "@" }), f && e.indexOf("#") === e.length - 1 && c("quick-filter:open", { type: "tag", symbol: "#" });
-    }
-    l.open && e.indexOf("@") === -1 && e.indexOf("#") === -1 && c("quick-filter:close");
-  }, [e]), [u, m, S];
-}, rt = ({ className: e, ...t }) => {
-  const {
-    showSearchButton: o,
-    showClearButton: c,
-    role: d = "search",
-    autoFocus: l,
-    placeholder: r,
-    searchButtonLabel: w,
-    clearButtonLabel: k,
-    ariaLabel: x,
-    route: E = "search",
-    incremental: g = !0,
-    showChildren: S = !1,
-    quickFilter: C,
-    quickFilters: m,
-    filterBadges: $
-  } = K(), { params: u } = ae(), [n, f] = D(!1), [s, i] = D(u.phrase || ""), [a, h] = D({
-    guideCategory: !1,
-    tag: !1
-  }), b = le(), q = Se(), p = M(), { position: F = "inside" } = typeof $ == "object" ? $ : {};
-  T(() => {
-    const { guideCategory: A, tag: v } = u, L = typeof $ == "object" ? !!$.guideCategory : !!$, be = typeof $ == "object" ? !!$.tag : !!$;
-    h({
-      guideCategory: L && !!A,
-      tag: be && !!v
-    });
-  }, [$, u]), ve(
-    "router:changed",
-    () => {
-      if (C) {
-        const { open: A, symbol: v } = C;
-        if (A) {
-          if (v) {
-            const L = s.replace(
-              s.slice(s.indexOf(v)),
-              ""
-            );
-            i(L);
-          }
-          p("quick-filter:close");
-        }
-      }
-    },
-    [C, s, i, p]
-  );
-  const [_, P, N] = Ge(s, u, !!g);
-  T(() => {
-    i(u.phrase || "");
-  }, [u.phrase]);
-  const ge = I(
-    (A) => {
-      i(A);
-    },
-    [i]
-  ), me = I(() => {
-    p("quick-filter:close").then(() => P(!0));
-  }, [p, P]), he = I(() => {
-    var A, v;
-    l && !n && ((v = (A = N.current) == null ? void 0 : A.getElementsByTagName("input")[0]) == null || v.focus());
-  }, [l, n, N]), pe = I(() => {
-    b.getAsync("router").then((A) => {
-      const v = A.getInitialRoute(), L = A.getRouteData();
-      (v == null ? void 0 : v.name) === L.name && (v == null ? void 0 : v.name) !== E ? i("") : P(!0);
-    });
-  }, [b, i, P]), R = (A) => {
-    if (A !== F)
-      return null;
-    if (a.guideCategory || a.tag)
-      return /* @__PURE__ */ y(
-        Be,
-        {
-          position: A,
-          inputHasFocus: n,
-          showGuideCategory: a.guideCategory,
-          showTag: a.tag,
-          searchContainerRef: N.current
-        }
-      );
-  };
-  Ie(he);
-  const V = c && (a.guideCategory || a.tag || s), ye = m ? Ee({
-    role: "combobox",
-    "aria-autocomplete": "list",
-    autoComplete: "off",
-    "aria-haspopup": "listbox"
-  }) : {};
-  return /* @__PURE__ */ O(
-    He,
-    {
-      ...t,
-      ref: N,
-      role: d,
-      className: Y(e, "humany-search"),
-      "data-has-phrase": !!s,
-      "data-has-focus": n,
-      "data-has-search-symbol": o ? "true" : "false",
-      children: [
-        /* @__PURE__ */ O(
-          Je,
-          {
-            action: ".",
-            onSubmit: (A) => {
-              var v, L;
-              A.preventDefault(), (L = (v = N.current) == null ? void 0 : v.getElementsByTagName("input")[0]) == null || L.blur();
-            },
-            "data-has-focus": n,
-            children: [
-              o && /* @__PURE__ */ y(
-                Ye,
-                {
-                  "aria-label": w,
-                  type: "submit",
-                  title: w,
-                  disabled: !s,
-                  onClick: _,
-                  "data-has-phrase": !!s,
-                  "data-has-focus": n,
-                  children: /* @__PURE__ */ y(
-                    X,
-                    {
-                      size: 32,
-                      symbol: { type: "Svg", content: "search" }
-                    }
-                  )
-                }
-              ),
-              R("inside"),
-              /* @__PURE__ */ y(
-                qe,
-                {
-                  crossOrigin: void 0,
-                  type: "search",
-                  "aria-label": x,
-                  ...ye,
-                  placeholder: a.guideCategory || a.tag ? "" : r,
-                  onFocusChange: f,
-                  onEscape: me,
-                  onEnter: _,
-                  onChange: ge,
-                  value: s
-                }
-              ),
-              V && /* @__PURE__ */ y(
-                Ze,
-                {
-                  "aria-label": k,
-                  type: "reset",
-                  hasFocus: n,
-                  title: k,
-                  onClick: pe,
-                  children: /* @__PURE__ */ y(X, { size: 27, symbol: { type: "Svg", content: "clear" } })
-                }
-              ),
-              S && !V && q.map((A) => /* @__PURE__ */ y(ze, { id: A.id, branch: "default" }, A.id)),
-              /* @__PURE__ */ y(
-                Me,
-                {
-                  inputHasFocus: n,
-                  phrase: s,
-                  searchContainerRef: N.current
-                }
-              )
-            ]
-          }
-        ),
-        R("below")
-      ]
-    }
-  );
-}, He = z.div`
-  ${ce};
-  width: 100%;
-  padding: ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.large;
-}};
-
-  input {
-    background-color: transparent;
-    border: none;
-    outline: none;
-    min-width: 25%;
-    flex: 1;
-    font-size: ${(e) => {
-  var t;
-  return (t = e.theme.fonts) == null ? void 0 : t.normal;
-}};
-    font-weight: 300;
-    font-style: italic;
-    padding: 1em 0;
-    color: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.text;
-}};
-    -webkit-appearance: none;
-
-    ${(e) => {
-  var t;
-  return e["data-has-search-symbol"] === "true" && `text-indent: ${(t = e.theme.sizes) == null ? void 0 : t.normal};`;
-}}
-
-    ::placeholder {
-      color: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.text;
-}};
-    }
-    /* removes the 'X' from IE */
-    &[type='search']::-ms-clear {
-      display: none;
-      width: 0;
-      height: 0;
-    }
-    &[type='search']::-ms-reveal {
-      display: none;
-      width: 0;
-      height: 0;
-    }
-
-    /* removes the 'X' from Chrome */
-    &[type='search']::-webkit-search-decoration,
-    &[type='search']::-webkit-search-cancel-button,
-    &[type='search']::-webkit-search-results-button,
-    &[type='search']::-webkit-search-results-decoration {
-      display: none;
-    }
-
-    &:focus {
-      outline: none;
-    }
-  }
-
-  button {
-    background: transparent;
-    border: none;
-    padding: 0;
-    font-size: ${(e) => {
-  var t;
-  return (t = e.theme.fonts) == null ? void 0 : t.large;
-}};
-    transition: color 200ms ease-out;
-    color: ${(e) => {
-  var t;
-  return e["data-has-focus"] || e["data-has-phrase"] ? (t = e.theme.colors) == null ? void 0 : t.primary : "#000000";
-}};
-    cursor: pointer;
-    > svg {
-      height: 100%;
-    }
-  }
-`, Je = z.form`
-  display: flex;
-  flex-wrap: nowrap;
-  align-items: center;
-  border: ${(e) => e.theme.inputBorder};
-  border-radius: ${(e) => e.theme.borderRadius};
-  background-color: #ffffff;
-  position: relative;
-  padding: 0 ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
-}};
-
-  ${(e) => {
-  var t, o;
-  return e["data-has-focus"] && j`
-      ${(t = e.theme.accessibility) != null && t.isTabbing ? J(e) : `
-        border-color: ${(o = e.theme.colors) == null ? void 0 : o.primary};
-        outline: none;
-        input {
-          outline: none;
-        }
-      `}
-    `;
-}};
-`, Ye = z(de)`
-  padding: 0;
-  height: 2em;
-
-  svg {
-    circle,
-    line {
-      stroke: ${(e) => {
-  var t;
-  return e["data-has-focus"] ? (t = e.theme.colors) == null ? void 0 : t.primary : "#000000";
-}};
-    }
-  }
-`, Ze = z(de)`
-  &:focus-visible svg {
-    ${J}
-  }
-
-  svg {
-    vertical-align: top;
-
-    circle,
-    line,
-    path {
-      stroke: ${(e) => {
-  var t, o;
-  return e.hasFocus ? (t = e.theme.colors) == null ? void 0 : t.primary : (o = e.theme.colors) == null ? void 0 : o.text;
-}};
-    }
-  }
-`;
-export {
-  rt as default
-};