@netlify/spark-ui 1.14.4 → 1.14.6

package/dist/components/preact/AskNetlify/AskNetlify.js

@@ -1,6 +1,6 @@
 import "../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
 import "../../../chunks/hooks.module.DGkdD5n9.js";
-import { A as d } from "../../../chunks/AskNetlify.34ZT77N0.js";
+import { A as d } from "../../../chunks/AskNetlify.xyk4QsqP.js";
 import "./components/QuestionList/questions.js";
 import "./components/QuestionList/QuestionList.js";
 import "./components/BackButton.js";

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

@@ -1,6 +1,6 @@
 import { u as e } from "../../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
 import { A as g, y as f, d } from "../../../../../chunks/hooks.module.DGkdD5n9.js";
-import { A as K, K as L } from "../../../../../chunks/AskNetlify.34ZT77N0.js";
+import { A as K, K as L } from "../../../../../chunks/AskNetlify.xyk4QsqP.js";
 import P from "../../../Modal/Modal.js";
 import h from "../../../KeyboardKey/KeyboardKey.js";
 import M from "../SearchWindow.js";

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

@@ -1,24 +1,24 @@
-import { d as h, y as t } from "../../../../chunks/hooks.module.DGkdD5n9.js";
-function l(r, a, c, s) {
-  const [i, d] = h(!1);
-  t(() => {
-    let n;
-    const e = () => {
-      window.pagefind && (d(!0), n && clearInterval(n));
+import { d as u, y as g } from "../../../../chunks/hooks.module.DGkdD5n9.js";
+function m(a, c, i, r) {
+  const [o, h] = u(!1);
+  g(() => {
+    let e;
+    const s = () => {
+      window.pagefind && (h(!0), e && clearInterval(e));
     };
-    return e(), n = setInterval(e, 100), () => clearInterval(n);
-  }, []), t(() => {
-    if (typeof location > "u" || i) return;
-    const n = new URLSearchParams(location.search), e = n.has("ask"), f = n.get("msg") || n.get("message"), o = n.get("search"), u = (g) => {
-      g && c(g), s == null || s({ current: "ask" }), r();
-    };
-    if (e || f) {
-      u(f);
+    return s(), e = setInterval(s, 100), () => clearInterval(e);
+  }, []), g(() => {
+    if (typeof location > "u" || o) return;
+    const e = new URLSearchParams(location.search), s = e.has("ask"), n = e.get("msg") || e.get("message"), f = e.get("search"), t = new URL(location.href);
+    if (["ask", "msg", "message", "search"].forEach((d) => {
+      t.searchParams.delete(d);
+    }), window.history.replaceState({}, "", t), s || n) {
+      n && i(n), r == null || r({ current: "ask" }), a();
       return;
     }
-    o && (a(o), r());
-  }, [i, r, s, a, c]);
+    f && (c(f), a());
+  }, [o, a, r, c, i]);
 }
 export {
-  l as useSearchParams
+  m as useSearchParams
 };

package/dist/components/preact/index.js

@@ -4,7 +4,7 @@ import { default as m } from "./Icon/index.js";
 import { default as s } from "./SearchModal/components/SearchLink/SearchLink.js";
 import { default as u } from "./SearchModal/components/SearchHeading/SearchHeading.js";
 import { default as i } from "./SearchModal/components/SearchToggle/SearchToggle.js";
-import { A as S } from "../../chunks/AskNetlify.34ZT77N0.js";
+import { A as S } from "../../chunks/AskNetlify.xyk4QsqP.js";
 import "preact";
 import "../../chunks/hooks.module.DGkdD5n9.js";
 import { default as n } from "./SearchModal/components/SearchModal/SearchModal.js";

package/package.json

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

package/packages/components/preact/AskNetlify/AskNetlify.tsx

@@ -51,35 +51,19 @@ export default function AskNetlify({ setModalState, searchQuery, urlParamQuery }
     }
   }, [newMessageReady]);
 
-  const [urlParamHandled, setUrlParamHandled] = useState(false);
-
   useEffect(() => {
-    if (urlParamQuery && !urlParamHandled) {
-      const trimmedQuery = urlParamQuery.trim();
-      setMessage(trimmedQuery);
-      setUrlParamHandled(true); // prevent refilling after submission
+    if (searchQuery) {
+      setMessage('');
+      submitQuery(searchQuery.trim());
+      setNewMessageReady(true);
     }
-  }, [urlParamQuery, urlParamHandled]);
+  }, [searchQuery, setMessage, setNewMessageReady]);
 
-  /**
-   * Populates and handles the input when a query is present.
-   *
-   * - If `urlParamQuery` exists, pre-fills the input and waits for user action.
-   * - If `searchQuery` exists, auto-submits the query.
-   *
-   * Focuses the input and marks the message as ready in both cases.
-   */
   useEffect(() => {
-    if (!searchQuery) return;
-
-    const trimmedQuery = searchQuery.trim();
-
-    if (searchQuery) {
-      submitQuery(trimmedQuery);
-      inputRef?.current?.focus();
-      setNewMessageReady(true);
+    if (!searchQuery && urlParamQuery) {
+      setMessage(urlParamQuery);
     }
-  }, [setMessage, setNewMessageReady, submitQuery, searchQuery]);
+  }, [urlParamQuery, searchQuery, setMessage]);
 
   return (
     <div className="n-ask-chat-container">

package/packages/components/preact/SearchModal/hooks/useSearchParams.ts

@@ -54,14 +54,17 @@ export function useSearchParams(
     const msg = params.get('msg') || params.get('message');
     const search = params.get('search');
 
-    const openAskModal = (term?: string | null) => {
-      if (term) setUrlParamTerm(term);
-      setModalState?.({ current: 'ask' });
-      onOpen();
-    };
+    // Remove params from window URL
+    const url = new URL(location.href);
+    ['ask', 'msg', 'message', 'search'].forEach(param => {
+      url.searchParams.delete(param);
+    });
+    window.history.replaceState({}, '', url);
 
     if (hasAsk || msg) {
-      openAskModal(msg);
+      msg && setUrlParamTerm(msg);
+      setModalState?.({ current: 'ask' });
+      onOpen();
       return;
     }
 

package/packages/styles/layout.css

@@ -29,6 +29,16 @@
   grid-auto-rows: var(--n-grid-auto-rows, auto);
 }
 
+.n-flex-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--n-grid-gap, var(--space-m));
+
+  > * {
+    flex: 1 1 var(--n-grid-column-min-size);
+  }
+}
+
 .n-stack {
   display: grid;
   grid-template-areas: 'stack';