@netlify/spark-ui 1.12.1 → 1.12.2

package/dist/components/preact/SearchModal/components/AskNetlifyLink.d.ts

@@ -0,0 +1,8 @@
+interface Props {
+    setModalState: (state: {
+        current: string;
+    }) => void;
+    searchTerm: string;
+}
+declare const AskNetlifyLink: (props: Props) => import("preact").JSX.Element;
+export default AskNetlifyLink;

package/dist/components/preact/SearchModal/components/AskNetlifyLink.js

@@ -0,0 +1,22 @@
+import { u as t } from "../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
+import a from "./SearchLink/SearchLink.js";
+import { Fragment as n } from "preact";
+const l = (e) => {
+  const r = e.searchTerm ? /* @__PURE__ */ t(n, { children: [
+    "Ask Netlify AI: ",
+    /* @__PURE__ */ t("span", { className: "n-search-term", children: e.searchTerm })
+  ] }) : "Ask Netlify AI";
+  return /* @__PURE__ */ t(
+    a,
+    {
+      as: "button",
+      icon: "askNetlify",
+      excerpt: "Get instant answers, powered by AI",
+      onClick: () => e.setModalState({ current: "ask" }),
+      children: r
+    }
+  );
+};
+export {
+  l as default
+};

package/dist/components/preact/SearchModal/components/SearchModal/SearchModal.js

@@ -1,81 +1,70 @@
 import { u as e } from "../../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import { A as g, y as h, d as y } from "../../../../../chunks/hooks.module.DGkdD5n9.js";
-import { A as b, K as w } from "../../../../../chunks/AskNetlify.lrswYyKn.js";
+import { A as g, y as h, d as k } from "../../../../../chunks/hooks.module.DGkdD5n9.js";
+import { A as w, K as b } from "../../../../../chunks/AskNetlify.lrswYyKn.js";
 import K from "../../../Modal/Modal.js";
 import d from "../../../KeyboardKey/KeyboardKey.js";
 import L from "../SearchWindow.js";
-import C from "../SearchInput.js";
-import M from "../SearchLink/SearchLink.js";
-import { useSearch as O } from "../../hooks/useSearch.js";
+import M from "../SearchInput.js";
+import O from "../AskNetlifyLink.js";
+import { useSearch as C } from "../../hooks/useSearch.js";
 import { useSearchAnalytics as E } from "../../hooks/useSearchAnalytics.js";
 import { useKeyboardNav as Q } from "../../hooks/useKeyboardNav.js";
-import { useSearchHotkeys as x } from "../../hooks/useSearchHotkeys.js";
-import { useSearchParams as G } from "../../hooks/useSearchParams.js";
-import { useSearchToggles as P } from "../../hooks/useSearchToggles.js";
-import { useAskAnalytics as R } from "../../../AskNetlify/hooks/useAskAnalytics.js";
+import { useSearchHotkeys as P } from "../../hooks/useSearchHotkeys.js";
+import { useSearchParams as R } from "../../hooks/useSearchParams.js";
+import { useSearchToggles as q } from "../../hooks/useSearchToggles.js";
+import { useAskAnalytics as x } from "../../../AskNetlify/hooks/useAskAnalytics.js";
 import { Fragment as N } from "preact";
-import '../../../../../assets/SearchModal.css';function q(r) {
+import '../../../../../assets/SearchModal.css';function D(t) {
   const n = g(null);
   return h(() => {
     function o(m) {
-      n.current && !n.current.contains(m.target) && r();
+      n.current && !n.current.contains(m.target) && t();
     }
     return document.addEventListener("mousedown", o), () => {
       document.removeEventListener("mousedown", o);
     };
-  }, [r]), n;
+  }, [t]), n;
 }
-function re(r = { className: "", children: void 0, debug: !1, kapaIntegrationId: void 0 }) {
-  const { children: n, className: o, debug: m, ...A } = r, [s, c] = y({ current: "search" }), [i, f] = y(!1), l = () => f(!0), u = () => f(!1), t = g(null), v = q(u), { state: a, actions: p } = O();
-  P(l, c), G(p.setSearchTerm, l), x(i, l, u), Q(t, i, u), E(a, m);
-  const { handleNewQuery: I, handleAnswer: T } = R();
+function re(t = { className: "", children: void 0, debug: !1, kapaIntegrationId: void 0 }) {
+  const { children: n, className: o, debug: m, ...T } = t, [s, c] = k({ current: "search" }), [i, f] = k(!1), l = () => f(!0), u = () => f(!1), a = g(null), v = D(u), { state: r, actions: p } = C();
+  q(l, c), R(p.setSearchTerm, l), P(i, l, u), Q(a, i, u), E(r, m);
+  const { handleNewQuery: A, handleAnswer: I } = x();
   return h(() => {
-    t.current && (i ? t.current.showModal() : t.current.close());
+    a.current && (i ? a.current.showModal() : a.current.close());
   }, [i]), h(() => {
-    var k;
-    const S = (k = t.current) == null ? void 0 : k.querySelector("input");
+    var y;
+    const S = (y = a.current) == null ? void 0 : y.querySelector("input");
     S && S.focus();
   }, [s.current]), /* @__PURE__ */ e(
-    w,
+    b,
     {
-      integrationId: r.kapaIntegrationId || "",
+      integrationId: t.kapaIntegrationId || "",
       callbacks: {
         askAI: {
-          onQuerySubmit: I,
-          onAnswerGenerationCompleted: T
+          onQuerySubmit: A,
+          onAnswerGenerationCompleted: I
         }
       },
       children: /* @__PURE__ */ e(
         K,
         {
-          ref: t,
+          ref: a,
           className: `n-search-modal ${o || ""}`,
           "data-state": s.current,
-          ...A,
+          ...T,
           children: /* @__PURE__ */ e("div", { ref: v, className: "n-search-container", children: [
-            s.current === "ask" && /* @__PURE__ */ e(b, { setModalState: c, initialQuery: a.searchTerm }),
+            s.current === "ask" && /* @__PURE__ */ e(w, { setModalState: c, initialQuery: r.searchTerm }),
             s.current === "search" && /* @__PURE__ */ e(N, { children: [
-              /* @__PURE__ */ e(C, { setSearchTerm: p.setSearchTerm, initialValue: a.searchTerm }),
+              /* @__PURE__ */ e(M, { setSearchTerm: p.setSearchTerm, initialValue: r.searchTerm }),
               /* @__PURE__ */ e(
                 L,
                 {
                   setModalState: c,
-                  searchLoading: a.isLoading,
-                  searchTerm: a.searchTerm,
-                  results: a.results,
+                  searchLoading: r.isLoading,
+                  searchTerm: r.searchTerm,
+                  results: r.results,
                   children: /* @__PURE__ */ e(N, { children: [
-                    r.kapaIntegrationId && /* @__PURE__ */ e(
-                      M,
-                      {
-                        as: "button",
-                        icon: "askNetlify",
-                        label: "Ask Netlify",
-                        excerpt: "Get an instant AI-generated answer",
-                        onClick: () => {
-                          c({ current: "ask" });
-                        }
-                      }
-                    ),
+                    t.kapaIntegrationId && /* @__PURE__ */ e(O, { searchTerm: r.searchTerm, setModalState: c }),
                     n
                   ] })
                 }

package/dist/components/preact/SearchModal/components/SearchWindow.js

@@ -1,63 +1,49 @@
 import { u as n } from "../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import h from "./SearchHeading/SearchHeading.js";
-import t from "./SearchLink/SearchLink.js";
+import t from "./SearchHeading/SearchHeading.js";
+import h from "./SearchLink/SearchLink.js";
 import m from "./SearchLinkThemeToggle.js";
-import { Fragment as r } from "preact";
-const o = ({
-  searchTerm: e,
-  setModalState: c
-}) => /* @__PURE__ */ n(
-  t,
-  {
-    as: "button",
-    icon: "askNetlify",
-    excerpt: "Get an instant AI-generated answer",
-    onClick: () => c({ current: "ask" }),
-    children: [
-      "Ask Netlify AI: ",
-      /* @__PURE__ */ n("span", { className: "n-search-term", children: e })
-    ]
-  }
-), f = ({ searchTerm: e }) => /* @__PURE__ */ n("div", { className: "n-search-feedback", children: /* @__PURE__ */ n("p", { className: "n-results-info", children: [
+import o from "./AskNetlifyLink.js";
+import { Fragment as a } from "preact";
+const f = ({ searchTerm: l }) => /* @__PURE__ */ n("div", { className: "n-search-feedback", children: /* @__PURE__ */ n("p", { className: "n-results-info", children: [
   "0 results for ",
-  /* @__PURE__ */ n("span", { className: "n-search-term", children: e })
-] }) }), N = ({
-  setModalState: e,
+  /* @__PURE__ */ n("span", { className: "n-search-term", children: l })
+] }) }), p = ({
+  setModalState: l,
   searchLoading: c,
   searchTerm: i,
-  results: s
+  results: e
 }) => {
-  const l = !c && (!s || s.length === 0);
-  return /* @__PURE__ */ n(r, { children: [
-    /* @__PURE__ */ n(o, { searchTerm: i, setModalState: e }),
-    l ? /* @__PURE__ */ n(f, { searchTerm: i }) : /* @__PURE__ */ n("ul", { className: "n-results-list", role: "list", children: s == null ? void 0 : s.map((a, d) => /* @__PURE__ */ n("li", { className: "n-results-list-item", children: /* @__PURE__ */ n(t, { ...a }) }, d)) })
+  const s = !c && (!e || e.length === 0);
+  return /* @__PURE__ */ n(a, { children: [
+    /* @__PURE__ */ n(o, { searchTerm: i, setModalState: l }),
+    s ? /* @__PURE__ */ n(f, { searchTerm: i }) : /* @__PURE__ */ n("ul", { className: "n-results-list", role: "list", children: e == null ? void 0 : e.map((r, d) => /* @__PURE__ */ n("li", { className: "n-results-list-item", children: /* @__PURE__ */ n(h, { ...r }) }, d)) })
   ] });
 };
-function A({
-  setModalState: e,
+function w({
+  setModalState: l,
   searchLoading: c,
   searchTerm: i,
-  results: s,
-  children: l
+  results: e,
+  children: s
 }) {
-  const a = (i == null ? void 0 : i.length) > 1;
-  return /* @__PURE__ */ n("div", { className: "n-search-window", children: /* @__PURE__ */ n("div", { className: "n-search-links", children: a ? c ? /* @__PURE__ */ n(r, { children: [
-    /* @__PURE__ */ n(o, { searchTerm: i, setModalState: e }),
+  const r = (i == null ? void 0 : i.length) > 1;
+  return /* @__PURE__ */ n("div", { className: "n-search-window", children: /* @__PURE__ */ n("div", { className: "n-search-links", children: r ? c ? /* @__PURE__ */ n(a, { children: [
+    /* @__PURE__ */ n(o, { searchTerm: i, setModalState: l }),
     /* @__PURE__ */ n("div", { className: "n-search-feedback", children: /* @__PURE__ */ n("div", { className: "n-loader-dots-spinner" }) })
   ] }) : /* @__PURE__ */ n(
-    N,
+    p,
     {
-      setModalState: e,
+      setModalState: l,
       searchLoading: c,
       searchTerm: i,
-      results: s
+      results: e
     }
-  ) : /* @__PURE__ */ n(r, { children: [
-    l,
-    /* @__PURE__ */ n(h, { children: "Actions" }),
+  ) : /* @__PURE__ */ n(a, { children: [
+    s,
+    /* @__PURE__ */ n(t, { children: "Actions" }),
     /* @__PURE__ */ n(m, {})
   ] }) }) });
 }
 export {
-  A as default
+  w as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@netlify/spark-ui",
   "description": "Assets, design tokens, components, and utilities",
-  "version": "1.12.1",
+  "version": "1.12.2",
   "type": "module",
   "main": "dist/components/preact/index.js",
   "types": "dist/components/preact/index.d.ts",

package/packages/components/preact/SearchModal/components/AskNetlifyLink.tsx

@@ -0,0 +1,29 @@
+import SearchLink from './SearchLink/SearchLink';
+
+interface Props {
+  setModalState: (state: { current: string }) => void;
+  searchTerm: string;
+}
+
+const AskNetlifyLink = (props: Props) => {
+  const label = props.searchTerm ? (
+    <>
+      Ask Netlify AI: <span className="n-search-term">{props.searchTerm}</span>
+    </>
+  ) : (
+    'Ask Netlify AI'
+  );
+
+  return (
+    <SearchLink
+      as="button"
+      icon="askNetlify"
+      excerpt="Get instant answers, powered by AI"
+      onClick={() => props.setModalState({ current: 'ask' })}
+    >
+      {label}
+    </SearchLink>
+  );
+};
+
+export default AskNetlifyLink;

package/packages/components/preact/SearchModal/components/SearchModal/SearchModal.tsx

@@ -7,7 +7,7 @@ import Modal from '../../../../preact/Modal/Modal';
 import KeyboardKey from '../../../../preact/KeyboardKey/KeyboardKey';
 import SearchWindow from '../../components/SearchWindow';
 import SearchInput from '../../components/SearchInput';
-import SearchLink from '../../components/SearchLink/SearchLink';
+import AskNetlifyLink from '../AskNetlifyLink';
 import { useClickOutside } from '../../../../../utils/useClickOutside';
 import {
   useSearch,
@@ -93,15 +93,7 @@ function SearchModal(
               >
                 <>
                   {props.kapaIntegrationId && (
-                    <SearchLink
-                      as="button"
-                      icon="askNetlify"
-                      label="Ask Netlify"
-                      excerpt="Get an instant AI-generated answer"
-                      onClick={() => {
-                        setModalState({ current: 'ask' });
-                      }}
-                    />
+                    <AskNetlifyLink searchTerm={state.searchTerm} setModalState={setModalState} />
                   )}
                   {children}
                 </>

package/packages/components/preact/SearchModal/components/SearchWindow.tsx

@@ -3,23 +3,7 @@ import type { SearchResultsProps, SearchWindowProps } from '../types/search.type
 import SearchHeading from './SearchHeading/SearchHeading';
 import SearchLink from './SearchLink/SearchLink';
 import SearchLinkThemeToggle from './SearchLinkThemeToggle';
-
-const AskNetlifyLink = ({
-  searchTerm,
-  setModalState,
-}: {
-  searchTerm: string;
-  setModalState: (state: { current: string }) => void;
-}) => (
-  <SearchLink
-    as="button"
-    icon="askNetlify"
-    excerpt="Get an instant AI-generated answer"
-    onClick={() => setModalState({ current: 'ask' })}
-  >
-    Ask Netlify AI: <span className="n-search-term">{searchTerm}</span>
-  </SearchLink>
-);
+import AskNetlifyLink from './AskNetlifyLink';
 
 const NoResults = ({ searchTerm }: { searchTerm: string }) => (
   <div className="n-search-feedback">