@hook-sdk/template 0.1.4 → 0.2.0

package/dist/index.cjs

@@ -29,12 +29,14 @@ __export(index_exports, {
   EmptyState: () => EmptyState,
   ErrorBoundary: () => ErrorBoundary,
   LoadingState: () => LoadingState,
+  PushPrompt: () => PushPrompt2,
   useAuth: () => useAuth,
   useAuthPrimitives: () => useAuthPrimitives,
   useForgotForm: () => useForgotForm,
   useLoginForm: () => useLoginForm,
   usePaywallState: () => usePaywallState,
   usePush: () => usePush,
+  useReminders: () => useReminders,
   useResetForm: () => useResetForm,
   useSignupForm: () => useSignupForm,
   useSubscription: () => useSubscription,
@@ -821,23 +823,123 @@ function AppRoot({
   ] }) }) }) }) }) }) });
 }
 
-// src/defaults/EmptyState.tsx
+// src/hooks/usePush.ts
+var import_react12 = require("react");
+var import_sdk10 = require("@hook-sdk/sdk");
+function detectIosNeedsInstall() {
+  if (typeof navigator === "undefined" || typeof window === "undefined") return false;
+  const ua = navigator.userAgent || "";
+  const isIos = /iPhone|iPad|iPod/.test(ua);
+  if (!isIos) return false;
+  const mm = window.matchMedia?.("(display-mode: standalone)");
+  const standalone = mm?.matches === true;
+  const legacyStandalone = typeof navigator.standalone === "boolean" ? navigator.standalone : false;
+  return !(standalone || legacyStandalone);
+}
+function deriveState(push) {
+  if (!push.isAvailable()) {
+    if (detectIosNeedsInstall()) return { kind: "ios_needs_install" };
+    return { kind: "unsupported" };
+  }
+  const status = push.status();
+  if (status === "granted") return { kind: "subscribed" };
+  if (status === "denied") return { kind: "denied" };
+  if (status === "unsupported") {
+    if (detectIosNeedsInstall()) return { kind: "ios_needs_install" };
+    return { kind: "unsupported" };
+  }
+  return { kind: "prompt" };
+}
+function usePush() {
+  const { push } = (0, import_sdk10.useHook)();
+  const [state, setState] = (0, import_react12.useState)(() => deriveState(push));
+  (0, import_react12.useEffect)(() => {
+    setState(deriveState(push));
+  }, [push]);
+  const subscribe = (0, import_react12.useCallback)(async () => {
+    try {
+      await push.subscribe();
+      setState({ kind: "subscribed" });
+    } catch (e) {
+      const code = e?.code ?? "push.unknown";
+      const message = e?.message ?? "Push subscription failed";
+      if (code === "push.permission_denied") setState({ kind: "denied" });
+      else setState({ kind: "error", code, message });
+      throw e;
+    }
+  }, [push]);
+  const unsubscribe = (0, import_react12.useCallback)(async () => {
+    try {
+      await push.unsubscribe();
+      setState({ kind: "prompt" });
+    } catch (e) {
+      setState({ kind: "error", code: e?.code ?? "push.unknown", message: e?.message ?? "failed" });
+      throw e;
+    }
+  }, [push]);
+  return { state, subscribe, unsubscribe };
+}
+
+// src/components/PushPrompt.tsx
 var import_jsx_runtime14 = require("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__ */ (0, import_jsx_runtime14.jsxs)("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("h3", { children: texts.iosInstallTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { children: texts.iosInstallBody }),
+      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
+    ] });
+  }
+  if (state.kind === "denied") {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("h3", { children: texts.deniedTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { children: texts.deniedBody })
+    ] });
+  }
+  if (state.kind === "unsupported") {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className, role: "region", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { children: texts.unsupportedBody }) });
+  }
+  if (state.kind === "error") {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { children: state.message }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className, role: "region", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick: async () => {
+          try {
+            await subscribe();
+            onSubscribed?.();
+          } catch {
+          }
+        },
+        children: texts.cta
+      }
+    ),
+    onDeclined && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
+  ] });
+}
+
+// src/defaults/EmptyState.tsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function EmptyState({ title, description, action }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { style: { opacity: 0.7 }, children: description }),
-    action && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { marginTop: 16 }, children: action })
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { style: { opacity: 0.7 }, children: description }),
+    action && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { marginTop: 16 }, children: action })
   ] });
 }
 
 // src/hooks/useAuthPrimitives.ts
-var import_react12 = require("react");
-var import_sdk10 = require("@hook-sdk/sdk");
+var import_react13 = require("react");
+var import_sdk11 = require("@hook-sdk/sdk");
 var warned = false;
 function useAuthPrimitives() {
-  const { auth } = (0, import_sdk10.useHook)();
-  (0, import_react12.useEffect)(() => {
+  const { auth } = (0, import_sdk11.useHook)();
+  (0, import_react13.useEffect)(() => {
     if (!warned && process.env.NODE_ENV !== "production") {
       warned = true;
       console.warn(
@@ -859,37 +961,63 @@ function useAuthPrimitives() {
 }
 
 // src/hooks/useSubscription.ts
-var import_sdk11 = require("@hook-sdk/sdk");
+var import_sdk12 = require("@hook-sdk/sdk");
 function useSubscription() {
-  const { subscription } = (0, import_sdk11.useHook)();
+  const { subscription } = (0, import_sdk12.useHook)();
   return {
     status: subscription.status()
   };
 }
 
-// src/hooks/usePush.ts
-var import_sdk12 = require("@hook-sdk/sdk");
-function usePush() {
-  const { push } = (0, import_sdk12.useHook)();
-  return {
-    status: push.status(),
-    subscribe: push.subscribe,
-    unsubscribe: push.unsubscribe
-  };
+// src/hooks/useReminders.ts
+var import_react14 = require("react");
+var import_sdk13 = require("@hook-sdk/sdk");
+function useReminders() {
+  const { push } = (0, import_sdk13.useHook)();
+  const r = push.reminders;
+  const [reminders, setReminders] = (0, import_react14.useState)([]);
+  const [loading, setLoading] = (0, import_react14.useState)(true);
+  const reload = (0, import_react14.useCallback)(async () => {
+    setLoading(true);
+    try {
+      const next = await r.list();
+      setReminders(next);
+    } finally {
+      setLoading(false);
+    }
+  }, [r]);
+  (0, import_react14.useEffect)(() => {
+    void reload();
+  }, [reload]);
+  const setReminder = (0, import_react14.useCallback)(async (input) => {
+    await r.set(input);
+    await reload();
+  }, [r, reload]);
+  const deleteReminder = (0, import_react14.useCallback)(async (slot) => {
+    await r.delete(slot);
+    await reload();
+  }, [r, reload]);
+  const schedule = (0, import_react14.useCallback)(async (items) => {
+    return r.schedule(items);
+  }, [r]);
+  const setFallbacks = (0, import_react14.useCallback)(async (items) => {
+    return r.setFallbacks(items);
+  }, [r]);
+  return { reminders, loading, setReminder, deleteReminder, schedule, setFallbacks };
 }
 
 // src/hooks/useToast.ts
-var import_react13 = require("react");
+var import_react15 = require("react");
 function useToast() {
-  const [items, setItems] = (0, import_react13.useState)([]);
-  const show = (0, import_react13.useCallback)((message, kind = "info") => {
+  const [items, setItems] = (0, import_react15.useState)([]);
+  const show = (0, import_react15.useCallback)((message, kind = "info") => {
     const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
     setItems((prev) => [...prev, { id, message, kind }]);
     setTimeout(() => {
       setItems((prev) => prev.filter((t) => t.id !== id));
     }, 4e3);
   }, []);
-  const dismiss = (0, import_react13.useCallback)((id) => {
+  const dismiss = (0, import_react15.useCallback)((id) => {
     setItems((prev) => prev.filter((t) => t.id !== id));
   }, []);
   return { items, show, dismiss };
@@ -905,12 +1033,14 @@ function useToast() {
   EmptyState,
   ErrorBoundary,
   LoadingState,
+  PushPrompt,
   useAuth,
   useAuthPrimitives,
   useForgotForm,
   useLoginForm,
   usePaywallState,
   usePush,
+  useReminders,
   useResetForm,
   useSignupForm,
   useSubscription,