@netlify/spark-ui 1.18.0-alpha.0 → 1.18.0

package/dist/analytics/analytics.d.ts

@@ -1,8 +1,16 @@
 export default class Analytics {
     /**
-     * Pushes an event payload into the dataLayer.
+     * Pushes an event payload into both Google Analytics (gtag) and Segment.
      * @param eventName e.g. 'www:search_new_query'
      * @param payload   additional key/value data
      */
     track(eventName: string, payload?: Record<string, any>): void;
 }
+declare global {
+    interface Window {
+        analytics: {
+            track: (event: string, properties?: Record<string, any>, options?: Record<string, any>, callback?: () => void) => void;
+        };
+    }
+    function gtag(...args: any[]): void;
+}

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)}}.grecaptcha-badge{visibility:hidden}.n-ask-chat-container{opacity:0;animation:appearContainer .12s ease-in-out forwards;animation-delay:.14s}.n-ask-conversation{position:relative;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;gap:var(--space-s);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-xs)}.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-action-bar{margin-block-start:var(--space-m)}.n-ask-action-bar button{display:grid;border:none}.n-ask-action-bar button svg{pointer-events:none}.n-ask-action-bar .n-popover{--n-popover-padding: var(--space-2xs) var(--space-xs)}.n-ask-action-bar [id*=icon-]{width:auto;height:14px}.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%;background:var(--neutral-light-700, var(--neutral-700));border-radius:var(--radius-m);box-sizing:border-box;color:var(--neutral-100);color-scheme:dark;overflow-x:auto}.n-ask-prose code{overflow-x:auto;padding:var(--space-s)}.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)}}.grecaptcha-badge{visibility:hidden}.n-ask-chat-container{opacity:0;animation:appearContainer .12s ease-in-out forwards;animation-delay:.14s}.n-ask-conversation{position:relative;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;gap:var(--space-s);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-xs)}.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-action-bar{margin-block-start:var(--space-m)}.n-ask-action-bar button{display:grid;border:none}.n-ask-action-bar button svg{pointer-events:none}.n-ask-action-bar .n-popover{--n-popover-padding: var(--space-3xs) var(--space-2xs);--n-popover-bottom: 125%}.n-ask-action-bar [id*=icon-]{width:auto;height:1rem}.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%;background:var(--neutral-light-700, var(--neutral-700));border-radius:var(--radius-m);box-sizing:border-box;color:var(--neutral-100);color-scheme:dark;overflow-x:auto}.n-ask-prose code{overflow-x:auto;padding:var(--space-s)}.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/assets/Popover.css

@@ -1 +1 @@
-.n-popover-container{position:relative;display:inline-block;font-size:var(--font-size-text-xs)}.n-popover-trigger{display:block;background-color:transparent;border:none;padding:0;font:inherit;color:var(--color-text-weak);cursor:pointer}.n-popover{position:absolute;background-color:var(--color-bg-2);color:var(--color-text);padding:var(--n-popover-padding, var(--space-xs) var(--space-s));border-radius:var(--radius-s);opacity:0;pointer-events:none;transition:opacity .2s ease-in-out;z-index:10}.n-popover:after{content:"";position:absolute;border-style:solid}.n-popover-container:hover .n-popover{opacity:1;pointer-events:auto}.n-popover-top .n-popover{bottom:145%;left:50%;transform:translate(-50%);width:max-content;max-width:var(--n-popover-width, 255px);box-shadow:var(--shadow-light)}.n-popover-top .n-popover:after{top:100%;left:50%;margin-left:-5px;border-width:5px;border-color:var(--color-bg-2) transparent transparent transparent}.n-popover-bottom .n-popover{top:145%;left:50%;transform:translate(-50%)}.n-popover-bottom .n-popover:after{bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-color:transparent transparent var(--color-bg-2) transparent}.n-popover-left .n-popover{right:125%;top:50%;transform:translateY(-50%)}.n-popover-left .n-popover:after{top:50%;left:100%;margin-top:-5px;border-width:5px;border-color:transparent transparent transparent var(--color-bg-2)}.n-popover-right .n-popover{left:125%;top:50%;transform:translateY(-50%)}.n-popover-right .n-popover:after{top:50%;right:100%;margin-top:-5px;border-width:5px;border-color:transparent var(--color-bg-2) transparent transparent}
+.n-popover-container{position:relative;display:inline-block;font-size:var(--font-size-text-xs)}.n-popover-trigger{display:block;background-color:transparent;border:none;padding:0;font:inherit;color:var(--color-text-weak);cursor:pointer}.n-popover{position:absolute;background-color:var(--color-bg-2);color:var(--color-text);padding:var(--n-popover-padding, var(--space-xs) var(--space-s));border-radius:var(--radius-s);opacity:0;pointer-events:none;transition:opacity .2s ease-in-out;z-index:10}.n-popover:after{content:"";position:absolute;border-style:solid}.n-popover-container:hover .n-popover{opacity:1;pointer-events:auto}.n-popover-top .n-popover{bottom:var(--n-popover-bottom, 145%);left:50%;transform:translate(-50%);width:max-content;max-width:var(--n-popover-width, 255px);box-shadow:var(--shadow-light)}.n-popover-top .n-popover:after{top:100%;left:50%;margin-left:-5px;border-width:5px;border-color:var(--color-bg-2) transparent transparent transparent}.n-popover-bottom .n-popover{top:145%;left:50%;transform:translate(-50%)}.n-popover-bottom .n-popover:after{bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-color:transparent transparent var(--color-bg-2) transparent}.n-popover-left .n-popover{right:125%;top:50%;transform:translateY(-50%)}.n-popover-left .n-popover:after{top:50%;left:100%;margin-top:-5px;border-width:5px;border-color:transparent transparent transparent var(--color-bg-2)}.n-popover-right .n-popover{left:125%;top:50%;transform:translateY(-50%)}.n-popover-right .n-popover:after{top:50%;right:100%;margin-top:-5px;border-width:5px;border-color:transparent var(--color-bg-2) transparent transparent}

package/dist/chunks/{AskNetlify.nCAFTKgo.js → AskNetlify.CpaPeYsd.js}

@@ -12,7 +12,7 @@ var na = (e, a, t, i) => ({
   }
 });
 import { u as S } from "./jsxRuntime.module.Bzuv3cXw.js";
-import { A as Z, T as ot, q as F, y as Q, x as pa, d as ve, h as Kt } from "./hooks.module.DGkdD5n9.js";
+import { A as Z, T as ot, q as F, y as J, x as pa, d as ve, h as Kt } from "./hooks.module.DGkdD5n9.js";
 import { _ as Vn, C as Wn, R as Jn, D as Yn } from "./compat.module.8cuvf1_R.js";
 import { createElement as Xn, createRef as Zn, Component as $t, createContext as Je } from "preact";
 import { questions as ei } from "../components/preact/AskNetlify/components/QuestionList/questions.js";
@@ -20,7 +20,7 @@ import { QuestionList as ai } from "../components/preact/AskNetlify/components/Q
 import { BackButton as ti } from "../components/preact/AskNetlify/components/BackButton.js";
 import { ChatMessages as ni } from "../components/preact/AskNetlify/components/ChatMessages.js";
 import ii from "../components/preact/Popover/Popover.js";
-function V(e) {
+function Q(e) {
   if (e === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   return e;
 }
@@ -406,7 +406,7 @@ var Ni = /* @__PURE__ */ function(e) {
   ri(a, e);
   function a(i) {
     var n;
-    return n = e.call(this, i) || this, n._hcaptcha = void 0, n.renderCaptcha = n.renderCaptcha.bind(V(n)), n.resetCaptcha = n.resetCaptcha.bind(V(n)), n.removeCaptcha = n.removeCaptcha.bind(V(n)), n.isReady = n.isReady.bind(V(n)), n._onReady = null, n.loadCaptcha = n.loadCaptcha.bind(V(n)), n.handleOnLoad = n.handleOnLoad.bind(V(n)), n.handleSubmit = n.handleSubmit.bind(V(n)), n.handleExpire = n.handleExpire.bind(V(n)), n.handleError = n.handleError.bind(V(n)), n.handleOpen = n.handleOpen.bind(V(n)), n.handleClose = n.handleClose.bind(V(n)), n.handleChallengeExpired = n.handleChallengeExpired.bind(V(n)), n.ref = /* @__PURE__ */ Zn(), n.apiScriptRequested = !1, n.sentryHub = null, n.captchaId = "", n.state = {
+    return n = e.call(this, i) || this, n._hcaptcha = void 0, n.renderCaptcha = n.renderCaptcha.bind(Q(n)), n.resetCaptcha = n.resetCaptcha.bind(Q(n)), n.removeCaptcha = n.removeCaptcha.bind(Q(n)), n.isReady = n.isReady.bind(Q(n)), n._onReady = null, n.loadCaptcha = n.loadCaptcha.bind(Q(n)), n.handleOnLoad = n.handleOnLoad.bind(Q(n)), n.handleSubmit = n.handleSubmit.bind(Q(n)), n.handleExpire = n.handleExpire.bind(Q(n)), n.handleError = n.handleError.bind(Q(n)), n.handleOpen = n.handleOpen.bind(Q(n)), n.handleClose = n.handleClose.bind(Q(n)), n.handleChallengeExpired = n.handleChallengeExpired.bind(Q(n)), n.ref = /* @__PURE__ */ Zn(), n.apiScriptRequested = !1, n.sentryHub = null, n.captchaId = "", n.state = {
       isApiReady: !1,
       isRemoved: !1,
       elementId: i.id
@@ -1450,7 +1450,7 @@ function _r(e) {
       getVisitorData: g
     };
   }, [y, g]);
-  return Q(function() {
+  return J(function() {
     (!l.current || i) && (l.current = f());
   }, [i, k, f]), S(On.Provider, { value: v, children: t });
 }
@@ -1503,7 +1503,7 @@ function Or(e, a) {
       });
     });
   }, [o, n]);
-  Q(function() {
+  J(function() {
     i && l().catch(function(m) {
       console.error("Failed to fetch visitor data on mount: ".concat(m));
     });
@@ -1533,7 +1533,7 @@ var Sr = { immediate: !0 }, Xe = class {
   onUnsubscribe() {
   }
 }, ya = typeof window > "u" || "Deno" in globalThis;
-function J() {
+function W() {
 }
 function Cr(e, a) {
   return typeof e == "function" ? e(a) : e;
@@ -1924,18 +1924,18 @@ var M = Hr(), Re, qt, Pn = (qt = class {
   clearGcTimeout() {
     h(this, Re) && (clearTimeout(h(this, Re)), j(this, Re, void 0));
   }
-}, Re = new WeakMap(), qt), De, Ne, W, _e, K, Ve, ze, Y, se, Dt, Br = (Dt = class extends Pn {
+}, Re = new WeakMap(), qt), De, Ne, V, _e, K, Ve, ze, Y, se, Dt, Br = (Dt = class extends Pn {
   constructor(a) {
     super();
     z(this, Y);
     z(this, De);
     z(this, Ne);
-    z(this, W);
+    z(this, V);
     z(this, _e);
     z(this, K);
     z(this, Ve);
     z(this, ze);
-    j(this, ze, !1), j(this, Ve, a.defaultOptions), this.setOptions(a.options), this.observers = [], j(this, _e, a.client), j(this, W, h(this, _e).getQueryCache()), this.queryKey = a.queryKey, this.queryHash = a.queryHash, j(this, De, Vr(this.options)), this.state = a.state ?? h(this, De), this.scheduleGc();
+    j(this, ze, !1), j(this, Ve, a.defaultOptions), this.setOptions(a.options), this.observers = [], j(this, _e, a.client), j(this, V, h(this, _e).getQueryCache()), this.queryKey = a.queryKey, this.queryHash = a.queryHash, j(this, De, Vr(this.options)), this.state = a.state ?? h(this, De), this.scheduleGc();
   }
   get meta() {
     return this.options.meta;
@@ -1948,7 +1948,7 @@ var M = Hr(), Re, qt, Pn = (qt = class {
     this.options = { ...h(this, Ve), ...a }, this.updateGcTime(this.options.gcTime);
   }
   optionalRemove() {
-    !this.observers.length && this.state.fetchStatus === "idle" && h(this, W).remove(this);
+    !this.observers.length && this.state.fetchStatus === "idle" && h(this, V).remove(this);
   }
   setData(a, t) {
     const i = Dr(this.state.data, a, this.options);
@@ -1965,7 +1965,7 @@ var M = Hr(), Re, qt, Pn = (qt = class {
   cancel(a) {
     var i, n;
     const t = (i = h(this, K)) == null ? void 0 : i.promise;
-    return (n = h(this, K)) == null || n.cancel(a), t ? t.then(J).catch(J) : Promise.resolve();
+    return (n = h(this, K)) == null || n.cancel(a), t ? t.then(W).catch(W) : Promise.resolve();
   }
   destroy() {
     super.destroy(), this.cancel({ silent: !0 });
@@ -2005,10 +2005,10 @@ var M = Hr(), Re, qt, Pn = (qt = class {
     a == null || a.refetch({ cancelRefetch: !1 }), (t = h(this, K)) == null || t.continue();
   }
   addObserver(a) {
-    this.observers.includes(a) || (this.observers.push(a), this.clearGcTimeout(), h(this, W).notify({ type: "observerAdded", query: this, observer: a }));
+    this.observers.includes(a) || (this.observers.push(a), this.clearGcTimeout(), h(this, V).notify({ type: "observerAdded", query: this, observer: a }));
   }
   removeObserver(a) {
-    this.observers.includes(a) && (this.observers = this.observers.filter((t) => t !== a), this.observers.length || (h(this, K) && (h(this, ze) ? h(this, K).cancel({ revert: !0 }) : h(this, K).cancelRetry()), this.scheduleGc()), h(this, W).notify({ type: "observerRemoved", query: this, observer: a }));
+    this.observers.includes(a) && (this.observers = this.observers.filter((t) => t !== a), this.observers.length || (h(this, K) && (h(this, ze) ? h(this, K).cancel({ revert: !0 }) : h(this, K).cancelRetry()), this.scheduleGc()), h(this, V).notify({ type: "observerRemoved", query: this, observer: a }));
   }
   getObserversCount() {
     return this.observers.length;
@@ -2067,11 +2067,11 @@ var M = Hr(), Re, qt, Pn = (qt = class {
       Oa(p) && p.silent || D(this, Y, se).call(this, {
         type: "error",
         error: p
-      }), Oa(p) || ((f = (k = h(this, W).config).onError) == null || f.call(
+      }), Oa(p) || ((f = (k = h(this, V).config).onError) == null || f.call(
         k,
         p,
         this
-      ), (g = (m = h(this, W).config).onSettled) == null || g.call(
+      ), (g = (m = h(this, V).config).onSettled) == null || g.call(
         m,
         this.state.data,
         p,
@@ -2096,7 +2096,7 @@ var M = Hr(), Re, qt, Pn = (qt = class {
           d(y);
           return;
         }
-        (f = (k = h(this, W).config).onSuccess) == null || f.call(k, p, this), (g = (m = h(this, W).config).onSettled) == null || g.call(
+        (f = (k = h(this, V).config).onSuccess) == null || f.call(k, p, this), (g = (m = h(this, V).config).onSettled) == null || g.call(
           m,
           p,
           this.state.error,
@@ -2119,7 +2119,7 @@ var M = Hr(), Re, qt, Pn = (qt = class {
       canRun: () => !0
     })), h(this, K).start();
   }
-}, De = new WeakMap(), Ne = new WeakMap(), W = new WeakMap(), _e = new WeakMap(), K = new WeakMap(), Ve = new WeakMap(), ze = new WeakMap(), Y = new WeakSet(), se = function(a) {
+}, De = new WeakMap(), Ne = new WeakMap(), V = new WeakMap(), _e = new WeakMap(), K = new WeakMap(), Ve = new WeakMap(), ze = new WeakMap(), Y = new WeakSet(), se = function(a) {
   const t = (i) => {
     switch (a.type) {
       case "failed":
@@ -2186,7 +2186,7 @@ var M = Hr(), Re, qt, Pn = (qt = class {
   this.state = t(this.state), M.batch(() => {
     this.observers.forEach((i) => {
       i.onQueryUpdate();
-    }), h(this, W).notify({ query: this, type: "updated", action: a });
+    }), h(this, V).notify({ query: this, type: "updated", action: a });
   });
 }, Dt);
 function Qr(e, a) {
@@ -2578,7 +2578,7 @@ var ce, X, We, Lt, Yr = (Lt = class extends Xe {
     const a = this.getAll().filter((t) => t.state.isPaused);
     return M.batch(
       () => Promise.all(
-        a.map((t) => t.continue().catch(J))
+        a.map((t) => t.continue().catch(W))
       )
     );
   }
@@ -2766,7 +2766,7 @@ var P, ge, fe, Fe, Le, ke, Me, Ue, Mt, Zr = (Mt = class {
     const t = { revert: !0, ...a }, i = M.batch(
       () => h(this, P).findAll(e).map((n) => n.cancel(t))
     );
-    return Promise.all(i).then(J).catch(J);
+    return Promise.all(i).then(W).catch(W);
   }
   invalidateQueries(e, a = {}) {
     return M.batch(() => (h(this, P).findAll(e).forEach((t) => {
@@ -2786,10 +2786,10 @@ var P, ge, fe, Fe, Le, ke, Me, Ue, Mt, Zr = (Mt = class {
     }, i = M.batch(
       () => h(this, P).findAll(e).filter((n) => !n.isDisabled() && !n.isStatic()).map((n) => {
         let r = n.fetch(void 0, t);
-        return t.throwOnError || (r = r.catch(J)), n.state.fetchStatus === "paused" ? Promise.resolve() : r;
+        return t.throwOnError || (r = r.catch(W)), n.state.fetchStatus === "paused" ? Promise.resolve() : r;
       })
     );
-    return Promise.all(i).then(J);
+    return Promise.all(i).then(W);
   }
   fetchQuery(e) {
     const a = this.defaultQueryOptions(e);
@@ -2800,13 +2800,13 @@ var P, ge, fe, Fe, Le, ke, Me, Ue, Mt, Zr = (Mt = class {
     ) ? t.fetch(a) : Promise.resolve(t.state.data);
   }
   prefetchQuery(e) {
-    return this.fetchQuery(e).then(J).catch(J);
+    return this.fetchQuery(e).then(W).catch(W);
   }
   fetchInfiniteQuery(e) {
     return e.behavior = wt(e.pages), this.fetchQuery(e);
   }
   prefetchInfiniteQuery(e) {
-    return this.fetchInfiniteQuery(e).then(J).catch(J);
+    return this.fetchInfiniteQuery(e).then(W).catch(W);
   }
   ensureInfiniteQueryData(e) {
     return e.behavior = wt(e.pages), this.ensureQueryData(e);
@@ -2954,7 +2954,7 @@ var P, ge, fe, Fe, Le, ke, Me, Ue, Mt, Zr = (Mt = class {
 }, to = ({
   client: e,
   children: a
-}) => (Q(() => (e.mount(), () => {
+}) => (J(() => (e.mount(), () => {
   e.unmount();
 }), [e]), /* @__PURE__ */ S(Dn.Provider, { value: e, children: a }));
 function no(e, a) {
@@ -2964,7 +2964,7 @@ function no(e, a) {
       e
     )
   );
-  Q(() => {
+  J(() => {
     i.setOptions(e);
   }, [i, e]);
   const n = Wn(
@@ -2975,7 +2975,7 @@ function no(e, a) {
     () => i.getCurrentResult()
   ), r = F(
     (o, s) => {
-      i.mutate(o, s).catch(J);
+      i.mutate(o, s).catch(W);
     },
     [i]
   );
@@ -3322,9 +3322,9 @@ async function Eo(e, a) {
 var jo = "565487b2-a67c-4aac-bb92-3fb64732c7b8", Ln = Yn(
   ({ onLoad: e, scriptLocation: a }, t) => {
     const [i, n] = ve(!1);
-    return Q(() => {
+    return J(() => {
       window.hcaptcha && window.hcaptcha.render && n(!0);
-    }, []), Q(() => {
+    }, []), J(() => {
       i && e();
     }, [i, e]), /* @__PURE__ */ S(
       Ni,
@@ -3343,7 +3343,7 @@ var jo = "565487b2-a67c-4aac-bb92-3fb64732c7b8", Ln = Yn(
 Ln.displayName = "HCaptcha";
 var St = "kapa-recaptcha-script", Ro = ({ siteKey: e, config: a, onLoad: t }) => {
   const { loadScript: i = !0 } = a || {}, [n, r] = ve(!1);
-  return Q(() => {
+  return J(() => {
     var o;
     if (!i) return;
     const s = () => {
@@ -3366,7 +3366,7 @@ var St = "kapa-recaptcha-script", Ro = ({ siteKey: e, config: a, onLoad: t }) =>
     return u.addEventListener("load", s), u.addEventListener("error", d), () => {
       u && (u.removeEventListener("load", s), u.removeEventListener("error", d));
     };
-  }, [e, i]), Q(() => {
+  }, [e, i]), J(() => {
     if (n && window.grecaptcha)
       try {
         window.grecaptcha.enterprise.ready(() => {
@@ -4095,7 +4095,7 @@ var $o = "MHIUVE6Y4VV6H5lpgMyI", Bn = Je(void 0), At = ({
       l.conversation
     ]
   );
-  Q(() => {
+  J(() => {
     l.conversation.filter(
       (R) => R.status === "pending_completion"
     ).forEach((R) => {
@@ -4311,32 +4311,28 @@ function cs({ setModalState: e, searchQuery: a, urlParamQuery: t }) {
     isPreparingAnswer: f,
     stopGeneration: m,
     addFeedback: g
-  } = Ho();
-  Q(() => {
-    console.log(l);
-  }, [l]);
-  const y = (v) => {
+  } = Ho(), y = (v) => {
     v.preventDefault();
     const w = v.target, x = w == null ? void 0 : w.getAttribute("data-question-id"), O = x ? ei[x] : i;
     O.trim() && p(O.trim()), x || n(""), o(!0);
   };
-  return Q(() => {
+  return J(() => {
     r && u.current && (u.current.scrollIntoView({ behavior: "smooth" }), o(!1));
-  }, [r]), Q(() => {
+  }, [r]), J(() => {
     a && (n(""), p(a.trim()), o(!0));
-  }, [a, n, o]), Q(() => {
+  }, [a, n, o]), J(() => {
     !a && t && n(t);
   }, [t, a, n]), /* @__PURE__ */ S("div", { className: "n-ask-chat-container", children: [
     /* @__PURE__ */ S(ti, { onClick: () => e == null ? void 0 : e({ current: "search" }) }),
     /* @__PURE__ */ S("div", { ref: s, className: "n-ask-conversation n-search-window", children: [
       !l.length && !t && !a && /* @__PURE__ */ S(ai, { onClick: y, menuRef: d }),
-      /* @__PURE__ */ S(
+      l.length > 0 && /* @__PURE__ */ S(
         ni,
         {
           isPreparingAnswer: f,
           conversation: l,
           lastMessageRef: u,
-          addFeedback: g
+          feedback: g
         }
       )
     ] }),

package/dist/chunks/analytics.D_dJH08O.js

@@ -0,0 +1,20 @@
+class i {
+  /**
+   * Pushes an event payload into both Google Analytics (gtag) and Segment.
+   * @param eventName e.g. 'www:search_new_query'
+   * @param payload   additional key/value data
+   */
+  track(t, n = {}) {
+    if (typeof gtag == "function" ? gtag("event", t, { ...n }) : console.error(`gtag is not defined. Event [${t}] failed.`), typeof window < "u" && window.analytics)
+      try {
+        window.analytics.track(t, n);
+      } catch (e) {
+        console.error(`Segment track failed for event [${t}]:`, e);
+      }
+    else
+      console.warn(`Segment analytics is not loaded. Event [${t}] not sent to Segment.`);
+  }
+}
+export {
+  i as A
+};

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.nCAFTKgo.js";
+import { A as d } from "../../../chunks/AskNetlify.CpaPeYsd.js";
 import "./components/QuestionList/questions.js";
 import "./components/QuestionList/QuestionList.js";
 import "./components/BackButton.js";

package/dist/components/preact/AskNetlify/components/ActionBar.d.ts

@@ -1,7 +1,7 @@
 interface ActionBarProps {
     answer: string;
     questionAnswerId: string;
-    addFeedback: (id: string, type: string, meta?: object) => void;
+    feedback: (id: string, type: string, meta?: object) => void;
 }
-export declare function ActionBar({ answer, questionAnswerId, addFeedback }: ActionBarProps): import("preact").JSX.Element;
+export declare function ActionBar({ answer, questionAnswerId, feedback }: ActionBarProps): import("preact").JSX.Element;
 export {};

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

@@ -1,68 +1,78 @@
 import { u as t } from "../../../../chunks/jsxRuntime.module.Bzuv3cXw.js";
-import i from "../../Icon/index.js";
-import l from "../../Popover/Popover.js";
-const d = (c) => {
-  const e = c.target.closest("button");
-  if (!e) return;
-  const o = e.classList.contains("btn-feedback-helpful"), r = e.classList.contains("btn-feedback-incorrect");
-  if (!o && !r) return;
-  const n = e.closest(".n-ask-action-bar"), u = n == null ? void 0 : n.querySelector(".btn-feedback-helpful"), f = n == null ? void 0 : n.querySelector(".btn-feedback-incorrect");
-  [u, f].forEach((s) => {
-    if (!s) return;
-    s.querySelectorAll('[id*="icon"]').forEach((a, p) => {
-      p === 0 ? a.classList.remove("hidden") : a.classList.add("hidden");
+import s from "../../Icon/index.js";
+import r from "../../Popover/Popover.js";
+import { A as m } from "../../../../chunks/analytics.D_dJH08O.js";
+const u = (a) => {
+  const e = "btn-feedback-helpful", n = "btn-feedback-inaccurate", c = a.target.closest("button");
+  if (!c) return;
+  const i = c.classList.contains(e), f = c.classList.contains(n);
+  if (!i && !f) return;
+  const o = c.closest(".n-ask-action-bar"), p = o == null ? void 0 : o.querySelector(`.${e}`), b = o == null ? void 0 : o.querySelector(`.${n}`);
+  [p, b].forEach((l) => {
+    if (!l) return;
+    l.querySelectorAll('[id*="icon"]').forEach((d, h) => {
+      h === 0 ? d.classList.remove("hidden") : d.classList.add("hidden");
     });
-  }), e.querySelectorAll('[id*="icon"]').forEach((s) => {
-    s.classList.toggle("hidden");
+  }), c.querySelectorAll('[id*="icon"]').forEach((l) => {
+    l.classList.toggle("hidden");
   });
-}, b = async (c) => {
-  const e = document.getElementById("copy-popover");
+}, k = async (a) => {
+  const e = document.getElementById("copy-popover"), n = 2e3;
   try {
-    await navigator.clipboard.writeText(c), e && (e.textContent = "Copied", setTimeout(() => {
+    await navigator.clipboard.writeText(a), e && (e.textContent = "Copied", setTimeout(() => {
       e.textContent = "Copy", e.blur();
-    }, 2e3));
-  } catch (o) {
-    console.error("Failed to copy code: ", o), e && (e.textContent = "Failed to copy", setTimeout(() => {
+    }, n));
+  } catch (c) {
+    console.error("Failed to copy code: ", c), e && (e.textContent = "Failed to copy", setTimeout(() => {
       e.textContent = "Copy", e.blur();
-    }, 2e3));
+    }, n));
   }
 };
-function v({ answer: c, questionAnswerId: e, addFeedback: o }) {
+function T({ answer: a, questionAnswerId: e, feedback: n }) {
+  const c = new m();
   return /* @__PURE__ */ t("div", { className: "n-ask-action-bar", children: [
-    /* @__PURE__ */ t(l, { id: "copy", content: "Copy", children: /* @__PURE__ */ t("button", { onClick: () => b(c), children: /* @__PURE__ */ t(i, { name: "copy" }) }) }),
-    /* @__PURE__ */ t(l, { id: "feedback-helpful", content: "Helpful", children: /* @__PURE__ */ t(
+    /* @__PURE__ */ t(r, { id: "copy", content: "Copy", children: /* @__PURE__ */ t(
+      "button",
+      {
+        onClick: () => {
+          k(a), c.track("ask:copy_answer", { id: e });
+        },
+        children: /* @__PURE__ */ t(s, { name: "copy" })
+      }
+    ) }),
+    /* @__PURE__ */ t(r, { id: "feedback-helpful", content: "Helpful", children: /* @__PURE__ */ t(
       "button",
       {
         class: "btn-feedback-helpful n-stack",
-        onClick: (r) => {
-          d(r), o(e, "upvote");
+        onClick: (i) => {
+          u(i), n(e, "upvote"), c.track("ask:feedback_helpful", { id: e });
         },
         children: [
-          /* @__PURE__ */ t(i, { name: "thumbsUp" }),
-          /* @__PURE__ */ t(i, { name: "thumbsUpSolid", className: "hidden" })
+          /* @__PURE__ */ t(s, { name: "thumbsUp" }),
+          /* @__PURE__ */ t(s, { name: "thumbsUpSolid", className: "hidden" })
         ]
       }
     ) }),
-    /* @__PURE__ */ t(l, { id: "feedback-incorrect", content: "Not helpful", children: /* @__PURE__ */ t(
+    /* @__PURE__ */ t(r, { id: "feedback-inaccurate", content: "Not helpful", children: /* @__PURE__ */ t(
       "button",
       {
-        class: "btn-feedback-incorrect n-stack",
-        onClick: (r) => {
-          d(r), o(e, "downvote", {
+        class: "btn-feedback-inaccurate n-stack",
+        onClick: (i) => {
+          u(i), n(e, "downvote", {
             incorrect: !0,
             irrelevant: !1,
             unaddressed: !1,
-            issue: "This information isn't accurate"
-          });
+            issue: "This information is inaccurate"
+          }), c.track("ask:feedback_inaccurate", { id: e });
         },
         children: [
-          /* @__PURE__ */ t(i, { name: "thumbsDown" }),
-          /* @__PURE__ */ t(i, { name: "thumbsDownSolid", className: "hidden" })
+          /* @__PURE__ */ t(s, { name: "thumbsDown" }),
+          /* @__PURE__ */ t(s, { name: "thumbsDownSolid", className: "hidden" })
         ]
       }
     ) })
   ] });
 }
 export {
-  v as ActionBar
+  T as ActionBar
 };

package/dist/components/preact/AskNetlify/components/ChatMessages.d.ts

@@ -1,7 +1,7 @@
 import { Ref } from 'preact';
-export declare function ChatMessages({ conversation, lastMessageRef, isPreparingAnswer, addFeedback, }: {
+export declare function ChatMessages({ conversation, lastMessageRef, isPreparingAnswer, feedback, }: {
     conversation: any[];
     lastMessageRef: Ref<HTMLDivElement>;
     isPreparingAnswer: boolean;
-    addFeedback: any;
+    feedback: any;
 }): import("preact").JSX.Element;

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

@@ -1570,7 +1570,7 @@ function ft({
   conversation: n,
   lastMessageRef: e,
   isPreparingAnswer: t,
-  addFeedback: r
+  feedback: r
 }) {
   return /* @__PURE__ */ w(ve, { children: [
     n.map((s, i) => {
@@ -1592,14 +1592,7 @@ function ft({
               dangerouslySetInnerHTML: { __html: f.parse(s.answer) }
             }
           ),
-          s.id && /* @__PURE__ */ w(
-            Re,
-            {
-              answer: s.answer,
-              addFeedback: r,
-              questionAnswerId: s.id
-            }
-          ),
+          s.id && /* @__PURE__ */ w(Re, { answer: s.answer, feedback: r, questionAnswerId: s.id }),
           s.id && /* @__PURE__ */ w($e, { sources: s.sources })
         ] }) })
       ] }, s.id || `qa-${i}`);

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

@@ -1,5 +1,5 @@
 import { A as o, q as n } from "../../../../chunks/hooks.module.DGkdD5n9.js";
-import { A as u } from "../../../../chunks/analytics.Ch1vuuOl.js";
+import { A as u } from "../../../../chunks/analytics.D_dJH08O.js";
 function A() {
   const r = o(new u()).current, s = n((e) => {
     !e.question || !e.threadId || r == null || r.track("ask:new_query", {

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.nCAFTKgo.js";
+import { A as K, K as L } from "../../../../../chunks/AskNetlify.CpaPeYsd.js";
 import P from "../../../Modal/Modal.js";
 import h from "../../../KeyboardKey/KeyboardKey.js";
 import M from "../SearchWindow.js";

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

@@ -1,5 +1,5 @@
 import { A as y, y as h, q as d } from "../../../../chunks/hooks.module.DGkdD5n9.js";
-import { A as T } from "../../../../chunks/analytics.Ch1vuuOl.js";
+import { A as T } from "../../../../chunks/analytics.D_dJH08O.js";
 function A(r, l) {
   const n = y(new T()).current, e = (c) => c.debug_mode = !0;
   return h(() => {

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.nCAFTKgo.js";
+import { A as S } from "../../chunks/AskNetlify.CpaPeYsd.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.18.0-alpha.0",
+  "version": "1.18.0",
   "type": "module",
   "main": "dist/components/preact/index.js",
   "types": "dist/components/preact/index.d.ts",

package/packages/analytics/analytics.ts

@@ -1,16 +1,40 @@
 export default class Analytics {
-
   /**
-   * Pushes an event payload into the dataLayer.
+   * Pushes an event payload into both Google Analytics (gtag) and Segment.
    * @param eventName e.g. 'www:search_new_query'
    * @param payload   additional key/value data
    */
   track(eventName: string, payload: Record<string, any> = {}): void {
-    // Ensures that gtag is available before pushing events
+    // Track with Google Analytics (gtag)
     if (typeof gtag === 'function') {
       gtag('event', eventName, { ...payload });
     } else {
       console.error(`gtag is not defined. Event [${eventName}] failed.`);
     }
+
+    // Track with Segment
+    if (typeof window !== 'undefined' && window.analytics) {
+      try {
+        window.analytics.track(eventName, payload);
+      } catch (error) {
+        console.error(`Segment track failed for event [${eventName}]:`, error);
+      }
+    } else {
+      console.warn(`Segment analytics is not loaded. Event [${eventName}] not sent to Segment.`);
+    }
+  }
+}
+
+declare global {
+  interface Window {
+    analytics: {
+      track: (
+        event: string,
+        properties?: Record<string, any>,
+        options?: Record<string, any>,
+        callback?: () => void
+      ) => void;
+    };
   }
-}
+  function gtag(...args: any[]): void;
+}

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

@@ -182,12 +182,13 @@
 }
 
 .n-ask-action-bar .n-popover {
-  --n-popover-padding: var(--space-2xs) var(--space-xs);
+  --n-popover-padding: var(--space-3xs) var(--space-2xs);
+  --n-popover-bottom: 125%;
 }
 
 .n-ask-action-bar [id*='icon-'] {
   width: auto;
-  height: 14px;
+  height: 1rem;
 }
 
 /* ----------------------------- */

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

@@ -32,10 +32,6 @@ export default function AskNetlify({ setModalState, searchQuery, urlParamQuery }
     addFeedback,
   } = useChat();
 
-  useEffect(() => {
-    console.log(conversation);
-  }, [conversation]);
-
   const handleSubmit = (e: Event | preact.JSX.TargetedMouseEvent<HTMLButtonElement>) => {
     e.preventDefault();
     const target = e.target as HTMLButtonElement;
@@ -83,14 +79,14 @@ export default function AskNetlify({ setModalState, searchQuery, urlParamQuery }
           <QuestionList onClick={handleSubmit} menuRef={menuRef} />
         )}
 
-        {
+        {conversation.length > 0 && (
           <ChatMessages
             isPreparingAnswer={isPreparingAnswer}
             conversation={conversation}
             lastMessageRef={lastMessageRef}
-            addFeedback={addFeedback}
+            feedback={addFeedback}
           />
-        }
+        )}
       </div>
 
       <form onSubmit={handleSubmit} className="n-ask-form n-search-input-wrapper">

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

@@ -1,29 +1,32 @@
 import Icon from '@components/preact/Icon';
 import Popover from '@components/preact/Popover/Popover';
+import Analytics from '@analtyics/analytics';
 
 interface ActionBarProps {
   answer: string;
   questionAnswerId: string;
-  addFeedback: (id: string, type: string, meta?: object) => void;
+  feedback: (id: string, type: string, meta?: object) => void;
 }
 
 const toggleFeedbackButton = (e: MouseEvent): void => {
+  const feedbackHelpfulId = 'btn-feedback-helpful';
+  const feedbackInaccurateId = 'btn-feedback-inaccurate';
   const btn = (e.target as HTMLElement).closest('button');
   if (!btn) return;
 
-  const isHelpfulBtn = btn.classList.contains('btn-feedback-helpful');
-  const isIncorrectBtn = btn.classList.contains('btn-feedback-incorrect');
+  const isHelpfulBtn = btn.classList.contains(feedbackHelpfulId);
+  const isInaccurateBtn = btn.classList.contains(feedbackInaccurateId);
 
   // Only proceed if it's one of the feedback buttons
-  if (!isHelpfulBtn && !isIncorrectBtn) return;
+  if (!isHelpfulBtn && !isInaccurateBtn) return;
 
   // Get both feedback buttons
   const actionBar = btn.closest('.n-ask-action-bar');
-  const helpfulBtn = actionBar?.querySelector('.btn-feedback-helpful');
-  const incorrectBtn = actionBar?.querySelector('.btn-feedback-incorrect');
+  const helpfulBtn = actionBar?.querySelector(`.${feedbackHelpfulId}`);
+  const inaccurateBtn = actionBar?.querySelector(`.${feedbackInaccurateId}`);
 
   // Reset both buttons first (hide all solid icons, show all outline icons)
-  [helpfulBtn, incorrectBtn].forEach(button => {
+  [helpfulBtn, inaccurateBtn].forEach(button => {
     if (!button) return;
     const icons = button.querySelectorAll('[id*="icon"]');
     icons.forEach((icon, index) => {
@@ -44,6 +47,7 @@ const toggleFeedbackButton = (e: MouseEvent): void => {
 
 const copyToClipboard = async (text: string): Promise<void> => {
   const copyPopover = document.getElementById('copy-popover');
+  const MAX_TIME = 2000;
   try {
     await navigator.clipboard.writeText(text);
     if (copyPopover) {
@@ -51,7 +55,7 @@ const copyToClipboard = async (text: string): Promise<void> => {
       setTimeout(() => {
         copyPopover.textContent = 'Copy';
         copyPopover.blur();
-      }, 2000);
+      }, MAX_TIME);
     }
   } catch (error) {
     console.error('Failed to copy code: ', error);
@@ -60,16 +64,23 @@ const copyToClipboard = async (text: string): Promise<void> => {
       setTimeout(() => {
         copyPopover.textContent = 'Copy';
         copyPopover.blur();
-      }, 2000);
+      }, MAX_TIME);
     }
   }
 };
 
-export function ActionBar({ answer, questionAnswerId, addFeedback }: ActionBarProps) {
+export function ActionBar({ answer, questionAnswerId, feedback }: ActionBarProps) {
+  const analytics = new Analytics();
+
   return (
     <div className="n-ask-action-bar">
       <Popover id="copy" content={`Copy`}>
-        <button onClick={() => copyToClipboard(answer)}>
+        <button
+          onClick={() => {
+            copyToClipboard(answer);
+            analytics.track('ask:copy_answer', { id: questionAnswerId });
+          }}
+        >
           <Icon name="copy" />
         </button>
       </Popover>
@@ -79,7 +90,8 @@ export function ActionBar({ answer, questionAnswerId, addFeedback }: ActionBarPr
           class="btn-feedback-helpful n-stack"
           onClick={e => {
             toggleFeedbackButton(e as unknown as MouseEvent);
-            addFeedback(questionAnswerId, 'upvote');
+            feedback(questionAnswerId, 'upvote');
+            analytics.track('ask:feedback_helpful', { id: questionAnswerId });
           }}
         >
           <Icon name="thumbsUp" />
@@ -87,17 +99,18 @@ export function ActionBar({ answer, questionAnswerId, addFeedback }: ActionBarPr
         </button>
       </Popover>
 
-      <Popover id="feedback-incorrect" content={`Not helpful`}>
+      <Popover id="feedback-inaccurate" content={`Not helpful`}>
         <button
-          class="btn-feedback-incorrect n-stack"
+          class="btn-feedback-inaccurate n-stack"
           onClick={e => {
             toggleFeedbackButton(e as unknown as MouseEvent);
-            addFeedback(questionAnswerId, 'downvote', {
+            feedback(questionAnswerId, 'downvote', {
               incorrect: true,
               irrelevant: false,
               unaddressed: false,
-              issue: "This information isn't accurate",
+              issue: 'This information is inaccurate',
             });
+            analytics.track('ask:feedback_inaccurate', { id: questionAnswerId });
           }}
         >
           <Icon name="thumbsDown" />

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

@@ -8,12 +8,12 @@ export function ChatMessages({
   conversation,
   lastMessageRef,
   isPreparingAnswer,
-  addFeedback,
+  feedback,
 }: {
   conversation: any[];
   lastMessageRef: Ref<HTMLDivElement>;
   isPreparingAnswer: boolean;
-  addFeedback: any;
+  feedback: any;
 }) {
   return (
     <>
@@ -38,11 +38,7 @@ export function ChatMessages({
                     dangerouslySetInnerHTML={{ __html: marked.parse(qa.answer) }}
                   />
                   {qa.id && (
-                    <ActionBar
-                      answer={qa.answer}
-                      addFeedback={addFeedback}
-                      questionAnswerId={qa.id}
-                    />
+                    <ActionBar answer={qa.answer} feedback={feedback} questionAnswerId={qa.id} />
                   )}
                   {qa.id && <SourcesList sources={qa.sources} />}
                 </div>

package/packages/components/preact/Popover/Popover.css

@@ -38,7 +38,7 @@
 }
 
 .n-popover-top .n-popover {
-  bottom: 145%;
+  bottom: var(--n-popover-bottom, 145%);
   left: 50%;
   transform: translateX(-50%);
   width: max-content;

package/dist/chunks/analytics.Ch1vuuOl.js

@@ -1,13 +0,0 @@
-class n {
-  /**
-   * Pushes an event payload into the dataLayer.
-   * @param eventName e.g. 'www:search_new_query'
-   * @param payload   additional key/value data
-   */
-  track(t, e = {}) {
-    typeof gtag == "function" ? gtag("event", t, { ...e }) : console.error(`gtag is not defined. Event [${t}] failed.`);
-  }
-}
-export {
-  n as A
-};