@netlify/spark-ui 1.12.1 → 1.12.3

package/dist/assets/AskNetlify.css

@@ -1 +1 @@
-.n-fadeIn{opacity:0;animation:fadeIn var(--animation-duration, .3s) ease-out forwards}.n-fadeInUp{opacity:0;transform:translateY(var(--animation-transformY, 5px));animation:fadeInUp var(--animation-duration, .3s) ease-out forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}.n-ask-chat-container{opacity:0;animation:appearContainer .12s ease-in-out forwards;animation-delay:.14s}.n-ask-conversation{display:grid;align-items:flex-end;gap:var(--space-s);height:calc(var(--n-search-container-height) + var(--n-search-footer-height));padding:var(--n-search-padding-inline);overflow-y:auto;scroll-behavior:smooth;grid-template-rows:1fr}.n-ask-form{display:flex;align-items:center;position:relative;height:var(--n-search-input-height);background-color:var(--search-input-bg-color)}.n-ask-form:after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:1px;background:var(--color-bg-3)}.n-ask-question{border:none;border-radius:var(--radius-pill);transform:translate(-.75rem);color:var(--color-text-1);background:none;padding:var(--space-2xs, .5rem);font-size:var(--step--1, .9rem);font-weight:var(--font-weight-regular);text-align:left;text-wrap:pretty;cursor:pointer;display:flex;align-items:center;gap:var(--space-2xs);transition:background-color .2s ease-out}.n-ask-question [data-icon=caretRight]{opacity:0;height:.8em;color:var(--color-text-weaker);transform:translate(-3px);transition:transform .2s ease-out}.n-ask-question:hover{background-color:var(--n-search-color-bg-2)}.n-ask-question:hover [data-icon=caretRight]{opacity:1;transform:translate(0)}.n-ask-question-list{padding:0}.n-ask-question-list .n-ask-question-list-item{position:relative;width:fit-content;opacity:0;transform:translateY(10px);animation:fadeInUp .5s forwards}.n-ask-message{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-s);font-size:var(--font-size-text-md, 1rem)}.n-ask-message:first-of-type{margin-block-start:var(--space-2xl)}.n-ask-message-bubble{width:fit-content;max-width:85%;padding:var(--space-xs) var(--space-s);background:var(--search-answer-message-color);border-radius:var(--radius-l);font-size:var(--step-0)}.n-ask-user-message{margin-inline-start:auto;background:var(--search-user-message-color)}.n-ask-sources{margin-block-start:var(--space-m)}.n-ask-sources-title{font-size:var(--step-0);font-weight:var(--font-weight-bold)}.n-ask-sources a{font-size:var(--step--1)}.n-ask-sources details summary::marker{display:none;content:none}.n-ask-sources details{background:var(--search-source-list-color);padding:var(--space-xs) var(--space-xs);border-radius:var(--radius-l)}.n-ask-sources details summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xs);cursor:pointer}.n-ask-sources details ul{margin-block-start:var(--space-3xs)}.n-ask-sources [data-icon=caretRight]{width:.8em;display:inline-block;transform:rotate(90deg);height:auto;color:var(--color-text-weaker)}.n-ask-sources details[open] [data-icon=caretRight]{transform:rotate(270deg)}.n-ask-input{border:none;outline:none;padding-inline:var(--n-search-padding-inline)}.n-ask-form-submit{display:flex;padding:.7rem;margin-inline-end:var(--space-2xs);border:none;border-radius:var(--radius-pill);background:var(--search-submit-btn-bg-color);color:var(--neutral-000);transition:background-color .15s ease-out}.n-ask-form-submit>svg{width:1rem;height:auto;aspect-ratio:1 / 1;border-radius:1.5px;transition:opacity .15s ease-out}.n-ask-form-submit[disabled]{background:var(--neutral-500)}.n-ask-form-submit[disabled]>*{opacity:.5}.n-ask-button-back{position:absolute;z-index:1;width:fit-content;margin:1rem;padding:.5rem 1rem;background:var(--search-back-btn-bg-color);border:.5px solid var(--color-bg-3);border-radius:var(--radius-pill);font-size:var(--font-size-text-md, 1rem);font-weight:var(--font-weight-semibold, 500);color:var(--color-text-1);cursor:pointer}.n-ask-button-back [data-icon=caretRight]{color:var(--color-text-weak);transform:rotate(180deg)}.n-ask-prose{font-size:var(--step--0)}.n-ask-prose>*+*{margin-top:var(--flow-space, var(--space-s))}.n-ask-prose :where(ol,ul,li)>*+*{margin-top:var(--flow-space, var(--space-3xs))}.n-ask-prose h1,.n-ask-prose h2,.n-ask-prose h3{font-size:var(--step-1);font-weight:var(--font-weight-bold)}.n-ask-prose h4,.n-ask-prose h5,.n-ask-prose h6{font-size:var(--step-0);font-weight:var(--font-weight-bold)}.n-ask-prose pre{max-width:100%;padding:var(--space-s);background:var(--neutral-light-700);border-radius:var(--radius-m);box-sizing:border-box;color:var(--neutral-100);overflow-x:auto}.n-ask-prose code{overflow-x:auto}.n-ask-prose code[class*=language-],.n-ask-prose pre[class*=language-]{display:block;font-size:var(--font-size-text-xs)}.n-ask-message-loader{width:2.5rem;height:auto;display:block;color:var(--search-loading-color)}.n-ask-message-loader :where(#ask-netlify-tick-1,#ask-netlify-tick-2,#ask-netlify-tick-3){opacity:0;animation:fadeIn .8s ease-in-out infinite}.n-ask-message-loader #ask-netlify-tick-1{animation-delay:.1s}.n-ask-message-loader #ask-netlify-tick-2{animation-delay:.2s}.n-ask-message-loader #ask-netlify-tick-3{animation-delay:.3s}.n-ask-message-loader :where(#ask-netlify-eyelid-left,#ask-netlify-eyelid-right){--n-ask-netlify-eyelid-color: var(--search-bg-color);transform-origin:top center;transform:scaleY(1.035);animation:askEyeBlink 4s infinite;animation-delay:1s}@keyframes askEyeBlink{0%,5%{transform:scaleY(1.035)}6%,10%{transform:scaleY(1.3)}11%,15%{transform:scaleY(1.035)}16%,20%{transform:scaleY(1.3)}21%,to{transform:scaleY(1.035)}}
+.n-fadeIn{opacity:0;animation:fadeIn var(--animation-duration, .3s) ease-out forwards}.n-fadeInUp{opacity:0;transform:translateY(var(--animation-transformY, 5px));animation:fadeInUp var(--animation-duration, .3s) ease-out forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}.n-ask-chat-container{opacity:0;animation:appearContainer .12s ease-in-out forwards;animation-delay:.14s}.n-ask-conversation{display:grid;align-items:flex-end;gap:var(--space-s);height:calc(var(--n-search-container-height) + var(--n-search-footer-height));padding:var(--n-search-padding-inline);overflow-y:auto;scroll-behavior:smooth;grid-template-rows:1fr}.n-ask-form{display:flex;align-items:center;position:relative;height:var(--n-search-input-height);background-color:var(--search-input-bg-color)}.n-ask-form:after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:1px;background:var(--color-bg-3)}.n-ask-question{border:none;border-radius:var(--radius-pill);transform:translate(-.75rem);color:var(--color-text-1);background:none;padding:var(--space-2xs, .5rem);font-size:var(--step--1, .9rem);font-weight:var(--font-weight-regular);text-align:left;text-wrap:pretty;cursor:pointer;display:flex;align-items:center;gap:var(--space-2xs);transition:background-color .2s ease-out}.n-ask-question [data-icon=caretRight]{opacity:0;height:.8em;color:var(--color-text-weaker);transform:translate(-3px);transition:transform .2s ease-out}.n-ask-question:hover{background-color:var(--n-search-color-bg-2)}.n-ask-question:hover [data-icon=caretRight]{opacity:1;transform:translate(0)}.n-ask-question-list{padding:0}.n-ask-question-list .n-ask-question-list-item{position:relative;width:fit-content;opacity:0;transform:translateY(10px);animation:fadeInUp .5s forwards}.n-ask-message{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-s);font-size:var(--font-size-text-md, 1rem)}.n-ask-message:first-of-type{margin-block-start:var(--space-2xl)}.n-ask-message-bubble{width:fit-content;max-width:85%;padding:var(--space-xs) var(--space-s);background:var(--search-answer-message-color);border-radius:var(--radius-l);font-size:var(--step-0)}.n-ask-user-message{margin-inline-start:auto;background:var(--search-user-message-color)}.n-ask-sources{margin-block-start:var(--space-m)}.n-ask-sources-title{font-size:var(--step-0);font-weight:var(--font-weight-bold)}.n-ask-sources a{font-size:var(--step--1)}.n-ask-sources details summary::marker{display:none;content:none}.n-ask-sources details{background:var(--search-source-list-color);padding:var(--space-xs) var(--space-xs);border-radius:var(--radius-l)}.n-ask-sources details summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xs);cursor:pointer}.n-ask-sources details ul{margin-block-start:var(--space-3xs)}.n-ask-sources [data-icon=caretRight]{width:.8em;display:inline-block;transform:rotate(90deg);height:auto;color:var(--color-text-weaker)}.n-ask-sources details[open] [data-icon=caretRight]{transform:rotate(270deg)}.n-ask-input{border:none;outline:none;padding-inline:var(--n-search-padding-inline)}.n-ask-form-submit{display:flex;padding:.7rem;margin-inline-end:var(--space-2xs);border:none;border-radius:var(--radius-pill);background:var(--search-submit-btn-bg-color);color:var(--neutral-000);transition:background-color .15s ease-out}.n-ask-form-submit>svg{width:1rem;height:auto;aspect-ratio:1 / 1;border-radius:1.5px;transition:opacity .15s ease-out}.n-ask-form-submit[disabled]{background:var(--neutral-500)}.n-ask-form-submit[disabled]>*{opacity:.5}button.n-ask-button-back{position:absolute;z-index:1;width:fit-content;margin:1rem;padding:var(--space-xs) var(--space-s);background:var(--search-back-btn-bg-color);border:.5px solid var(--color-bg-3);border-radius:var(--radius-pill);font-size:var(--font-size-text-md, 1rem);font-weight:var(--font-weight-semibold, 500);color:var(--color-text-1);cursor:pointer;line-height:var(--line-height-none, 1)}button.n-ask-button-back [data-icon=caretRight]{color:var(--color-text-weak);transform:rotate(180deg)}.n-ask-prose{font-size:var(--step--0)}.n-ask-prose>*+*{margin-top:var(--flow-space, var(--space-s))}.n-ask-prose :where(ol,ul,li)>*+*{margin-top:var(--flow-space, var(--space-3xs))}.n-ask-prose h1,.n-ask-prose h2,.n-ask-prose h3{font-size:var(--step-1);font-weight:var(--font-weight-bold)}.n-ask-prose h4,.n-ask-prose h5,.n-ask-prose h6{font-size:var(--step-0);font-weight:var(--font-weight-bold)}.n-ask-prose pre{max-width:100%;padding:var(--space-s);background:var(--neutral-light-700);border-radius:var(--radius-m);box-sizing:border-box;color:var(--neutral-100);overflow-x:auto}.n-ask-prose code{overflow-x:auto}.n-ask-prose code[class*=language-],.n-ask-prose pre[class*=language-]{display:block;font-size:var(--font-size-text-xs)}.n-ask-message-loader{width:2.5rem;height:auto;display:block;color:var(--search-loading-color)}.n-ask-message-loader :where(#ask-netlify-tick-1,#ask-netlify-tick-2,#ask-netlify-tick-3){opacity:0;animation:fadeIn .8s ease-in-out infinite}.n-ask-message-loader #ask-netlify-tick-1{animation-delay:.1s}.n-ask-message-loader #ask-netlify-tick-2{animation-delay:.2s}.n-ask-message-loader #ask-netlify-tick-3{animation-delay:.3s}.n-ask-message-loader :where(#ask-netlify-eyelid-left,#ask-netlify-eyelid-right){--n-ask-netlify-eyelid-color: var(--search-bg-color);transform-origin:top center;transform:scaleY(1.035);animation:askEyeBlink 4s infinite;animation-delay:1s}@keyframes askEyeBlink{0%,5%{transform:scaleY(1.035)}6%,10%{transform:scaleY(1.3)}11%,15%{transform:scaleY(1.035)}16%,20%{transform:scaleY(1.3)}21%,to{transform:scaleY(1.035)}}

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.3",
   "type": "module",
   "main": "dist/components/preact/index.js",
   "types": "dist/components/preact/index.d.ts",

package/packages/components/preact/AskNetlify/AskNetlify.css

@@ -201,12 +201,12 @@
 /* ----------------------------- */
 /* Buttons                      */
 /* ----------------------------- */
-.n-ask-button-back {
+button.n-ask-button-back {
   position: absolute;
   z-index: 1;
   width: fit-content;
   margin: 1rem;
-  padding: 0.5rem 1rem;
+  padding: var(--space-xs) var(--space-s);
   background: var(--search-back-btn-bg-color);
   border: 0.5px solid var(--color-bg-3);
   border-radius: var(--radius-pill);
@@ -214,9 +214,10 @@
   font-weight: var(--font-weight-semibold, 500);
   color: var(--color-text-1);
   cursor: pointer;
+  line-height: var(--line-height-none, 1);
 }
 
-.n-ask-button-back [data-icon='caretRight'] {
+button.n-ask-button-back [data-icon='caretRight'] {
   color: var(--color-text-weak);
   transform: rotate(180deg);
 }

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">