searchmate-js - npm Package Compare versions

Comparing version 1.9.0 to 2.0.0

dist/index.js

@@ -1,14 +0,14 @@
-const H = "https://search-worker.searchmateapp.workers.dev/v1", R = "heading", C = ".searchmate-result-part", m = "searchmate-result-selected", _ = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={1.5} stroke="currentColor" class="searchmate-search-icon">
+const R = "https://search-worker.searchmateapp.workers.dev/v1", q = "heading", k = ".searchmate-result-part", v = "searchmate-result-selected", B = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={1.5} stroke="currentColor" class="searchmate-search-icon">
 <path strokeLinecap="round" class strokeLinejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" />
 </svg>
-`, $ = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="searchmate-path-icon">
+`, D = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="searchmate-path-icon">
 <path stroke-linecap="round" stroke-linejoin="round" d="M13.19 8.688a4.5 4.5 0 011.242 7.244l-4.5 4.5a4.5 4.5 0 01-6.364-6.364l1.757-1.757m13.35-.622l1.757-1.757a4.5 4.5 0 00-6.364-6.364l-4.5 4.5a4.5 4.5 0 001.242 7.244" />
 </svg>
-`, B = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="searchmate-hash-icon">
+`, F = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="searchmate-hash-icon">
 <path fill-rule="evenodd" d="M9.493 2.853a.75.75 0 00-1.486-.205L7.545 6H4.198a.75.75 0 000 1.5h3.14l-.69 5H3.302a.75.75 0 000 1.5h3.14l-.435 3.148a.75.75 0 001.486.205L7.955 14h2.986l-.434 3.148a.75.75 0 001.486.205L12.456 14h3.346a.75.75 0 000-1.5h-3.14l.69-5h3.346a.75.75 0 000-1.5h-3.14l.435-3.147a.75.75 0 00-1.486-.205L12.045 6H9.059l.434-3.147zM8.852 7.5l-.69 5h2.986l.69-5H8.852z" clip-rule="evenodd" />
 </svg>
-`, F = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="searchmate-x-notfound-circle">
+`, U = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="searchmate-x-notfound-circle">
 <path stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
 </svg>
-`, U = `<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" class="searchmate-logo">
+`, P = `<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" class="searchmate-logo">
 <g clip-path="url(#clip0_102_15)">
@@ -25,59 +25,59 @@ <rect width="40" height="40" rx="4" fill="#EF4444"/>
 `;
-function g(n, e, o) {
-  const t = document.createElement(n);
-  return o.forEach((r) => t.classList.add(r)), e.appendChild(t), t;
+function L(n, t, r) {
+  const e = document.createElement(n);
+  return r.forEach((o) => e.classList.add(o)), t.appendChild(e), e;
 }
-function h(n, e) {
-  const o = document.createElement(n);
-  return e && e.forEach((t) => o.classList.add(t)), o;
+function d(n, t) {
+  const r = document.createElement(n);
+  return t && t.forEach((e) => r.classList.add(e)), r;
 }
-function q(n, e) {
-  const o = h("a", [
+function Y(n, t) {
+  const r = d("a", [
     "searchmate-result-part",
     "searchmate-result-path"
-  ]), t = h("p", ["searchmate-result-path-header"]);
-  t.innerHTML += $;
-  const r = h("span");
-  r.textContent = `/${n}`, t.appendChild(r), o.appendChild(t);
-  const c = e ? `${e}/${n}` : `/${n}`;
-  return o.setAttribute("href", c), o;
+  ]), e = d("p", ["searchmate-result-path-header"]);
+  e.innerHTML += D;
+  const o = d("span");
+  o.textContent = `/${n}`, e.appendChild(o), r.appendChild(e);
+  const i = t ? `${t}/${n}` : `/${n}`;
+  return r.setAttribute("href", i), r;
 }
-function D(n, e, o, t) {
-  const r = h("a", [
+function j(n, t, r, e) {
+  const o = d("a", [
     "searchmate-result-part",
     "searchmate-result-heading"
   ]);
-  r.innerHTML += B, r.innerHTML += n;
-  const c = t ? `${t}/${e}` : `/${e}`;
-  return r.setAttribute("href", `${c}#${o}`), r;
+  o.innerHTML += F, o.innerHTML += n;
+  const i = e ? `${e}/${t}` : `/${t}`;
+  return o.setAttribute("href", `${i}#${r}`), o;
 }
-function P(n) {
-  const e = h("div", [
+function K(n) {
+  const t = d("div", [
     "searchmate-result-other",
     "markdown-body"
   ]);
-  return e.innerHTML += n, e;
+  return t.innerHTML += n, t;
 }
-function Y(n, e) {
-  const o = h("div", ["searchmate-result"]), t = q(n.path, e);
-  return o.appendChild(t), n.content.forEach((c) => {
-    if (c.type === R) {
-      const i = D(
-        c.content,
+function W(n, t) {
+  const r = d("div", ["searchmate-result"]), e = Y(n.path, t);
+  return r.appendChild(e), n.content.forEach((i) => {
+    if (i.type === q) {
+      const c = j(
+        i.content,
         n.path,
-        c.headingId,
-        e
+        i.headingId,
+        t
       );
-      o.appendChild(i);
+      r.appendChild(c);
     } else {
-      if (c.type === "yaml")
+      if (i.type === "yaml")
         return;
-      const i = P(c.content);
-      t.appendChild(i);
+      const c = K(i.content);
+      e.appendChild(c);
     }
-  }), o;
+  }), r;
 }
-function k(n, e) {
-  const t = e.querySelectorAll(C)[n];
-  return t ? (t.classList.add(m), t.scrollIntoView({
+function y(n, t) {
+  const e = t.querySelectorAll(k)[n];
+  return e ? (e.classList.add(v), e.scrollIntoView({
     behavior: "smooth",
@@ -87,176 +87,189 @@ block: "center"
 }
-function S(n, e) {
-  const t = e.querySelectorAll(C)[n];
-  t && t.classList.remove(m);
+function A(n, t) {
+  const e = t.querySelectorAll(k)[n];
+  e && e.classList.remove(v);
 }
-function j(n, e) {
-  const o = n.clientX, t = n.clientY, r = e.querySelectorAll(C);
-  let c = -1;
-  for (let i = 0; i < r.length; i++) {
-    const u = r[i], { top: s, bottom: f, left: p, right: l } = u.getBoundingClientRect();
-    t >= s && t <= f && o >= p && o <= l ? (c = i, u.classList.add(m)) : r[i].classList.remove(m);
+function z(n, t) {
+  const r = n.clientX, e = n.clientY, o = t.querySelectorAll(k);
+  let i = -1;
+  for (let c = 0; c < o.length; c++) {
+    const u = o[c], { top: h, bottom: f, left: s, right: m } = u.getBoundingClientRect();
+    e >= h && e <= f && r >= s && r <= m ? (i = c, u.classList.add(v)) : o[c].classList.remove(v);
   }
-  return c;
+  return i;
 }
-function W(n, e) {
-  const o = n.touches[0].clientX, t = n.touches[0].clientY, r = e.querySelectorAll(C);
-  let c = -1;
-  for (let i = 0; i < r.length; i++) {
-    const u = r[i], { top: s, bottom: f, left: p, right: l } = u.getBoundingClientRect();
-    t >= s && t <= f && o >= p && o <= l ? (c = i, u.classList.add(m)) : r[i].classList.remove(m);
+function X(n, t) {
+  const r = n.touches[0].clientX, e = n.touches[0].clientY, o = t.querySelectorAll(k);
+  let i = -1;
+  for (let c = 0; c < o.length; c++) {
+    const u = o[c], { top: h, bottom: f, left: s, right: m } = u.getBoundingClientRect();
+    e >= h && e <= f && r >= s && r <= m ? (i = c, u.classList.add(v)) : o[c].classList.remove(v);
   }
-  return c;
+  return i;
 }
-function z(n) {
-  const e = h("div", ["searchmate-not-found"]);
-  e.innerHTML += F;
-  const o = h("p", ["searchmate-not-found-text"]);
-  o.textContent = "No results found for ";
-  const t = h("span", ["searchmate-not-found-query"]);
-  return t.textContent = `"${n}"`, o.appendChild(t), e.appendChild(o), e;
+function G(n) {
+  const t = d("div", ["searchmate-not-found"]);
+  t.innerHTML += U;
+  const r = d("p", ["searchmate-not-found-text"]);
+  r.textContent = "No results found for ";
+  const e = d("span", ["searchmate-not-found-query"]);
+  return e.textContent = `"${n}"`, r.appendChild(e), t.appendChild(r), t;
 }
-function X() {
-  const n = h("div", ["searchmate-initial-content"]), e = h("p", [
+function O() {
+  const n = d("div", ["searchmate-initial-content"]), t = d("p", [
     "searchmate-initial-content-text"
   ]);
-  return e.textContent = "What are you looking for?", n.appendChild(e), n;
+  return t.textContent = "What are you looking for?", n.appendChild(t), n;
 }
-function K() {
-  const n = h("div", ["searchmate-footer"]), e = h("p", ["searchmate-footer-text"]);
-  e.textContent = "Powered by ";
-  const o = h("a", ["searchmate-footer-link"]);
-  return o.textContent = "Search Mate", o.setAttribute("href", "https://searchmate.app"), e.appendChild(o), n.appendChild(e), n.innerHTML += U, n;
+function Q() {
+  const n = d("div", ["searchmate-footer"]), t = d("p", ["searchmate-footer-text"]);
+  t.textContent = "Powered by ";
+  const r = d("a", ["searchmate-footer-link"]);
+  return r.textContent = "Search Mate", r.setAttribute("href", "https://searchmate.app"), t.appendChild(r), n.appendChild(t), n.innerHTML += P, n;
 }
-var N = G;
-function G(n, e, o) {
-  var t = null, r = null, c = function() {
-    t && (clearTimeout(t), r = null, t = null);
-  }, i = function() {
-    var s = r;
-    c(), s && s();
+var V = Z;
+function Z(n, t, r) {
+  var e = null, o = null, i = function() {
+    e && (clearTimeout(e), o = null, e = null);
+  }, c = function() {
+    var h = o;
+    i(), h && h();
   }, u = function() {
-    if (!e)
+    if (!t)
       return n.apply(this, arguments);
-    var s = this, f = arguments, p = o && !t;
-    if (c(), r = function() {
-      n.apply(s, f);
-    }, t = setTimeout(function() {
-      if (t = null, !p) {
-        var l = r;
-        return r = null, l();
+    var h = this, f = arguments, s = r && !e;
+    if (i(), o = function() {
+      n.apply(h, f);
+    }, e = setTimeout(function() {
+      if (e = null, !s) {
+        var m = o;
+        return o = null, m();
       }
-    }, e), p)
-      return r();
+    }, t), s)
+      return o();
   };
-  return u.cancel = c, u.flush = i, u;
+  return u.cancel = i, u.flush = c, u;
 }
-function O({
+function J({
   appId: n,
-  urlPrefix: e = void 0,
-  onClose: o = void 0
+  urlPrefix: t = void 0,
+  onClose: r = void 0,
+  overrideNavigateToResult: e = void 0
 }) {
-  const t = document.body, r = g("div", t, [
+  const o = document.body;
+  if (o.querySelector("#searchmate-docs-search"))
+    return;
+  const c = L("div", o, [
     "searchmate-container"
   ]);
-  r.id = "searchmate-docs-search";
-  const c = g("div", r, [
+  c.id = "searchmate-docs-search";
+  const u = L("div", c, [
     "searchmate-search-container"
-  ]), i = g("div", c, [
+  ]), h = L("div", u, [
     "searchmate-input-container"
   ]);
-  i.innerHTML += _;
-  const u = g("input", i, [
+  h.innerHTML += B;
+  const f = L("input", h, [
     "searchmate-search-input"
   ]);
-  u.setAttribute("placeholder", "Type to search...");
-  const s = g("div", c, [
+  f.setAttribute("placeholder", "Type to search...");
+  const s = L("div", u, [
     "searchmate-results-container"
-  ]), f = K();
-  c.appendChild(f);
-  const p = X();
-  s.appendChild(p);
-  let l = 0;
-  function b({ query: a, appId: d }) {
+  ]), m = Q();
+  u.appendChild(m);
+  const H = O();
+  s.appendChild(H);
+  let p = 0;
+  function _({ query: a, appId: l }) {
     if (a.length <= 0)
       return;
-    const L = new URL(H);
-    L.searchParams.set("query", a), L.searchParams.set("appId", d), fetch(L).then(async (v) => {
-      const w = await v.json();
-      if (!v.ok)
-        throw new Error(w.error);
-      return w;
-    }).then((v) => {
-      s.innerHTML = "", l = 0;
-      const w = v.results;
-      if (w.length <= 0) {
-        const E = z(a);
-        s.appendChild(E);
+    const x = new URL(R);
+    x.searchParams.set("query", a), x.searchParams.set("appId", l), fetch(x).then(async (g) => {
+      const C = await g.json();
+      if (!g.ok)
+        throw new Error(C.error);
+      return C;
+    }).then((g) => {
+      s.innerHTML = "", p = 0;
+      const C = g.results;
+      if (C.length <= 0) {
+        const w = G(a);
+        s.appendChild(w);
         return;
       }
-      w.forEach((E) => {
-        const A = Y(E, e);
-        s.appendChild(A);
-      }), k(l, s);
-    }).catch((v) => {
+      C.forEach((w) => {
+        const E = W(w, t);
+        s.appendChild(E);
+      }), y(p, s), e && s.querySelectorAll("a").forEach((w) => {
+        w.addEventListener("click", (E) => {
+          E.preventDefault(), e(w.href, E.ctrlKey);
+        });
+      });
+    }).catch((g) => {
     });
   }
-  const I = N(b, 300);
-  u.addEventListener("input", (a) => {
-    const d = a.target;
-    I({ appId: n, query: d.value });
+  const $ = V(_, 300);
+  f.addEventListener("input", (a) => {
+    const l = a.target;
+    $({ appId: n, query: l.value });
   });
-  function x(a) {
+  function S(a) {
     if (a.key === "ArrowDown") {
       a.preventDefault();
-      const { end: d } = k(
-        l + 1,
+      const { end: l } = y(
+        p + 1,
         s
       );
-      d || (S(l, s), l += 1);
+      l || (A(p, s), p += 1);
     }
     if (a.key === "ArrowUp") {
-      if (a.preventDefault(), l <= 0)
+      if (a.preventDefault(), p <= 0)
         return;
-      S(l, s), l -= 1, k(l, s);
+      A(p, s), p -= 1, y(p, s);
     }
     if (a.key === "Enter") {
       a.preventDefault();
-      const d = s.querySelector(
-        `.${m}`
+      const l = s.querySelector(
+        `.${v}`
       );
-      if (d) {
+      if (!l)
+        return;
+      if (e)
+        e(l.href, a.ctrlKey);
+      else {
         if (a.ctrlKey) {
-          window.open(d.href, "_blank");
+          window.open(l.href, "_blank");
           return;
         }
-        d.click();
+        l.click();
       }
     }
   }
-  u.addEventListener("focus", () => {
-    document.addEventListener("keydown", x);
-  }), u.addEventListener("blur", () => {
-    document.removeEventListener("keydown", x);
+  f.addEventListener("focus", () => {
+    document.addEventListener("keydown", S);
+  }), f.addEventListener("blur", () => {
+    document.removeEventListener("keydown", S);
   });
-  function y(a) {
-    const d = j(a, s);
-    d >= 0 && (l = d);
-  }
-  s.addEventListener("mousemove", y);
   function M(a) {
-    const d = W(a, s);
-    d >= 0 && (l = d);
+    const l = z(a, s);
+    l >= 0 && (p = l);
   }
-  "ontouchstart" in window && s.addEventListener("touchstart", M);
-  function T() {
-    s.removeEventListener("mousemove", y), "ontouchstart" in window && s.removeEventListener("touchstart", M), r.remove(), o && o();
+  s.addEventListener("mousemove", M);
+  function b(a) {
+    const l = X(a, s);
+    l >= 0 && (p = l);
   }
-  c.addEventListener("keydown", (a) => {
-    a.key === "Escape" && T();
-  }), r.addEventListener("click", (a) => {
-    a.target === r && T();
-  }), u.focus();
+  "ontouchstart" in window && s.addEventListener("touchstart", b);
+  function I() {
+    s.removeEventListener("mousemove", M), "ontouchstart" in window && s.removeEventListener("touchstart", b), c.remove(), r && r();
+  }
+  const T = (a) => {
+    a.key === "Escape" && (I(), document.removeEventListener("keydown", T));
+  };
+  document.addEventListener("keydown", T), c.addEventListener("click", (a) => {
+    a.target === c && I();
+  }), f.focus();
 }
 export {
-  O as searchmate
+  J as searchmate
 };

dist/props.d.ts

@@ -5,2 +5,4 @@ export type SearchMateProps = {
   urlPrefix?: string;
+  // a prop to override the default navigation to the result
+  overrideNavigateToResult?: (path: string, withCtrl: boolean) => void;
 };
@@ -7,0 +9,0 @@

package.json

 {
   "name": "searchmate-js",
   "private": false,
-  "version": "1.9.0",
+  "version": "2.0.0",
   "type": "module",
@@ -35,3 +35,3 @@ "files": [
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --host",
     "build": "tsc && vite build",
@@ -38,0 +38,0 @@ "preview": "vite preview",

README.md

@@ -87,1 +87,15 @@ This package is a vanilla javascript client for [Searchmate](https://searchmate.app).
 ```
+
+### Overriding the default navigation
+
+You can override the default navigation by passing a function to the `overrideNavigateToResult` prop.
+
+```js
+searchmate({
+    overrideNavigateToResult(path, withCtrl) {
+      // your custom navigation logic
+      console.log(path, withCtrl);
+    },
+  });
+/>
+```

No alert changes

Improved metrics

Total package byte prevSize

49055

increased by1.78%

Lines of code

426

increased by3.65%

Number of lines in readme file

101

increased by16.09%

No dependency changes