@hook-sdk/template 0.4.0 → 0.4.2

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/AppRoot.tsx
-import { useCallback as useCallback7, useEffect as useEffect7, useRef as useRef2, useState as useState12 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect7, useRef as useRef2, useState as useState11 } from "react";
 import { useHook as useHook8 } from "@hook-sdk/sdk";
 
 // src/internal/TemplateConfigContext.tsx
@@ -402,15 +402,6 @@ function useInstallPrompt(slug) {
     setIsDismissedPermanent(true);
     track("pwa_install_permanent_dismiss", { slug, platform, prior_skip_count: skipCount });
   }, [slug, platform, skipCount]);
-  const redirectToSafari = useCallback2(() => {
-    if (typeof location === "undefined") return;
-    track("pwa_install_redirect_to_safari", { slug });
-    const url = `safari-https://${location.host}${location.pathname}${location.search}${location.hash}`;
-    try {
-      window.location.href = url;
-    } catch {
-    }
-  }, [slug]);
   const copyLink = useCallback2(async () => {
     if (typeof navigator === "undefined" || typeof location === "undefined") return;
     try {
@@ -449,7 +440,6 @@ function useInstallPrompt(slug) {
     promptInstall,
     dismissSession,
     dismissPermanent,
-    redirectToSafari,
     copyLink,
     reset
   };
@@ -509,12 +499,21 @@ var INSTALL_COPY = {
     skipPermanent: "N\xE3o me pergunte mais"
   },
   iosOther: {
-    title: "Abra no Safari pra instalar",
-    subtitle: "No Chrome/Firefox/Edge do iPhone n\xE3o d\xE1 pra instalar PWA. Abra o link no Safari.",
-    ctaPrimary: "Abrir no Safari",
-    ctaSecondary: "Copiar link",
-    copiedToast: "Link copiado. Cole no Safari.",
-    skip: "Continuar mesmo assim",
+    title: "Adicione \xE0 sua Tela de In\xEDcio",
+    subtitle: "Siga os 3 passos",
+    step1: {
+      title: "Toque em Compartilhar",
+      subtitle: "Geralmente no topo ou no menu do navegador"
+    },
+    step2: {
+      title: 'Role e toque em "Adicionar \xE0 Tela de In\xEDcio"',
+      iconLabel: "Adicionar \xE0 Tela de In\xEDcio"
+    },
+    step3: {
+      title: 'Toque em "Adicionar" pra confirmar',
+      buttonLabel: "Adicionar"
+    },
+    skip: "Continuar no navegador",
     skipPermanent: "N\xE3o me pergunte mais"
   },
   inApp: {
@@ -650,18 +649,6 @@ var primaryButtonStyle = {
   cursor: "pointer",
   marginBottom: 12
 };
-var secondaryButtonStyle = {
-  width: "100%",
-  padding: "12px 20px",
-  background: "transparent",
-  color: "var(--hook-color-primary)",
-  border: "1px solid var(--hook-color-primary)",
-  borderRadius: 999,
-  fontSize: 15,
-  fontWeight: 500,
-  cursor: "pointer",
-  marginBottom: 12
-};
 var skipLinkStyle = {
   display: "block",
   width: "100%",
@@ -908,22 +895,70 @@ function Step({ n, icon, children }) {
   );
 }
 
-// src/components/InstallGate/variants/IOSafariVariant.tsx
+// src/components/InstallGate/Step.tsx
 import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+function Step2({
+  n,
+  title,
+  subtitle,
+  visual
+}) {
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "flex-start",
+        gap: 12,
+        marginBottom: 16,
+        textAlign: "left"
+      },
+      children: [
+        /* @__PURE__ */ jsx11(
+          "div",
+          {
+            style: {
+              width: 32,
+              height: 32,
+              borderRadius: 10,
+              background: "var(--hook-color-primary)",
+              color: "#fff",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              fontSize: 15,
+              fontWeight: 700,
+              flexShrink: 0
+            },
+            children: n
+          }
+        ),
+        /* @__PURE__ */ jsxs5("div", { style: { flex: 1 }, children: [
+          /* @__PURE__ */ jsx11("p", { style: { margin: 0, fontSize: 15, fontWeight: 500, color: "#111", lineHeight: 1.3 }, children: title }),
+          subtitle && /* @__PURE__ */ jsx11("p", { style: { margin: "4px 0 0 0", fontSize: 13, color: "#777" }, children: subtitle }),
+          visual
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/InstallGate/variants/IOSafariVariant.tsx
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 function IOSafariVariant({
   state,
   actions
 }) {
   const copy = INSTALL_COPY.iosSafari;
   const showPermanent = shouldShowPermanentOption(state);
-  return /* @__PURE__ */ jsxs5(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
-    /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsxs6(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
+    /* @__PURE__ */ jsx12(
       Step2,
       {
         n: 1,
         title: copy.step1.title,
         subtitle: copy.step1.subtitle,
-        visual: /* @__PURE__ */ jsx11(
+        visual: /* @__PURE__ */ jsx12(
           "div",
           {
             style: {
@@ -935,17 +970,17 @@ function IOSafariVariant({
               padding: "12px 0",
               marginTop: 8
             },
-            children: /* @__PURE__ */ jsx11(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
+            children: /* @__PURE__ */ jsx12(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
           }
         )
       }
     ),
-    /* @__PURE__ */ jsx11(
+    /* @__PURE__ */ jsx12(
       Step2,
       {
         n: 2,
         title: copy.step2.title,
-        visual: /* @__PURE__ */ jsxs5(
+        visual: /* @__PURE__ */ jsxs6(
           "div",
           {
             style: {
@@ -958,19 +993,19 @@ function IOSafariVariant({
               marginTop: 8
             },
             children: [
-              /* @__PURE__ */ jsx11(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
-              /* @__PURE__ */ jsx11("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
+              /* @__PURE__ */ jsx12(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
+              /* @__PURE__ */ jsx12("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
             ]
           }
         )
       }
     ),
-    /* @__PURE__ */ jsx11(
+    /* @__PURE__ */ jsx12(
       Step2,
       {
         n: 3,
         title: copy.step3.title,
-        visual: /* @__PURE__ */ jsx11(
+        visual: /* @__PURE__ */ jsx12(
           "div",
           {
             style: {
@@ -981,7 +1016,7 @@ function IOSafariVariant({
               padding: "10px 14px",
               marginTop: 8
             },
-            children: /* @__PURE__ */ jsx11(
+            children: /* @__PURE__ */ jsx12(
               "span",
               {
                 style: {
@@ -996,7 +1031,7 @@ function IOSafariVariant({
         )
       }
     ),
-    /* @__PURE__ */ jsx11(
+    /* @__PURE__ */ jsx12(
       "button",
       {
         "data-testid": "install-prompt-skip-session",
@@ -1006,7 +1041,7 @@ function IOSafariVariant({
         children: copy.skip
       }
     ),
-    showPermanent && /* @__PURE__ */ jsx11(
+    showPermanent && /* @__PURE__ */ jsx12(
       "button",
       {
         "data-testid": "install-prompt-skip-permanent",
@@ -1018,99 +1053,106 @@ function IOSafariVariant({
     )
   ] });
 }
-function Step2({
-  n,
-  title,
-  subtitle,
-  visual
-}) {
-  return /* @__PURE__ */ jsxs5(
-    "div",
-    {
-      style: {
-        display: "flex",
-        alignItems: "flex-start",
-        gap: 12,
-        marginBottom: 16,
-        textAlign: "left"
-      },
-      children: [
-        /* @__PURE__ */ jsx11(
-          "div",
-          {
-            style: {
-              width: 32,
-              height: 32,
-              borderRadius: 10,
-              background: "var(--hook-color-primary)",
-              color: "#fff",
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              fontSize: 15,
-              fontWeight: 700,
-              flexShrink: 0
-            },
-            children: n
-          }
-        ),
-        /* @__PURE__ */ jsxs5("div", { style: { flex: 1 }, children: [
-          /* @__PURE__ */ jsx11("p", { style: { margin: 0, fontSize: 15, fontWeight: 500, color: "#111", lineHeight: 1.3 }, children: title }),
-          subtitle && /* @__PURE__ */ jsx11("p", { style: { margin: "4px 0 0 0", fontSize: 13, color: "#777" }, children: subtitle }),
-          visual
-        ] })
-      ]
-    }
-  );
-}
 
 // src/components/InstallGate/variants/IOSOtherVariant.tsx
-import { useState as useState4 } from "react";
-import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
 function IOSOtherVariant({
   state,
   actions
 }) {
   const copy = INSTALL_COPY.iosOther;
   const showPermanent = shouldShowPermanentOption(state);
-  const [copied, setCopied] = useState4(false);
-  const handleCopy = async () => {
-    await actions.copyLink();
-    setCopied(true);
-    setTimeout(() => setCopied(false), 2e3);
-  };
-  return /* @__PURE__ */ jsxs6(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
-    /* @__PURE__ */ jsx12(
-      "button",
+  return /* @__PURE__ */ jsxs7(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
+    /* @__PURE__ */ jsx13(
+      Step2,
       {
-        "data-testid": "install-prompt-cta-ios-other-primary",
-        type: "button",
-        onClick: actions.redirectToSafari,
-        style: primaryButtonStyle,
-        children: copy.ctaPrimary
+        n: 1,
+        title: copy.step1.title,
+        subtitle: copy.step1.subtitle,
+        visual: /* @__PURE__ */ jsx13(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "center",
+              alignItems: "center",
+              background: "#f5f5f7",
+              borderRadius: 12,
+              padding: "12px 0",
+              marginTop: 8
+            },
+            children: /* @__PURE__ */ jsx13(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
+          }
+        )
       }
     ),
-    /* @__PURE__ */ jsx12(
-      "button",
+    /* @__PURE__ */ jsx13(
+      Step2,
       {
-        "data-testid": "install-prompt-cta-ios-other-secondary",
-        type: "button",
-        onClick: () => void handleCopy(),
-        style: secondaryButtonStyle,
-        children: copied ? copy.copiedToast : copy.ctaSecondary
+        n: 2,
+        title: copy.step2.title,
+        visual: /* @__PURE__ */ jsxs7(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: 10,
+              background: "#f5f5f7",
+              borderRadius: 12,
+              padding: "12px 14px",
+              marginTop: 8
+            },
+            children: [
+              /* @__PURE__ */ jsx13(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
+              /* @__PURE__ */ jsx13("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
+            ]
+          }
+        )
       }
     ),
-    /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx13(
+      Step2,
+      {
+        n: 3,
+        title: copy.step3.title,
+        visual: /* @__PURE__ */ jsx13(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "flex-end",
+              background: "#f5f5f7",
+              borderRadius: 12,
+              padding: "10px 14px",
+              marginTop: 8
+            },
+            children: /* @__PURE__ */ jsx13(
+              "span",
+              {
+                style: {
+                  color: "var(--hook-color-primary)",
+                  fontSize: 15,
+                  fontWeight: 600
+                },
+                children: copy.step3.buttonLabel
+              }
+            )
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx13(
       "button",
       {
         "data-testid": "install-prompt-skip-session",
         type: "button",
         onClick: actions.dismissSession,
-        style: skipLinkStyle,
+        style: { ...skipLinkStyle, marginTop: 16 },
         children: copy.skip
       }
     ),
-    showPermanent && /* @__PURE__ */ jsx12(
+    showPermanent && /* @__PURE__ */ jsx13(
       "button",
       {
         "data-testid": "install-prompt-skip-permanent",
@@ -1124,8 +1166,8 @@ function IOSOtherVariant({
 }
 
 // src/components/InstallGate/variants/InAppBrowserVariant.tsx
-import { useState as useState5 } from "react";
-import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+import { useState as useState4 } from "react";
+import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
 function InAppBrowserVariant({
   state,
   actions
@@ -1134,17 +1176,17 @@ function InAppBrowserVariant({
   const appCopy = INSTALL_COPY.inApp[app] ?? INSTALL_COPY.inApp.other;
   const copy = INSTALL_COPY.inApp;
   const showPermanent = shouldShowPermanentOption(state);
-  const [copied, setCopied] = useState5(false);
+  const [copied, setCopied] = useState4(false);
   const handleCopy = async () => {
     await actions.copyLink();
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   };
   const DotsIcon = app === "facebook" || app === "telegram" ? MenuDotsVerticalIcon : MenuDotsHorizontalIcon;
-  return /* @__PURE__ */ jsxs7(InstallSplash, { title: appCopy.title, children: [
-    /* @__PURE__ */ jsx13(Step3, { n: 1, icon: /* @__PURE__ */ jsx13(DotsIcon, { size: 20 }), children: appCopy.step1 }),
-    /* @__PURE__ */ jsx13(Step3, { n: 2, icon: /* @__PURE__ */ jsx13(ExternalLinkIcon, { size: 18 }), children: appCopy.step2 }),
-    /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsxs8(InstallSplash, { title: appCopy.title, children: [
+    /* @__PURE__ */ jsx14(Step3, { n: 1, icon: /* @__PURE__ */ jsx14(DotsIcon, { size: 20 }), children: appCopy.step1 }),
+    /* @__PURE__ */ jsx14(Step3, { n: 2, icon: /* @__PURE__ */ jsx14(ExternalLinkIcon, { size: 18 }), children: appCopy.step2 }),
+    /* @__PURE__ */ jsx14(
       "button",
       {
         "data-testid": "install-prompt-cta-inapp-copy",
@@ -1154,7 +1196,7 @@ function InAppBrowserVariant({
         children: copied ? copy.copiedToast : copy.copy
       }
     ),
-    /* @__PURE__ */ jsx13(
+    /* @__PURE__ */ jsx14(
       "button",
       {
         "data-testid": "install-prompt-skip-session",
@@ -1164,7 +1206,7 @@ function InAppBrowserVariant({
         children: copy.skip
       }
     ),
-    showPermanent && /* @__PURE__ */ jsx13(
+    showPermanent && /* @__PURE__ */ jsx14(
       "button",
       {
         "data-testid": "install-prompt-skip-permanent",
@@ -1181,7 +1223,7 @@ function Step3({
   icon,
   children
 }) {
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     "div",
     {
       style: {
@@ -1195,7 +1237,7 @@ function Step3({
         textAlign: "left"
       },
       children: [
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx14(
           "div",
           {
             style: {
@@ -1214,15 +1256,15 @@ function Step3({
             children: n
           }
         ),
-        /* @__PURE__ */ jsx13("div", { style: { flex: 1, fontSize: 14, color: "#333" }, children }),
-        /* @__PURE__ */ jsx13("div", { style: { color: "#888", flexShrink: 0 }, children: icon })
+        /* @__PURE__ */ jsx14("div", { style: { flex: 1, fontSize: 14, color: "#333" }, children }),
+        /* @__PURE__ */ jsx14("div", { style: { color: "#888", flexShrink: 0 }, children: icon })
       ]
     }
   );
 }
 
 // src/components/InstallGate/variants/DesktopVariant.tsx
-import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 function DesktopVariant({
   state,
   actions
@@ -1231,21 +1273,21 @@ function DesktopVariant({
   const copy = INSTALL_COPY.desktop;
   const iconUrl = theme.icon_url || theme.logo_url || null;
   if (!state.isInstallable) return null;
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     "div",
     {
       role: "complementary",
       "aria-label": copy.title,
       style: bannerStyle,
       children: [
-        iconUrl ? /* @__PURE__ */ jsx14(
+        iconUrl ? /* @__PURE__ */ jsx15(
           "img",
           {
             src: iconUrl,
             alt: "",
             style: { width: 40, height: 40, borderRadius: 10, objectFit: "cover", flexShrink: 0 }
           }
-        ) : /* @__PURE__ */ jsx14(
+        ) : /* @__PURE__ */ jsx15(
           "div",
           {
             style: {
@@ -1264,11 +1306,11 @@ function DesktopVariant({
             children: name.charAt(0).toUpperCase()
           }
         ),
-        /* @__PURE__ */ jsxs8("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ jsx14("div", { style: { fontSize: 14, fontWeight: 600, color: "#111" }, children: copy.title }),
-          /* @__PURE__ */ jsx14("div", { style: { fontSize: 12, color: "#666" }, children: copy.subtitle })
+        /* @__PURE__ */ jsxs9("div", { style: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx15("div", { style: { fontSize: 14, fontWeight: 600, color: "#111" }, children: copy.title }),
+          /* @__PURE__ */ jsx15("div", { style: { fontSize: 12, color: "#666" }, children: copy.subtitle })
         ] }),
-        /* @__PURE__ */ jsxs8(
+        /* @__PURE__ */ jsxs9(
           "button",
           {
             "data-testid": "install-prompt-cta-desktop",
@@ -1289,12 +1331,12 @@ function DesktopVariant({
               flexShrink: 0
             },
             children: [
-              /* @__PURE__ */ jsx14(DownloadIcon, { size: 14 }),
+              /* @__PURE__ */ jsx15(DownloadIcon, { size: 14 }),
               copy.cta
             ]
           }
         ),
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           "button",
           {
             "data-testid": "install-prompt-desktop-close",
@@ -1309,7 +1351,7 @@ function DesktopVariant({
               padding: 4,
               flexShrink: 0
             },
-            children: /* @__PURE__ */ jsx14(XIcon, { size: 16 })
+            children: /* @__PURE__ */ jsx15(XIcon, { size: 16 })
           }
         )
       ]
@@ -1333,7 +1375,7 @@ var bannerStyle = {
 };
 
 // src/components/InstallGate/InstallGate.tsx
-import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
 function InstallGate({ children }) {
   const { slug, features_enabled } = useTemplateConfig();
   const enabled = features_enabled.includes("install_prompt");
@@ -1354,35 +1396,35 @@ function InstallGate({ children }) {
       variant: installState.variant
     });
   }, [shouldBlock, slug, installState.variant, installState.platform, installState.iosBrowser, installState.androidBrowser, installState.inAppApp]);
-  if (!enabled) return /* @__PURE__ */ jsx15(Fragment4, { children });
-  if (installState.isInstalled) return /* @__PURE__ */ jsx15(Fragment4, { children });
+  if (!enabled) return /* @__PURE__ */ jsx16(Fragment4, { children });
+  if (installState.isInstalled) return /* @__PURE__ */ jsx16(Fragment4, { children });
   if (installState.variant === "desktop") {
-    return /* @__PURE__ */ jsxs9(Fragment4, { children: [
+    return /* @__PURE__ */ jsxs10(Fragment4, { children: [
       children,
-      /* @__PURE__ */ jsx15(DesktopVariant, { state: installState, actions: installState })
+      /* @__PURE__ */ jsx16(DesktopVariant, { state: installState, actions: installState })
     ] });
   }
-  if (!shouldBlock) return /* @__PURE__ */ jsx15(Fragment4, { children });
+  if (!shouldBlock) return /* @__PURE__ */ jsx16(Fragment4, { children });
   switch (installState.variant) {
     case "android-native":
-      return /* @__PURE__ */ jsx15(AndroidNativeVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ jsx16(AndroidNativeVariant, { state: installState, actions: installState });
     case "android-manual":
-      return /* @__PURE__ */ jsx15(AndroidManualVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ jsx16(AndroidManualVariant, { state: installState, actions: installState });
     case "ios-safari":
-      return /* @__PURE__ */ jsx15(IOSafariVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ jsx16(IOSafariVariant, { state: installState, actions: installState });
     case "ios-other":
-      return /* @__PURE__ */ jsx15(IOSOtherVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ jsx16(IOSOtherVariant, { state: installState, actions: installState });
     case "in-app":
-      return /* @__PURE__ */ jsx15(InAppBrowserVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ jsx16(InAppBrowserVariant, { state: installState, actions: installState });
     case "none":
     default:
-      return /* @__PURE__ */ jsx15(Fragment4, { children });
+      return /* @__PURE__ */ jsx16(Fragment4, { children });
   }
 }
 
 // src/defaults/ErrorBoundary.tsx
 import { Component } from "react";
-import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
 var ErrorBoundary = class extends Component {
   state = { error: null };
   static getDerivedStateFromError(error) {
@@ -1393,17 +1435,17 @@ var ErrorBoundary = class extends Component {
   }
   render() {
     if (this.state.error) {
-      return this.props.fallback ?? /* @__PURE__ */ jsxs10("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx16("h2", { children: "Algo deu errado" }),
-        /* @__PURE__ */ jsx16("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
+      return this.props.fallback ?? /* @__PURE__ */ jsxs11("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
+        /* @__PURE__ */ jsx17("h2", { children: "Algo deu errado" }),
+        /* @__PURE__ */ jsx17("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
       ] });
     }
-    return /* @__PURE__ */ jsx16(Fragment5, { children: this.props.children });
+    return /* @__PURE__ */ jsx17(Fragment5, { children: this.props.children });
   }
 };
 
 // src/hooks/useLoginForm.ts
-import { useCallback as useCallback3, useMemo as useMemo2, useState as useState6 } from "react";
+import { useCallback as useCallback3, useMemo as useMemo2, useState as useState5 } from "react";
 import { useHook as useHook4 } from "@hook-sdk/sdk";
 
 // src/errors.ts
@@ -1440,10 +1482,10 @@ var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD = 8;
 function useLoginForm() {
   const { auth } = useHook4();
-  const [email, setEmail] = useState6("");
-  const [password, setPassword] = useState6("");
-  const [submitting, setSubmitting] = useState6(false);
-  const [error, setError] = useState6(null);
+  const [email, setEmail] = useState5("");
+  const [password, setPassword] = useState5("");
+  const [submitting, setSubmitting] = useState5(false);
+  const [error, setError] = useState5(null);
   const emailError = useMemo2(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE.test(email)) return "Formato de e-mail inv\xE1lido.";
@@ -1485,13 +1527,13 @@ function useLoginForm() {
 }
 
 // src/internal/GoogleSignInButton.tsx
-import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
 function GoogleSignInButton({
   onClick,
   testId = "oauth-google",
   label = "Continuar com Google"
 }) {
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "button",
     {
       "data-testid": testId,
@@ -1514,36 +1556,36 @@ function GoogleSignInButton({
         fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
       },
       children: [
-        /* @__PURE__ */ jsx17(GoogleGlyph, {}),
+        /* @__PURE__ */ jsx18(GoogleGlyph, {}),
         label
       ]
     }
   );
 }
 function GoogleGlyph() {
-  return /* @__PURE__ */ jsxs11("svg", { width: "18", height: "18", viewBox: "0 0 18 18", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsxs12("svg", { width: "18", height: "18", viewBox: "0 0 18 18", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx18(
       "path",
       {
         d: "M17.64 9.2c0-.637-.057-1.251-.164-1.84H9v3.481h4.844a4.14 4.14 0 0 1-1.796 2.716v2.259h2.908c1.702-1.567 2.684-3.874 2.684-6.615z",
         fill: "#4285F4"
       }
     ),
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx18(
       "path",
       {
         d: "M9 18c2.43 0 4.467-.806 5.956-2.18l-2.908-2.259c-.806.54-1.837.86-3.048.86-2.344 0-4.328-1.584-5.036-3.711H.957v2.332A8.997 8.997 0 0 0 9 18z",
         fill: "#34A853"
       }
     ),
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx18(
       "path",
       {
         d: "M3.964 10.71A5.41 5.41 0 0 1 3.682 9c0-.593.102-1.17.282-1.71V4.958H.957A8.996 8.996 0 0 0 0 9c0 1.452.348 2.827.957 4.042l3.007-2.332z",
         fill: "#FBBC05"
       }
     ),
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx18(
       "path",
       {
         d: "M9 3.58c1.321 0 2.508.454 3.44 1.345l2.582-2.58C13.463.891 11.426 0 9 0A8.997 8.997 0 0 0 .957 4.958L3.964 7.29C4.672 5.163 6.656 3.58 9 3.58z",
@@ -1554,8 +1596,8 @@ function GoogleGlyph() {
 }
 
 // src/internal/OAuthErrorBanner.tsx
-import { useEffect as useEffect5, useState as useState7 } from "react";
-import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useEffect as useEffect5, useState as useState6 } from "react";
+import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
 var ERROR_MESSAGES = {
   invalid_state: "Sess\xE3o expirou, tente de novo.",
   access_denied: "Voc\xEA cancelou o login com Google.",
@@ -1575,13 +1617,13 @@ function stripErrorFromUrl() {
   window.history.replaceState({}, "", url.toString());
 }
 function OAuthErrorBanner() {
-  const [code, setCode] = useState7(() => readErrorCode());
+  const [code, setCode] = useState6(() => readErrorCode());
   useEffect5(() => {
     if (code !== null) stripErrorFromUrl();
   }, [code]);
   if (!code) return null;
   const message = ERROR_MESSAGES[code] ?? "N\xE3o conseguimos conectar ao Google. Tente de novo.";
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "div",
     {
       role: "alert",
@@ -1596,7 +1638,7 @@ function OAuthErrorBanner() {
       },
       children: [
         message,
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx19(
           "button",
           {
             type: "button",
@@ -1621,16 +1663,16 @@ function OAuthErrorBanner() {
 }
 
 // src/defaults/DefaultLoginScreen.tsx
-import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
 function DefaultLoginScreen({ onNavigate }) {
   const { name } = useTemplateConfig();
   const f = useLoginForm();
-  return /* @__PURE__ */ jsxs13("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
-    /* @__PURE__ */ jsx19("h1", { style: { marginBottom: 8 }, children: name }),
-    /* @__PURE__ */ jsx19("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Entre na sua conta" }),
-    /* @__PURE__ */ jsx19(OAuthErrorBanner, {}),
-    /* @__PURE__ */ jsx19(GoogleSignInButton, { onClick: f.loginWithGoogle, testId: "login-oauth-google" }),
-    /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsx20("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ jsx20("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Entre na sua conta" }),
+    /* @__PURE__ */ jsx20(OAuthErrorBanner, {}),
+    /* @__PURE__ */ jsx20(GoogleSignInButton, { onClick: f.loginWithGoogle, testId: "login-oauth-google" }),
+    /* @__PURE__ */ jsxs14(
       "div",
       {
         "aria-hidden": "true",
@@ -1643,19 +1685,19 @@ function DefaultLoginScreen({ onNavigate }) {
           fontSize: 12
         },
         children: [
-          /* @__PURE__ */ jsx19("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } }),
+          /* @__PURE__ */ jsx20("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } }),
           "ou",
-          /* @__PURE__ */ jsx19("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } })
+          /* @__PURE__ */ jsx20("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs13("form", { onSubmit: (e) => {
+    /* @__PURE__ */ jsxs14("form", { onSubmit: (e) => {
       e.preventDefault();
       void f.submit();
     }, children: [
-      /* @__PURE__ */ jsxs13("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs14("label", { style: { display: "block", marginBottom: 12 }, children: [
         "E-mail",
-        /* @__PURE__ */ jsx19(
+        /* @__PURE__ */ jsx20(
           "input",
           {
             "data-testid": "login-email",
@@ -1665,11 +1707,11 @@ function DefaultLoginScreen({ onNavigate }) {
             style: { display: "block", width: "100%" }
           }
         ),
-        f.emailError && /* @__PURE__ */ jsx19("small", { style: { color: "#c00" }, children: f.emailError })
+        f.emailError && /* @__PURE__ */ jsx20("small", { style: { color: "#c00" }, children: f.emailError })
       ] }),
-      /* @__PURE__ */ jsxs13("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs14("label", { style: { display: "block", marginBottom: 12 }, children: [
         "Senha",
-        /* @__PURE__ */ jsx19(
+        /* @__PURE__ */ jsx20(
           "input",
           {
             "data-testid": "login-password",
@@ -1679,10 +1721,10 @@ function DefaultLoginScreen({ onNavigate }) {
             style: { display: "block", width: "100%" }
           }
         ),
-        f.passwordError && /* @__PURE__ */ jsx19("small", { style: { color: "#c00" }, children: f.passwordError })
+        f.passwordError && /* @__PURE__ */ jsx20("small", { style: { color: "#c00" }, children: f.passwordError })
       ] }),
-      f.error && /* @__PURE__ */ jsx19("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
-      /* @__PURE__ */ jsx19(
+      f.error && /* @__PURE__ */ jsx20("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ jsx20(
         "button",
         {
           "data-testid": "login-submit",
@@ -1701,25 +1743,25 @@ function DefaultLoginScreen({ onNavigate }) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs13("div", { style: { marginTop: 16, display: "flex", justifyContent: "space-between" }, children: [
-      /* @__PURE__ */ jsx19("button", { "data-testid": "login-goto-signup", type: "button", onClick: () => onNavigate("signup"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Criar conta" }),
-      /* @__PURE__ */ jsx19("button", { "data-testid": "login-goto-forgot", type: "button", onClick: () => onNavigate("forgot"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Esqueci senha" })
+    /* @__PURE__ */ jsxs14("div", { style: { marginTop: 16, display: "flex", justifyContent: "space-between" }, children: [
+      /* @__PURE__ */ jsx20("button", { "data-testid": "login-goto-signup", type: "button", onClick: () => onNavigate("signup"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Criar conta" }),
+      /* @__PURE__ */ jsx20("button", { "data-testid": "login-goto-forgot", type: "button", onClick: () => onNavigate("forgot"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Esqueci senha" })
     ] })
   ] });
 }
 
 // src/hooks/useSignupForm.ts
-import { useCallback as useCallback4, useMemo as useMemo3, useState as useState8 } from "react";
+import { useCallback as useCallback4, useMemo as useMemo3, useState as useState7 } from "react";
 import { useHook as useHook5 } from "@hook-sdk/sdk";
 var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD2 = 8;
 function useSignupForm() {
   const { auth } = useHook5();
-  const [name, setName] = useState8("");
-  const [email, setEmail] = useState8("");
-  const [password, setPassword] = useState8("");
-  const [submitting, setSubmitting] = useState8(false);
-  const [error, setError] = useState8(null);
+  const [name, setName] = useState7("");
+  const [email, setEmail] = useState7("");
+  const [password, setPassword] = useState7("");
+  const [submitting, setSubmitting] = useState7(false);
+  const [error, setError] = useState7(null);
   const nameError = useMemo3(() => {
     if (name.length === 0) return null;
     if (name.trim().length < 2) return "Nome muito curto.";
@@ -1769,16 +1811,16 @@ function useSignupForm() {
 }
 
 // src/defaults/DefaultSignupScreen.tsx
-import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
 function DefaultSignupScreen({ onNavigate }) {
   const { name } = useTemplateConfig();
   const f = useSignupForm();
-  return /* @__PURE__ */ jsxs14("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
-    /* @__PURE__ */ jsx20("h1", { style: { marginBottom: 8 }, children: name }),
-    /* @__PURE__ */ jsx20("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Criar sua conta" }),
-    /* @__PURE__ */ jsx20(OAuthErrorBanner, {}),
-    /* @__PURE__ */ jsx20(GoogleSignInButton, { onClick: f.loginWithGoogle, testId: "signup-oauth-google" }),
-    /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsx21("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ jsx21("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Criar sua conta" }),
+    /* @__PURE__ */ jsx21(OAuthErrorBanner, {}),
+    /* @__PURE__ */ jsx21(GoogleSignInButton, { onClick: f.loginWithGoogle, testId: "signup-oauth-google" }),
+    /* @__PURE__ */ jsxs15(
       "div",
       {
         "aria-hidden": "true",
@@ -1791,48 +1833,48 @@ function DefaultSignupScreen({ onNavigate }) {
           fontSize: 12
         },
         children: [
-          /* @__PURE__ */ jsx20("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } }),
+          /* @__PURE__ */ jsx21("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } }),
           "ou",
-          /* @__PURE__ */ jsx20("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } })
+          /* @__PURE__ */ jsx21("span", { style: { flex: 1, height: 1, background: "rgba(0,0,0,0.1)" } })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs14("form", { onSubmit: (e) => {
+    /* @__PURE__ */ jsxs15("form", { onSubmit: (e) => {
       e.preventDefault();
       void f.submit();
     }, children: [
-      /* @__PURE__ */ jsxs14("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs15("label", { style: { display: "block", marginBottom: 12 }, children: [
         "Nome",
-        /* @__PURE__ */ jsx20("input", { "data-testid": "signup-name", value: f.name, onChange: (e) => f.setName(e.target.value), style: { display: "block", width: "100%" } }),
-        f.nameError && /* @__PURE__ */ jsx20("small", { style: { color: "#c00" }, children: f.nameError })
+        /* @__PURE__ */ jsx21("input", { "data-testid": "signup-name", value: f.name, onChange: (e) => f.setName(e.target.value), style: { display: "block", width: "100%" } }),
+        f.nameError && /* @__PURE__ */ jsx21("small", { style: { color: "#c00" }, children: f.nameError })
       ] }),
-      /* @__PURE__ */ jsxs14("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs15("label", { style: { display: "block", marginBottom: 12 }, children: [
         "E-mail",
-        /* @__PURE__ */ jsx20("input", { "data-testid": "signup-email", type: "email", value: f.email, onChange: (e) => f.setEmail(e.target.value), style: { display: "block", width: "100%" } }),
-        f.emailError && /* @__PURE__ */ jsx20("small", { style: { color: "#c00" }, children: f.emailError })
+        /* @__PURE__ */ jsx21("input", { "data-testid": "signup-email", type: "email", value: f.email, onChange: (e) => f.setEmail(e.target.value), style: { display: "block", width: "100%" } }),
+        f.emailError && /* @__PURE__ */ jsx21("small", { style: { color: "#c00" }, children: f.emailError })
       ] }),
-      /* @__PURE__ */ jsxs14("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs15("label", { style: { display: "block", marginBottom: 12 }, children: [
         "Senha",
-        /* @__PURE__ */ jsx20("input", { "data-testid": "signup-password", type: "password", value: f.password, onChange: (e) => f.setPassword(e.target.value), style: { display: "block", width: "100%" } }),
-        f.passwordError && /* @__PURE__ */ jsx20("small", { style: { color: "#c00" }, children: f.passwordError })
+        /* @__PURE__ */ jsx21("input", { "data-testid": "signup-password", type: "password", value: f.password, onChange: (e) => f.setPassword(e.target.value), style: { display: "block", width: "100%" } }),
+        f.passwordError && /* @__PURE__ */ jsx21("small", { style: { color: "#c00" }, children: f.passwordError })
       ] }),
-      f.error && /* @__PURE__ */ jsx20("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
-      /* @__PURE__ */ jsx20("button", { "data-testid": "signup-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Criando..." : "Criar conta" })
+      f.error && /* @__PURE__ */ jsx21("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ jsx21("button", { "data-testid": "signup-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Criando..." : "Criar conta" })
     ] }),
-    /* @__PURE__ */ jsx20("div", { style: { marginTop: 16 }, children: /* @__PURE__ */ jsx20("button", { "data-testid": "signup-goto-login", type: "button", onClick: () => onNavigate("login"), style: { background: "none", border: "none", cursor: "pointer" }, children: "J\xE1 tem conta? Entre" }) })
+    /* @__PURE__ */ jsx21("div", { style: { marginTop: 16 }, children: /* @__PURE__ */ jsx21("button", { "data-testid": "signup-goto-login", type: "button", onClick: () => onNavigate("login"), style: { background: "none", border: "none", cursor: "pointer" }, children: "J\xE1 tem conta? Entre" }) })
   ] });
 }
 
 // src/hooks/useForgotForm.ts
-import { useCallback as useCallback5, useMemo as useMemo4, useState as useState9 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo4, useState as useState8 } from "react";
 import { useHook as useHook6 } from "@hook-sdk/sdk";
 var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 function useForgotForm() {
   const { auth } = useHook6();
-  const [email, setEmail] = useState9("");
-  const [submitting, setSubmitting] = useState9(false);
-  const [sent, setSent] = useState9(false);
-  const [error, setError] = useState9(null);
+  const [email, setEmail] = useState8("");
+  const [submitting, setSubmitting] = useState8(false);
+  const [sent, setSent] = useState8(false);
+  const [error, setError] = useState8(null);
   const emailError = useMemo4(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE3.test(email)) return "Formato de e-mail inv\xE1lido.";
@@ -1867,48 +1909,48 @@ function useForgotForm() {
 }
 
 // src/defaults/DefaultForgotScreen.tsx
-import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
 function DefaultForgotScreen({ onNavigate }) {
   const { name } = useTemplateConfig();
   const f = useForgotForm();
   if (f.sent) {
-    return /* @__PURE__ */ jsxs15("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
-      /* @__PURE__ */ jsx21("h1", { children: "Verifique seu e-mail" }),
-      /* @__PURE__ */ jsx21("p", { style: { opacity: 0.7 }, children: "Enviamos um link pra redefinir sua senha." }),
-      /* @__PURE__ */ jsx21("button", { "data-testid": "forgot-back-login", type: "button", onClick: () => onNavigate("login"), children: "Voltar pro login" })
+    return /* @__PURE__ */ jsxs16("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx22("h1", { children: "Verifique seu e-mail" }),
+      /* @__PURE__ */ jsx22("p", { style: { opacity: 0.7 }, children: "Enviamos um link pra redefinir sua senha." }),
+      /* @__PURE__ */ jsx22("button", { "data-testid": "forgot-back-login", type: "button", onClick: () => onNavigate("login"), children: "Voltar pro login" })
     ] });
   }
-  return /* @__PURE__ */ jsxs15("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
-    /* @__PURE__ */ jsx21("h1", { style: { marginBottom: 8 }, children: name }),
-    /* @__PURE__ */ jsx21("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Redefinir senha" }),
-    /* @__PURE__ */ jsxs15("form", { onSubmit: (e) => {
+  return /* @__PURE__ */ jsxs16("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsx22("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ jsx22("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Redefinir senha" }),
+    /* @__PURE__ */ jsxs16("form", { onSubmit: (e) => {
       e.preventDefault();
       void f.submit();
     }, children: [
-      /* @__PURE__ */ jsxs15("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs16("label", { style: { display: "block", marginBottom: 12 }, children: [
         "E-mail",
-        /* @__PURE__ */ jsx21("input", { "data-testid": "forgot-email", type: "email", value: f.email, onChange: (e) => f.setEmail(e.target.value), style: { display: "block", width: "100%" } }),
-        f.emailError && /* @__PURE__ */ jsx21("small", { style: { color: "#c00" }, children: f.emailError })
+        /* @__PURE__ */ jsx22("input", { "data-testid": "forgot-email", type: "email", value: f.email, onChange: (e) => f.setEmail(e.target.value), style: { display: "block", width: "100%" } }),
+        f.emailError && /* @__PURE__ */ jsx22("small", { style: { color: "#c00" }, children: f.emailError })
       ] }),
-      f.error && /* @__PURE__ */ jsx21("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
-      /* @__PURE__ */ jsx21("button", { "data-testid": "forgot-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Enviando..." : "Enviar link" })
+      f.error && /* @__PURE__ */ jsx22("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ jsx22("button", { "data-testid": "forgot-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Enviando..." : "Enviar link" })
     ] }),
-    /* @__PURE__ */ jsx21("div", { style: { marginTop: 16 }, children: /* @__PURE__ */ jsx21("button", { "data-testid": "forgot-goto-login", type: "button", onClick: () => onNavigate("login"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Voltar pro login" }) })
+    /* @__PURE__ */ jsx22("div", { style: { marginTop: 16 }, children: /* @__PURE__ */ jsx22("button", { "data-testid": "forgot-goto-login", type: "button", onClick: () => onNavigate("login"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Voltar pro login" }) })
   ] });
 }
 
 // src/hooks/useResetForm.ts
-import { useCallback as useCallback6, useEffect as useEffect6, useMemo as useMemo5, useState as useState10 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect6, useMemo as useMemo5, useState as useState9 } from "react";
 import { useHook as useHook7 } from "@hook-sdk/sdk";
 var MIN_PASSWORD3 = 12;
 function useResetForm() {
   const { auth } = useHook7();
-  const [token, setToken] = useState10(null);
-  const [password, setPassword] = useState10("");
-  const [confirm, setConfirm] = useState10("");
-  const [submitting, setSubmitting] = useState10(false);
-  const [done, setDone] = useState10(false);
-  const [error, setError] = useState10(null);
+  const [token, setToken] = useState9(null);
+  const [password, setPassword] = useState9("");
+  const [confirm, setConfirm] = useState9("");
+  const [submitting, setSubmitting] = useState9(false);
+  const [done, setDone] = useState9(false);
+  const [error, setError] = useState9(null);
   useEffect6(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
@@ -1962,67 +2004,67 @@ function useResetForm() {
 }
 
 // src/defaults/DefaultResetScreen.tsx
-import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
 function DefaultResetScreen({ onNavigate }) {
   const { name } = useTemplateConfig();
   const f = useResetForm();
   if (f.done) {
-    return /* @__PURE__ */ jsxs16("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
-      /* @__PURE__ */ jsx22("h1", { children: "Senha alterada" }),
-      /* @__PURE__ */ jsx22("p", { style: { opacity: 0.7 }, children: "Agora \xE9 s\xF3 fazer login com a nova senha." }),
-      /* @__PURE__ */ jsx22("button", { "data-testid": "reset-back-login", type: "button", onClick: () => onNavigate("login"), children: "Ir pro login" })
+    return /* @__PURE__ */ jsxs17("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx23("h1", { children: "Senha alterada" }),
+      /* @__PURE__ */ jsx23("p", { style: { opacity: 0.7 }, children: "Agora \xE9 s\xF3 fazer login com a nova senha." }),
+      /* @__PURE__ */ jsx23("button", { "data-testid": "reset-back-login", type: "button", onClick: () => onNavigate("login"), children: "Ir pro login" })
     ] });
   }
   if (f.token === null) {
-    return /* @__PURE__ */ jsxs16("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
-      /* @__PURE__ */ jsx22("h1", { children: "Link inv\xE1lido" }),
-      /* @__PURE__ */ jsx22("p", { style: { opacity: 0.7 }, children: "Pe\xE7a um novo link de reset." }),
-      /* @__PURE__ */ jsx22("button", { "data-testid": "reset-goto-forgot", type: "button", onClick: () => onNavigate("forgot"), children: "Pedir novo link" })
+    return /* @__PURE__ */ jsxs17("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx23("h1", { children: "Link inv\xE1lido" }),
+      /* @__PURE__ */ jsx23("p", { style: { opacity: 0.7 }, children: "Pe\xE7a um novo link de reset." }),
+      /* @__PURE__ */ jsx23("button", { "data-testid": "reset-goto-forgot", type: "button", onClick: () => onNavigate("forgot"), children: "Pedir novo link" })
     ] });
   }
-  return /* @__PURE__ */ jsxs16("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
-    /* @__PURE__ */ jsx22("h1", { style: { marginBottom: 8 }, children: name }),
-    /* @__PURE__ */ jsx22("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Escolha uma nova senha" }),
-    /* @__PURE__ */ jsxs16("form", { onSubmit: (e) => {
+  return /* @__PURE__ */ jsxs17("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsx23("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ jsx23("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Escolha uma nova senha" }),
+    /* @__PURE__ */ jsxs17("form", { onSubmit: (e) => {
       e.preventDefault();
       void f.submit();
     }, children: [
-      /* @__PURE__ */ jsxs16("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs17("label", { style: { display: "block", marginBottom: 12 }, children: [
         "Nova senha",
-        /* @__PURE__ */ jsx22("input", { "data-testid": "reset-password", type: "password", value: f.password, onChange: (e) => f.setPassword(e.target.value), style: { display: "block", width: "100%" }, autoComplete: "new-password" }),
-        f.passwordError && /* @__PURE__ */ jsx22("small", { style: { color: "#c00" }, children: f.passwordError })
+        /* @__PURE__ */ jsx23("input", { "data-testid": "reset-password", type: "password", value: f.password, onChange: (e) => f.setPassword(e.target.value), style: { display: "block", width: "100%" }, autoComplete: "new-password" }),
+        f.passwordError && /* @__PURE__ */ jsx23("small", { style: { color: "#c00" }, children: f.passwordError })
       ] }),
-      /* @__PURE__ */ jsxs16("label", { style: { display: "block", marginBottom: 12 }, children: [
+      /* @__PURE__ */ jsxs17("label", { style: { display: "block", marginBottom: 12 }, children: [
         "Confirmar senha",
-        /* @__PURE__ */ jsx22("input", { "data-testid": "reset-confirm", type: "password", value: f.confirm, onChange: (e) => f.setConfirm(e.target.value), style: { display: "block", width: "100%" }, autoComplete: "new-password" }),
-        f.confirmError && /* @__PURE__ */ jsx22("small", { style: { color: "#c00" }, children: f.confirmError })
+        /* @__PURE__ */ jsx23("input", { "data-testid": "reset-confirm", type: "password", value: f.confirm, onChange: (e) => f.setConfirm(e.target.value), style: { display: "block", width: "100%" }, autoComplete: "new-password" }),
+        f.confirmError && /* @__PURE__ */ jsx23("small", { style: { color: "#c00" }, children: f.confirmError })
       ] }),
-      f.error && /* @__PURE__ */ jsx22("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
-      /* @__PURE__ */ jsx22("button", { "data-testid": "reset-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Alterando..." : "Alterar senha" })
+      f.error && /* @__PURE__ */ jsx23("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ jsx23("button", { "data-testid": "reset-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Alterando..." : "Alterar senha" })
     ] })
   ] });
 }
 
 // src/defaults/DefaultPaywall.tsx
-import { useState as useState11 } from "react";
-import { jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
+import { useState as useState10 } from "react";
+import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 function DefaultPaywall() {
   const config = useTemplateConfig();
   const { checkout, opening, error } = usePaywallState();
   const p = config.subscription.paywall_config;
-  const [cpf, setCpf] = useState11("");
+  const [cpf, setCpf] = useState10("");
   const cpfDigits = cpf.replace(/\D/g, "");
   const canCheckout = cpfDigits.length === 11 && !opening;
-  return /* @__PURE__ */ jsxs17("main", { style: { padding: 24, maxWidth: 440, margin: "0 auto", textAlign: "center" }, children: [
-    /* @__PURE__ */ jsx23("h1", { style: { marginBottom: 8 }, children: p.title }),
-    p.subtitle && /* @__PURE__ */ jsx23("p", { style: { opacity: 0.7, marginBottom: 24 }, children: p.subtitle }),
-    /* @__PURE__ */ jsx23("ul", { style: { listStyle: "none", padding: 0, textAlign: "left", marginBottom: 24 }, children: p.benefits.map((b) => /* @__PURE__ */ jsxs17("li", { style: { padding: "8px 0", display: "flex", alignItems: "center" }, children: [
-      /* @__PURE__ */ jsx23("span", { "aria-hidden": true, style: { marginRight: 8 }, children: "\u2713" }),
-      /* @__PURE__ */ jsx23("span", { children: b })
+  return /* @__PURE__ */ jsxs18("main", { style: { padding: 24, maxWidth: 440, margin: "0 auto", textAlign: "center" }, children: [
+    /* @__PURE__ */ jsx24("h1", { style: { marginBottom: 8 }, children: p.title }),
+    p.subtitle && /* @__PURE__ */ jsx24("p", { style: { opacity: 0.7, marginBottom: 24 }, children: p.subtitle }),
+    /* @__PURE__ */ jsx24("ul", { style: { listStyle: "none", padding: 0, textAlign: "left", marginBottom: 24 }, children: p.benefits.map((b) => /* @__PURE__ */ jsxs18("li", { style: { padding: "8px 0", display: "flex", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsx24("span", { "aria-hidden": true, style: { marginRight: 8 }, children: "\u2713" }),
+      /* @__PURE__ */ jsx24("span", { children: b })
     ] }, b)) }),
-    /* @__PURE__ */ jsxs17("div", { style: { textAlign: "left", marginBottom: 16 }, children: [
-      /* @__PURE__ */ jsx23("label", { style: { display: "block", fontSize: 14, opacity: 0.7, marginBottom: 4 }, children: "Seu CPF (pra emiss\xE3o de recibo)" }),
-      /* @__PURE__ */ jsx23(
+    /* @__PURE__ */ jsxs18("div", { style: { textAlign: "left", marginBottom: 16 }, children: [
+      /* @__PURE__ */ jsx24("label", { style: { display: "block", fontSize: 14, opacity: 0.7, marginBottom: 4 }, children: "Seu CPF (pra emiss\xE3o de recibo)" }),
+      /* @__PURE__ */ jsx24(
         "input",
         {
           "data-testid": "paywall-cpf",
@@ -2035,8 +2077,8 @@ function DefaultPaywall() {
         }
       )
     ] }),
-    error && /* @__PURE__ */ jsx23("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: error.message }),
-    /* @__PURE__ */ jsx23(
+    error && /* @__PURE__ */ jsx24("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: error.message }),
+    /* @__PURE__ */ jsx24(
       "button",
       {
         "data-testid": "paywall-cta",
@@ -2057,20 +2099,20 @@ function DefaultPaywall() {
         children: opening ? "Abrindo..." : p.cta
       }
     ),
-    p.priceHint && /* @__PURE__ */ jsx23("p", { style: { opacity: 0.6, marginTop: 12 }, children: p.priceHint }),
-    p.footerNote && /* @__PURE__ */ jsx23("p", { style: { opacity: 0.5, marginTop: 16, fontSize: 12 }, children: p.footerNote })
+    p.priceHint && /* @__PURE__ */ jsx24("p", { style: { opacity: 0.6, marginTop: 12 }, children: p.priceHint }),
+    p.footerNote && /* @__PURE__ */ jsx24("p", { style: { opacity: 0.5, marginTop: 16, fontSize: 12 }, children: p.footerNote })
   ] });
 }
 
 // src/AppRoot.tsx
-import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
 var BACKOFF_MS = [2e3, 5e3, 1e4, 2e4, 4e4];
 function PaymentReturnHandler({ children }) {
   const { subscription } = useHook8();
   const subRef = useRef2(subscription);
   subRef.current = subscription;
   const runIdRef = useRef2(0);
-  const [state, setState] = useState12("idle");
+  const [state, setState] = useState11("idle");
   const runPoll = useCallback7(() => {
     const runId = ++runIdRef.current;
     setState("confirming");
@@ -2110,7 +2152,7 @@ function PaymentReturnHandler({ children }) {
     };
   }, [runPoll]);
   if (state === "confirming") {
-    return /* @__PURE__ */ jsx24(
+    return /* @__PURE__ */ jsx25(
       "div",
       {
         role: "status",
@@ -2121,9 +2163,9 @@ function PaymentReturnHandler({ children }) {
     );
   }
   if (state === "waiting") {
-    return /* @__PURE__ */ jsx24("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ jsxs18("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
-      /* @__PURE__ */ jsx24("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
-      /* @__PURE__ */ jsx24(
+    return /* @__PURE__ */ jsx25("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ jsxs19("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ jsx25("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
+      /* @__PURE__ */ jsx25(
         "button",
         {
           type: "button",
@@ -2134,7 +2176,7 @@ function PaymentReturnHandler({ children }) {
       )
     ] }) });
   }
-  return /* @__PURE__ */ jsx24(Fragment6, { children });
+  return /* @__PURE__ */ jsx25(Fragment6, { children });
 }
 var overlayStyle2 = {
   position: "fixed",
@@ -2167,14 +2209,14 @@ function AppRoot({
   Reset = DefaultResetScreen,
   Paywall = DefaultPaywall
 }) {
-  return /* @__PURE__ */ jsx24(PaymentReturnHandler, { children: /* @__PURE__ */ jsx24(TemplateConfigProvider, { config, children: /* @__PURE__ */ jsx24(ErrorBoundary, { children: /* @__PURE__ */ jsx24(ThemeProvider, { children: /* @__PURE__ */ jsx24(InstallGate, { children: /* @__PURE__ */ jsx24(AuthGate, { Login, Signup, Forgot, Reset, children: /* @__PURE__ */ jsx24(PersistedKeysPrefetch, { children: /* @__PURE__ */ jsxs18(SubscriptionGate, { Paywall, children: [
+  return /* @__PURE__ */ jsx25(PaymentReturnHandler, { children: /* @__PURE__ */ jsx25(TemplateConfigProvider, { config, children: /* @__PURE__ */ jsx25(ErrorBoundary, { children: /* @__PURE__ */ jsx25(ThemeProvider, { children: /* @__PURE__ */ jsx25(InstallGate, { children: /* @__PURE__ */ jsx25(AuthGate, { Login, Signup, Forgot, Reset, children: /* @__PURE__ */ jsx25(PersistedKeysPrefetch, { children: /* @__PURE__ */ jsxs19(SubscriptionGate, { Paywall, children: [
     children,
-    /* @__PURE__ */ jsx24(PushPrompt, {})
+    /* @__PURE__ */ jsx25(PushPrompt, {})
   ] }) }) }) }) }) }) }) });
 }
 
 // src/hooks/usePush.ts
-import { useCallback as useCallback8, useEffect as useEffect8, useState as useState13 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect8, useState as useState12 } from "react";
 import { useHook as useHook9 } from "@hook-sdk/sdk";
 function detectIosNeedsInstall() {
   if (typeof navigator === "undefined" || typeof window === "undefined") return false;
@@ -2202,7 +2244,7 @@ function deriveState(push) {
 }
 function usePush() {
   const { push } = useHook9();
-  const [state, setState] = useState13(() => deriveState(push));
+  const [state, setState] = useState12(() => deriveState(push));
   useEffect8(() => {
     setState(deriveState(push));
   }, [push]);
@@ -2231,31 +2273,31 @@ function usePush() {
 }
 
 // src/components/PushPrompt.tsx
-import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
 function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, className }) {
   const { state, subscribe } = usePush();
   if (state.kind === "subscribed") return null;
   if (state.kind === "ios_needs_install") {
-    return /* @__PURE__ */ jsxs19("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
-      /* @__PURE__ */ jsx25("h3", { children: texts.iosInstallTitle }),
-      /* @__PURE__ */ jsx25("p", { children: texts.iosInstallBody }),
-      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ jsx25("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
+    return /* @__PURE__ */ jsxs20("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
+      /* @__PURE__ */ jsx26("h3", { children: texts.iosInstallTitle }),
+      /* @__PURE__ */ jsx26("p", { children: texts.iosInstallBody }),
+      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ jsx26("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
     ] });
   }
   if (state.kind === "denied") {
-    return /* @__PURE__ */ jsxs19("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
-      /* @__PURE__ */ jsx25("h3", { children: texts.deniedTitle }),
-      /* @__PURE__ */ jsx25("p", { children: texts.deniedBody })
+    return /* @__PURE__ */ jsxs20("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
+      /* @__PURE__ */ jsx26("h3", { children: texts.deniedTitle }),
+      /* @__PURE__ */ jsx26("p", { children: texts.deniedBody })
     ] });
   }
   if (state.kind === "unsupported") {
-    return /* @__PURE__ */ jsx25("div", { className, role: "region", children: /* @__PURE__ */ jsx25("p", { children: texts.unsupportedBody }) });
+    return /* @__PURE__ */ jsx26("div", { className, role: "region", children: /* @__PURE__ */ jsx26("p", { children: texts.unsupportedBody }) });
   }
   if (state.kind === "error") {
-    return /* @__PURE__ */ jsx25("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ jsx25("p", { children: state.message }) });
+    return /* @__PURE__ */ jsx26("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ jsx26("p", { children: state.message }) });
   }
-  return /* @__PURE__ */ jsxs19("div", { className, role: "region", children: [
-    /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsxs20("div", { className, role: "region", children: [
+    /* @__PURE__ */ jsx26(
       "button",
       {
         type: "button",
@@ -2269,17 +2311,17 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
         children: texts.cta
       }
     ),
-    onDeclined && /* @__PURE__ */ jsx25("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
+    onDeclined && /* @__PURE__ */ jsx26("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
   ] });
 }
 
 // src/defaults/EmptyState.tsx
-import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
 function EmptyState({ title, description, action }) {
-  return /* @__PURE__ */ jsxs20("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
-    /* @__PURE__ */ jsx26("h2", { style: { marginBottom: 8 }, children: title }),
-    description && /* @__PURE__ */ jsx26("p", { style: { opacity: 0.7 }, children: description }),
-    action && /* @__PURE__ */ jsx26("div", { style: { marginTop: 16 }, children: action })
+  return /* @__PURE__ */ jsxs21("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
+    /* @__PURE__ */ jsx27("h2", { style: { marginBottom: 8 }, children: title }),
+    description && /* @__PURE__ */ jsx27("p", { style: { opacity: 0.7 }, children: description }),
+    action && /* @__PURE__ */ jsx27("div", { style: { marginTop: 16 }, children: action })
   ] });
 }
 
@@ -2320,13 +2362,13 @@ function useSubscription() {
 }
 
 // src/hooks/useReminders.ts
-import { useCallback as useCallback9, useEffect as useEffect10, useState as useState14 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect10, useState as useState13 } from "react";
 import { useHook as useHook12 } from "@hook-sdk/sdk";
 function useReminders() {
   const { push } = useHook12();
   const r = push.reminders;
-  const [reminders, setReminders] = useState14([]);
-  const [loading, setLoading] = useState14(true);
+  const [reminders, setReminders] = useState13([]);
+  const [loading, setLoading] = useState13(true);
   const reload = useCallback9(async () => {
     setLoading(true);
     try {
@@ -2357,9 +2399,9 @@ function useReminders() {
 }
 
 // src/hooks/useToast.ts
-import { useCallback as useCallback10, useState as useState15 } from "react";
+import { useCallback as useCallback10, useState as useState14 } from "react";
 function useToast() {
-  const [items, setItems] = useState15([]);
+  const [items, setItems] = useState14([]);
   const show = useCallback10((message, kind = "info") => {
     const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
     setItems((prev) => [...prev, { id, message, kind }]);