@mrrocket/sdk 0.0.0-stage → 0.1.0

package/dist/core.js

@@ -0,0 +1,104 @@
+// src/core.ts
+var UTM_KEYS = ["utm_source", "utm_medium", "utm_campaign", "utm_term", "utm_content"];
+var PREVIEW_PARAM = "ck_preview";
+var EMBED_PARAM = "ck_embed";
+var ID_COOKIE = "ck_id";
+var SESSION_COOKIE = "ck_sid";
+var SESSION_TIMEOUT_MS = 30 * 60 * 1e3;
+var readUtm = (search) => {
+  const params = new URLSearchParams(search);
+  const out = {};
+  for (const key of UTM_KEYS) {
+    const value = params.get(key)?.trim();
+    if (value) out[key] = value.slice(0, 150);
+  }
+  return out;
+};
+var hashUnit = (input) => {
+  let h = 2166136261;
+  for (let i = 0; i < input.length; i++) {
+    h ^= input.charCodeAt(i);
+    h = Math.imul(h, 16777619);
+  }
+  return (h >>> 0) / 4294967296;
+};
+var assign = (experiment, distinctId) => {
+  const control = experiment.variants[0]?.id ?? "control";
+  if (experiment.winner) return experiment.winner;
+  if (experiment.status !== "running") return control;
+  const u = hashUnit(`${experiment.key}:${distinctId}`);
+  let acc = 0;
+  for (const v of experiment.variants) {
+    acc += v.weight;
+    if (u < acc) return v.id;
+  }
+  return experiment.variants[experiment.variants.length - 1]?.id ?? control;
+};
+var parsePreview = (value) => {
+  const raw = Array.isArray(value) ? value[0] : value;
+  if (!raw) return {};
+  const out = {};
+  for (const pair of raw.split(",")) {
+    const [key, variant] = pair.split(":");
+    if (key && variant) out[key.trim()] = variant.trim();
+  }
+  return out;
+};
+var previewHref = (url, forced, embed = true) => {
+  const [path, query = ""] = url.split("?");
+  const params = new URLSearchParams(query);
+  const value = Object.entries(forced).map(([k, v]) => `${k}:${v}`).join(",");
+  if (value) params.set(PREVIEW_PARAM, value);
+  if (embed) params.set(EMBED_PARAM, "1");
+  return `${path}?${params.toString()}`;
+};
+var resolveVariant = (key, config, distinctId, preview) => {
+  if (preview[key]) return preview[key];
+  const experiment = config?.experiments.find((e) => e.key === key);
+  return experiment ? assign(experiment, distinctId) : "control";
+};
+var textChanges = (config, distinctId, preview) => {
+  const out = {};
+  for (const experiment of config?.experiments ?? []) {
+    const id = resolveVariant(experiment.key, config, distinctId, preview);
+    if (id === (experiment.variants[0]?.id ?? "control")) continue;
+    Object.assign(out, experiment.variants.find((v) => v.id === id)?.changes ?? {});
+  }
+  return out;
+};
+var envHost = () => {
+  try {
+    return process.env.NEXT_PUBLIC_MRROCKET_HOST || void 0;
+  } catch {
+    return void 0;
+  }
+};
+var envKey = () => {
+  try {
+    return process.env.NEXT_PUBLIC_MRROCKET_KEY || void 0;
+  } catch {
+    return void 0;
+  }
+};
+var resolveHost = (host) => (host ?? envHost() ?? "").trim().replace(/\/+$/, "");
+var newDistinctId = () => typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `ck_${Math.random().toString(36).slice(2)}${Date.now().toString(36)}`;
+export {
+  EMBED_PARAM,
+  ID_COOKIE,
+  PREVIEW_PARAM,
+  SESSION_COOKIE,
+  SESSION_TIMEOUT_MS,
+  UTM_KEYS,
+  assign,
+  envHost,
+  envKey,
+  hashUnit,
+  newDistinctId,
+  parsePreview,
+  previewHref,
+  readUtm,
+  resolveHost,
+  resolveVariant,
+  textChanges
+};
+//# sourceMappingURL=core.js.map

package/dist/core.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core.ts"],"sourcesContent":["/**\n * The part of the SDK that runs anywhere: experiment config, variant assignment, preview links and event shapes.\n * No React, no browser APIs, so the server helper, the proxy helper and the client share it.\n */\n\nexport type VariantId = string;\n\n/** One variant of an experiment. `changes` replaces texts that the page marks with `<Text id>`. */\nexport interface VariantConfig {\n    id: VariantId;\n    /** Share of traffic, 0 to 1. The weights of an experiment add up to 1. */\n    weight: number;\n    changes?: Record<string, string>;\n}\n\nexport interface ExperimentConfig {\n    /** The experiment's key, the same as in Cockpit. */\n    key: string;\n    status: \"running\" | \"draft\" | \"stopped\";\n    /** Control first. */\n    variants: VariantConfig[];\n    /** A winner that shipped: everyone gets it, and nobody is assigned anymore. */\n    winner?: VariantId;\n}\n\nexport interface CockpitConfig {\n    /** The product the public key belongs to. */\n    project: string;\n    experiments: ExperimentConfig[];\n    /** The product's affiliate program: how many days a partner's referral is kept. Missing without a program. */\n    referral?: { cookieDays: number };\n}\n\n/**\n * What the SDK may send and store.\n * - \"cookieless\" (default): no cookie, no localStorage. Events go without a visitor id; the server counts visitors\n *   with a hash of key, date, IP and user agent that changes every day.\n * - \"cookies\": a persistent `ck_id` cookie identifies the visitor across visits, `ck_sid` holds the session.\n * - \"off\": nothing is sent and nothing is stored.\n */\nexport type ConsentMode = \"cookieless\" | \"cookies\" | \"off\";\n\n/** The campaign parameters the SDK reads from the landing URL. */\nexport const UTM_KEYS = [\"utm_source\", \"utm_medium\", \"utm_campaign\", \"utm_term\", \"utm_content\"] as const;\nexport type UtmKey = (typeof UTM_KEYS)[number];\n\n/** One event as it goes over the wire to `POST /api/sdk/events`. */\nexport interface CockpitEvent {\n    event: string;\n    /** The visitor. Missing in \"cookieless\" mode until identify(): the server then uses its daily visitor hash. */\n    distinctId?: string;\n    /** Ends after 30 minutes without an event. */\n    sessionId?: string;\n    props?: Record<string, unknown>;\n    /** Milliseconds since the epoch. */\n    ts: number;\n    url?: string;\n    /** `document.referrer` on the first page of a page load, the previous in-app URL after client-side navigation. */\n    referrer?: string;\n    utm_source?: string;\n    utm_medium?: string;\n    utm_campaign?: string;\n    utm_term?: string;\n    utm_content?: string;\n    /** The screen size in CSS pixels. */\n    screen?: { w: number; h: number };\n}\n\n/** The query parameter that forces variants, for previews in Cockpit: `?ck_preview=pricing-annual:a,home-hero:control`. */\nexport const PREVIEW_PARAM = \"ck_preview\";\n/** Set when Cockpit embeds the page: nothing is tracked, so previews never count as visits. */\nexport const EMBED_PARAM = \"ck_embed\";\n/** The cookie that keeps a visitor in the same variant across visits. Only written in \"cookies\" mode. */\nexport const ID_COOKIE = \"ck_id\";\n/** The cookie that holds the session id in \"cookies\" mode. */\nexport const SESSION_COOKIE = \"ck_sid\";\n/** A session ends after this long without an event. */\nexport const SESSION_TIMEOUT_MS = 30 * 60 * 1000;\n\n/** The UTM parameters of a query string, like `\"?utm_source=x\"`. Empty values are left out. */\nexport const readUtm = (search: string): Partial<Record<UtmKey, string>> => {\n    const params = new URLSearchParams(search);\n    const out: Partial<Record<UtmKey, string>> = {};\n    for (const key of UTM_KEYS) {\n        const value = params.get(key)?.trim();\n        if (value) out[key] = value.slice(0, 150);\n    }\n    return out;\n};\n\n/** FNV-1a, 32 bit, mapped to [0, 1). Stable across server and browser. */\nexport const hashUnit = (input: string) => {\n    let h = 0x811c9dc5;\n    for (let i = 0; i < input.length; i++) {\n        h ^= input.charCodeAt(i);\n        h = Math.imul(h, 0x01000193);\n    }\n    return (h >>> 0) / 4294967296;\n};\n\n/** The variant a visitor sees: a shipped winner, control while the experiment does not run, else a stable bucket by visitor. */\nexport const assign = (experiment: ExperimentConfig, distinctId: string): VariantId => {\n    const control = experiment.variants[0]?.id ?? \"control\";\n    if (experiment.winner) return experiment.winner;\n    if (experiment.status !== \"running\") return control;\n    const u = hashUnit(`${experiment.key}:${distinctId}`);\n    let acc = 0;\n    for (const v of experiment.variants) {\n        acc += v.weight;\n        if (u < acc) return v.id;\n    }\n    return experiment.variants[experiment.variants.length - 1]?.id ?? control;\n};\n\n/** `\"a:b,c:d\"` → `{ a: \"b\", c: \"d\" }`. Ignores anything malformed. */\nexport const parsePreview = (value: string | string[] | null | undefined): Record<string, VariantId> => {\n    const raw = Array.isArray(value) ? value[0] : value;\n    if (!raw) return {};\n    const out: Record<string, VariantId> = {};\n    for (const pair of raw.split(\",\")) {\n        const [key, variant] = pair.split(\":\");\n        if (key && variant) out[key.trim()] = variant.trim();\n    }\n    return out;\n};\n\n/** A link that shows one variant of a page, for example in Cockpit's preview frames. */\nexport const previewHref = (url: string, forced: Record<string, VariantId>, embed = true) => {\n    const [path, query = \"\"] = url.split(\"?\");\n    const params = new URLSearchParams(query);\n    const value = Object.entries(forced)\n        .map(([k, v]) => `${k}:${v}`)\n        .join(\",\");\n    if (value) params.set(PREVIEW_PARAM, value);\n    if (embed) params.set(EMBED_PARAM, \"1\");\n    return `${path}?${params.toString()}`;\n};\n\n/** The variant for one experiment, from a forced preview first, then the config. Unknown experiments get control. */\nexport const resolveVariant = (key: string, config: CockpitConfig | null, distinctId: string, preview: Record<string, VariantId>): VariantId => {\n    if (preview[key]) return preview[key];\n    const experiment = config?.experiments.find((e) => e.key === key);\n    return experiment ? assign(experiment, distinctId) : \"control\";\n};\n\n/**\n * Every text change that applies to this visitor, merged in config order. Control keeps the page's own words,\n * so only a non-control variant (assigned, forced in a preview, or a shipped winner) changes text.\n */\nexport const textChanges = (config: CockpitConfig | null, distinctId: string, preview: Record<string, VariantId>) => {\n    const out: Record<string, string> = {};\n    for (const experiment of config?.experiments ?? []) {\n        const id = resolveVariant(experiment.key, config, distinctId, preview);\n        if (id === (experiment.variants[0]?.id ?? \"control\")) continue;\n        Object.assign(out, experiment.variants.find((v) => v.id === id)?.changes ?? {});\n    }\n    return out;\n};\n\n/**\n * The MRRocket API host from `NEXT_PUBLIC_MRROCKET_HOST`. Written as a literal property access on purpose: Next.js\n * inlines `process.env.NEXT_PUBLIC_*` at build time, in the browser bundle and in the server bundle (also on\n * Cloudflare Workers), and only replaces the literal form. Without a bundler (or a `process`) it is undefined.\n */\nexport const envHost = (): string | undefined => {\n    try {\n        return process.env.NEXT_PUBLIC_MRROCKET_HOST || undefined;\n    } catch {\n        return undefined;\n    }\n};\n\n/** The public key from `NEXT_PUBLIC_MRROCKET_KEY`, the default for the `apiKey` prop. Same literal-access rule as `envHost`. */\nexport const envKey = (): string | undefined => {\n    try {\n        return process.env.NEXT_PUBLIC_MRROCKET_KEY || undefined;\n    } catch {\n        return undefined;\n    }\n};\n\n/**\n * Where the API lives: the `host` prop, else `NEXT_PUBLIC_MRROCKET_HOST`, else \"\" (the page's own origin, which is how\n * MRRocket's own demo pages call it). Without a trailing slash.\n */\nexport const resolveHost = (host?: string) => (host ?? envHost() ?? \"\").trim().replace(/\\/+$/, \"\");\n\n/** A random visitor id. */\nexport const newDistinctId = () =>\n    typeof crypto !== \"undefined\" && \"randomUUID\" in crypto ? crypto.randomUUID() : `ck_${Math.random().toString(36).slice(2)}${Date.now().toString(36)}`;\n"],"mappings":"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","names":[]}

package/dist/feedback.d.ts

@@ -0,0 +1,28 @@
+import { type Theme } from "./ui.js";
+export interface FeedbackBoardProps {
+    /** Heading above the board. */
+    title?: string;
+    /** Line under the heading. */
+    subtitle?: string;
+    theme?: Theme;
+    /** Accent color for buttons and votes. Default #3f76ff. */
+    accent?: string;
+}
+/** The full board for a /feedback page: requests, roadmap and changelog, with voting, comments and a submit form. */
+export declare const FeedbackBoard: ({ title, subtitle, theme, accent }: FeedbackBoardProps) => import("react").JSX.Element;
+/** Open or close the feedback widget from your own button. */
+export declare const useFeedback: () => {
+    open: () => void;
+    close: () => void;
+};
+export interface FeedbackWidgetProps {
+    position?: "bottom-right" | "bottom-left";
+    /** Text on the floating button. */
+    label?: string;
+    /** Where "See all" goes, for example your /feedback page. */
+    boardUrl?: string;
+    theme?: Theme;
+    accent?: string;
+}
+/** A floating button that opens a small popover with the top requests and a quick suggest form. */
+export declare const FeedbackWidget: ({ position, label, boardUrl, theme, accent }: FeedbackWidgetProps) => import("react").JSX.Element;

package/dist/feedback.js

@@ -0,0 +1,459 @@
+"use client";
+
+// src/feedback.tsx
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { useApi } from "./api.js";
+import { Chat, ChevronUp, Cross, Plus, Root, StatusPill, VoteButton, similarPosts, timeAgo, useEscape } from "./ui.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var useFeedbackList = (opts) => {
+  const api = useApi();
+  const [posts, setPosts] = useState([]);
+  const [boards, setBoards] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState("");
+  const [tick, setTick] = useState(0);
+  const { board, sort, q } = opts;
+  useEffect(() => {
+    const ctl = new AbortController();
+    setLoading(true);
+    const wait = window.setTimeout(
+      () => {
+        api.list({ board, sort, q: q?.trim() || void 0 }, ctl.signal).then((r) => {
+          setPosts(r.posts);
+          setBoards(r.boards);
+          setError("");
+          setLoading(false);
+        }).catch((e) => {
+          if (e.name === "AbortError") return;
+          setError(e.message);
+          setLoading(false);
+        });
+      },
+      q ? 250 : 0
+    );
+    return () => {
+      window.clearTimeout(wait);
+      ctl.abort();
+    };
+  }, [api, board, sort, q, tick]);
+  const patch = useCallback((id, fn) => setPosts((all) => all.map((p) => p.id === id ? fn(p) : p)), []);
+  const vote = useCallback(
+    (post) => {
+      const flip = (p) => ({ ...p, voted: !p.voted, votes: p.votes + (p.voted ? -1 : 1) });
+      patch(post.id, flip);
+      api.vote(post.id).then((r) => patch(post.id, (p) => ({ ...p, voted: r.voted, votes: r.votes }))).catch((e) => {
+        patch(post.id, flip);
+        setError(`Your vote was not saved. ${e.message}`);
+      });
+    },
+    [api, patch]
+  );
+  return { api, posts, setPosts, patch, boards, loading, error, setError, vote, reload: () => setTick((t) => t + 1) };
+};
+var SubmitForm = ({
+  api,
+  boards,
+  posts,
+  onCreated,
+  onVote,
+  onCancel,
+  compact
+}) => {
+  const id = useId();
+  const [title, setTitle] = useState("");
+  const [body, setBody] = useState("");
+  const [board, setBoard] = useState("");
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState("");
+  const chosen = board || boards[0]?.id || "";
+  const dupes = similarPosts(title, posts);
+  const submit = async (e) => {
+    e.preventDefault();
+    if (!title.trim() || busy) return;
+    setBusy(true);
+    setError("");
+    try {
+      const created = await api.submit({ title: title.trim(), body: body.trim() || void 0, board: chosen });
+      setTitle("");
+      setBody("");
+      onCreated(created);
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs("form", { className: "ckw-form", onSubmit: submit, children: [
+    /* @__PURE__ */ jsxs("div", { className: "ckw-field", children: [
+      /* @__PURE__ */ jsx("label", { className: "ckw-label", htmlFor: `${id}-t`, children: "Title" }),
+      /* @__PURE__ */ jsx("input", { id: `${id}-t`, className: "ckw-input", value: title, maxLength: 140, required: true, autoFocus: true, onChange: (e) => setTitle(e.target.value), placeholder: "Short, specific summary" })
+    ] }),
+    dupes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ckw-dupes", role: "status", children: [
+      /* @__PURE__ */ jsx("p", { children: "Similar requests. Vote instead of adding a duplicate:" }),
+      dupes.map((d) => /* @__PURE__ */ jsxs("div", { className: "ckw-dupe", children: [
+        /* @__PURE__ */ jsx("span", { title: d.title, children: d.title }),
+        /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-btn", disabled: d.voted, onClick: () => onVote(d), children: d.voted ? "Voted" : "Vote instead" })
+      ] }, d.id))
+    ] }),
+    !compact && /* @__PURE__ */ jsxs("div", { className: "ckw-field", children: [
+      /* @__PURE__ */ jsx("label", { className: "ckw-label", htmlFor: `${id}-b`, children: "Details (optional)" }),
+      /* @__PURE__ */ jsx("textarea", { id: `${id}-b`, className: "ckw-textarea", value: body, maxLength: 2e3, onChange: (e) => setBody(e.target.value), placeholder: "What are you trying to do?" })
+    ] }),
+    boards.length > 1 && /* @__PURE__ */ jsxs("div", { className: "ckw-field", children: [
+      /* @__PURE__ */ jsx("label", { className: "ckw-label", htmlFor: `${id}-c`, children: "Board" }),
+      /* @__PURE__ */ jsx("select", { id: `${id}-c`, className: "ckw-select", value: chosen, onChange: (e) => setBoard(e.target.value), children: boards.map((b) => /* @__PURE__ */ jsx("option", { value: b.id, children: b.label }, b.id)) })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "ckw-error", role: "alert", children: error }),
+    /* @__PURE__ */ jsxs("div", { className: "ckw-actions", children: [
+      onCancel && /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-btn ckw-btn-ghost", onClick: onCancel, children: "Cancel" }),
+      /* @__PURE__ */ jsx("button", { type: "submit", className: "ckw-btn ckw-btn-primary", disabled: busy || !title.trim(), children: busy ? "Sending\u2026" : "Submit request" })
+    ] })
+  ] });
+};
+var PostRow = ({ post, onOpen, onVote }) => /* @__PURE__ */ jsxs("li", { className: "ckw-row", children: [
+  /* @__PURE__ */ jsx(VoteButton, { post, onVote }),
+  /* @__PURE__ */ jsxs("div", { className: "ckw-main", children: [
+    /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-link", onClick: () => onOpen(post), children: post.title }),
+    post.body && /* @__PURE__ */ jsx("p", { className: "ckw-excerpt", children: post.body }),
+    /* @__PURE__ */ jsxs("div", { className: "ckw-meta", children: [
+      /* @__PURE__ */ jsx(StatusPill, { status: post.status }),
+      /* @__PURE__ */ jsxs("span", { className: "ckw-stat", children: [
+        /* @__PURE__ */ jsx(Chat, {}),
+        " ",
+        post.comments
+      ] }),
+      /* @__PURE__ */ jsx("span", { children: timeAgo(post.createdAt) })
+    ] })
+  ] })
+] });
+var Skeleton = () => /* @__PURE__ */ jsx("div", { "aria-hidden": "true", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx("div", { className: "ckw-skel" }, i)) });
+var ErrorBar = ({ message, onRetry, onClose }) => /* @__PURE__ */ jsxs("div", { className: "ckw-error", role: "alert", children: [
+  /* @__PURE__ */ jsx("span", { children: message }),
+  onRetry ? /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-btn", onClick: onRetry, children: "Retry" }) : onClose && /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-btn ckw-btn-ghost", onClick: onClose, "aria-label": "Dismiss", children: /* @__PURE__ */ jsx(Cross, {}) })
+] });
+var PostDetail = ({ post, onBack, onVote }) => {
+  const api = useApi();
+  const id = useId();
+  const [comments, setComments] = useState(null);
+  const [error, setError] = useState("");
+  const [text, setText] = useState("");
+  const [busy, setBusy] = useState(false);
+  const [added, setAdded] = useState(0);
+  useEffect(() => {
+    const ctl = new AbortController();
+    api.comments(post.id, ctl.signal).then((r) => setComments(r.comments)).catch((e) => e.name !== "AbortError" && setError(e.message));
+    return () => ctl.abort();
+  }, [api, post.id]);
+  const send = async (e) => {
+    e.preventDefault();
+    const body = text.trim();
+    if (!body || busy) return;
+    setBusy(true);
+    setError("");
+    const temp = { id: `tmp-${Date.now()}`, body, author: "You", isTeam: false, postedAt: (/* @__PURE__ */ new Date()).toISOString() };
+    setComments((c) => [...c ?? [], temp]);
+    setText("");
+    try {
+      const real = await api.comment(post.id, body);
+      setComments((c) => (c ?? []).map((x) => x.id === temp.id ? real : x));
+      setAdded((n) => n + 1);
+    } catch (err) {
+      setComments((c) => (c ?? []).filter((x) => x.id !== temp.id));
+      setText(body);
+      setError(err.message);
+    } finally {
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("button", { type: "button", className: "ckw-btn ckw-btn-ghost ckw-back", onClick: onBack, children: [
+      /* @__PURE__ */ jsx("span", { style: { display: "inline-block", transform: "rotate(-90deg)", lineHeight: 0 }, children: /* @__PURE__ */ jsx(ChevronUp, {}) }),
+      "All requests"
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "ckw-detail-head", children: [
+      /* @__PURE__ */ jsx(VoteButton, { post, onVote }),
+      /* @__PURE__ */ jsxs("div", { className: "ckw-main", children: [
+        /* @__PURE__ */ jsx("h2", { children: post.title }),
+        /* @__PURE__ */ jsxs("div", { className: "ckw-meta", style: { marginTop: 0 }, children: [
+          /* @__PURE__ */ jsx(StatusPill, { status: post.status }),
+          /* @__PURE__ */ jsx("span", { children: timeAgo(post.createdAt) })
+        ] })
+      ] })
+    ] }),
+    post.body && /* @__PURE__ */ jsx("p", { className: "ckw-body", children: post.body }),
+    /* @__PURE__ */ jsxs("h3", { className: "ckw-h", children: [
+      "Comments (",
+      Math.max(post.comments + added, comments?.length ?? 0),
+      ")"
+    ] }),
+    error && /* @__PURE__ */ jsx(ErrorBar, { message: error, onClose: () => setError("") }),
+    /* @__PURE__ */ jsxs("div", { "aria-live": "polite", children: [
+      comments === null && !error && /* @__PURE__ */ jsx(Skeleton, {}),
+      comments?.length === 0 && /* @__PURE__ */ jsx("p", { className: "ckw-sub", children: "No comments yet. Be the first." }),
+      comments?.map((c) => /* @__PURE__ */ jsxs("div", { className: "ckw-comment", children: [
+        /* @__PURE__ */ jsx("b", { children: c.author }),
+        c.isTeam && /* @__PURE__ */ jsx("span", { className: "ckw-team", children: "Team" }),
+        /* @__PURE__ */ jsx("span", { className: "ckw-time", children: timeAgo(c.postedAt) }),
+        /* @__PURE__ */ jsx("p", { children: c.body })
+      ] }, c.id))
+    ] }),
+    /* @__PURE__ */ jsxs("form", { className: "ckw-form", onSubmit: send, style: { marginTop: 12 }, children: [
+      /* @__PURE__ */ jsx("label", { className: "ckw-label", htmlFor: id, children: "Add a comment" }),
+      /* @__PURE__ */ jsx("textarea", { id, className: "ckw-textarea", value: text, maxLength: 2e3, onChange: (e) => setText(e.target.value) }),
+      /* @__PURE__ */ jsx("div", { className: "ckw-actions", children: /* @__PURE__ */ jsx("button", { type: "submit", className: "ckw-btn ckw-btn-primary", disabled: busy || !text.trim(), children: "Comment" }) })
+    ] })
+  ] });
+};
+var Roadmap = ({ onOpen }) => {
+  const api = useApi();
+  const [data, setData] = useState(null);
+  const [error, setError] = useState("");
+  const [tick, setTick] = useState(0);
+  useEffect(() => {
+    const ctl = new AbortController();
+    api.roadmap(ctl.signal).then((r) => (setData(r), setError(""))).catch((e) => e.name !== "AbortError" && setError(e.message));
+    return () => ctl.abort();
+  }, [api, tick]);
+  if (error) return /* @__PURE__ */ jsx(ErrorBar, { message: error, onRetry: () => setTick((t) => t + 1) });
+  if (!data) return /* @__PURE__ */ jsx(Skeleton, {});
+  const cols = [
+    ["planned", "Planned"],
+    ["progress", "In progress"],
+    ["shipped", "Shipped"]
+  ];
+  return /* @__PURE__ */ jsx("div", { className: "ckw-cols", children: cols.map(([k, label]) => /* @__PURE__ */ jsxs("section", { className: "ckw-col", "aria-label": label, children: [
+    /* @__PURE__ */ jsxs("h3", { children: [
+      label,
+      " ",
+      /* @__PURE__ */ jsx("span", { children: data.columns[k].length })
+    ] }),
+    data.columns[k].length === 0 && /* @__PURE__ */ jsx("p", { className: "ckw-sub", children: "Nothing here yet." }),
+    data.columns[k].map((p) => /* @__PURE__ */ jsxs("div", { className: "ckw-card", children: [
+      /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-link", onClick: () => onOpen(p), children: p.title }),
+      /* @__PURE__ */ jsxs("div", { className: "ckw-meta", style: { marginTop: 0 }, children: [
+        /* @__PURE__ */ jsxs("span", { className: "ckw-stat", children: [
+          /* @__PURE__ */ jsx(ChevronUp, {}),
+          " ",
+          p.votes
+        ] }),
+        /* @__PURE__ */ jsxs("span", { className: "ckw-stat", children: [
+          /* @__PURE__ */ jsx(Chat, {}),
+          " ",
+          p.comments
+        ] })
+      ] })
+    ] }, p.id))
+  ] }, k)) });
+};
+var Changelog = () => {
+  const api = useApi();
+  const [entries, setEntries] = useState(null);
+  const [error, setError] = useState("");
+  const [tick, setTick] = useState(0);
+  useEffect(() => {
+    const ctl = new AbortController();
+    api.changelog(ctl.signal).then((r) => (setEntries(r.entries), setError(""))).catch((e) => e.name !== "AbortError" && setError(e.message));
+    return () => ctl.abort();
+  }, [api, tick]);
+  if (error) return /* @__PURE__ */ jsx(ErrorBar, { message: error, onRetry: () => setTick((t) => t + 1) });
+  if (!entries) return /* @__PURE__ */ jsx(Skeleton, {});
+  if (entries.length === 0) return /* @__PURE__ */ jsx("div", { className: "ckw-empty", children: "No updates published yet." });
+  return /* @__PURE__ */ jsx("div", { children: entries.map((e) => /* @__PURE__ */ jsxs("article", { className: "ckw-entry", children: [
+    /* @__PURE__ */ jsx("time", { dateTime: e.publishedAt, children: new Date(e.publishedAt).toLocaleDateString(void 0, { month: "long", day: "numeric", year: "numeric" }) }),
+    /* @__PURE__ */ jsx("h3", { children: e.title }),
+    /* @__PURE__ */ jsx("p", { children: e.body })
+  ] }, e.id)) });
+};
+var FeedbackBoard = ({ title = "Feedback", subtitle = "Tell us what to build next and vote on what matters to you.", theme, accent }) => {
+  const [tab, setTab] = useState("requests");
+  const [sort, setSort] = useState("top");
+  const [board, setBoard] = useState();
+  const [q, setQ] = useState("");
+  const [creating, setCreating] = useState(false);
+  const [opened, setOpened] = useState(null);
+  const list = useFeedbackList({ board, sort, q });
+  const { posts, setPosts, vote } = list;
+  const current = opened && (posts.find((p) => p.id === opened.id) ?? opened);
+  const voteOpened = (p) => {
+    if (!posts.some((x) => x.id === p.id)) {
+      setOpened((o) => o ? { ...o, voted: !o.voted, votes: o.votes + (o.voted ? -1 : 1) } : o);
+      list.api.vote(p.id).then((r) => setOpened((o) => o ? { ...o, voted: r.voted, votes: r.votes } : o)).catch((e) => {
+        setOpened((o) => o ? { ...o, voted: p.voted, votes: p.votes } : o);
+        list.setError(`Your vote was not saved. ${e.message}`);
+      });
+      return;
+    }
+    vote(p);
+  };
+  const tabs = [
+    ["requests", "Requests"],
+    ["roadmap", "Roadmap"],
+    ["changelog", "Changelog"]
+  ];
+  const onTabKey = (e) => {
+    const i = tabs.findIndex(([k]) => k === tab);
+    const n = e.key === "ArrowRight" ? i + 1 : e.key === "ArrowLeft" ? i - 1 : null;
+    if (n === null) return;
+    e.preventDefault();
+    setTab(tabs[(n + tabs.length) % tabs.length][0]);
+    setOpened(null);
+  };
+  return /* @__PURE__ */ jsxs(Root, { theme, accent, className: "ckw-board", children: [
+    /* @__PURE__ */ jsxs("div", { className: "ckw-head", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h2", { className: "ckw-title", children: title }),
+        subtitle && /* @__PURE__ */ jsx("p", { className: "ckw-sub", children: subtitle })
+      ] }),
+      /* @__PURE__ */ jsxs("button", { type: "button", className: "ckw-btn ckw-btn-primary", onClick: () => (setCreating((c) => !c), setOpened(null), setTab("requests")), "aria-expanded": creating, children: [
+        /* @__PURE__ */ jsx(Plus, {}),
+        " Request a feature"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "ckw-tabs", role: "tablist", "aria-label": "Feedback sections", onKeyDown: onTabKey, children: tabs.map(([k, label]) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        role: "tab",
+        id: `ckw-tab-${k}`,
+        "aria-selected": tab === k,
+        tabIndex: tab === k ? 0 : -1,
+        className: "ckw-tab",
+        onClick: () => (setTab(k), setOpened(null)),
+        children: label
+      },
+      k
+    )) }),
+    /* @__PURE__ */ jsxs("div", { role: "tabpanel", "aria-labelledby": `ckw-tab-${tab}`, children: [
+      list.error && /* @__PURE__ */ jsx(ErrorBar, { message: list.error, onRetry: tab === "requests" && !current ? list.reload : void 0, onClose: () => list.setError("") }),
+      current ? /* @__PURE__ */ jsx(PostDetail, { post: current, onBack: () => setOpened(null), onVote: voteOpened }) : tab === "requests" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        creating && /* @__PURE__ */ jsx(
+          SubmitForm,
+          {
+            api: list.api,
+            boards: list.boards,
+            posts,
+            onVote: vote,
+            onCancel: () => setCreating(false),
+            onCreated: (p) => {
+              setPosts((all) => [p, ...all]);
+              setCreating(false);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "ckw-tools", children: [
+          /* @__PURE__ */ jsx("input", { className: "ckw-input ckw-search", type: "search", "aria-label": "Search requests", placeholder: "Search requests", value: q, onChange: (e) => setQ(e.target.value) }),
+          /* @__PURE__ */ jsx("div", { className: "ckw-seg", role: "group", "aria-label": "Sort", children: ["top", "new"].map((s) => /* @__PURE__ */ jsx("button", { type: "button", "aria-pressed": sort === s, onClick: () => setSort(s), children: s === "top" ? "Top" : "New" }, s)) })
+        ] }),
+        list.boards.length > 1 && /* @__PURE__ */ jsxs("div", { className: "ckw-chips", role: "group", "aria-label": "Boards", children: [
+          /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-chip", "aria-pressed": !board, onClick: () => setBoard(void 0), children: "All" }),
+          list.boards.map((b) => /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-chip", "aria-pressed": board === b.id, onClick: () => setBoard(b.id), children: b.label }, b.id))
+        ] }),
+        /* @__PURE__ */ jsx("div", { "aria-live": "polite", "aria-busy": list.loading, children: list.loading && posts.length === 0 ? /* @__PURE__ */ jsx(Skeleton, {}) : posts.length === 0 && !list.error ? /* @__PURE__ */ jsx("div", { className: "ckw-empty", children: q ? "No requests match your search." : "No requests yet. Be the first to suggest something." }) : /* @__PURE__ */ jsx("ul", { className: "ckw-list", children: posts.map((p) => /* @__PURE__ */ jsx(PostRow, { post: p, onOpen: setOpened, onVote: vote }, p.id)) }) })
+      ] }) : tab === "roadmap" ? /* @__PURE__ */ jsx(Roadmap, { onOpen: setOpened }) : /* @__PURE__ */ jsx(Changelog, {})
+    ] })
+  ] });
+};
+var listeners = /* @__PURE__ */ new Set();
+var widgetOpen = false;
+var setWidgetOpen = (v) => {
+  widgetOpen = v;
+  listeners.forEach((l) => l(v));
+};
+var useFeedback = () => ({ open: () => setWidgetOpen(true), close: () => setWidgetOpen(false) });
+var WidgetPanel = ({ boardUrl, onClose }) => {
+  const [suggesting, setSuggesting] = useState(false);
+  const [thanks, setThanks] = useState(false);
+  const list = useFeedbackList({ sort: "top" });
+  const { posts, setPosts } = list;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "ckw-pop-head", children: [
+      /* @__PURE__ */ jsx("span", { children: suggesting ? "Suggest something" : "Top requests" }),
+      /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-btn ckw-btn-ghost", onClick: onClose, "aria-label": "Close feedback", children: /* @__PURE__ */ jsx(Cross, {}) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "ckw-pop-body", children: [
+      list.error && /* @__PURE__ */ jsx(ErrorBar, { message: list.error, onClose: () => list.setError("") }),
+      thanks ? /* @__PURE__ */ jsx("div", { className: "ckw-empty", role: "status", children: "Thanks, your request is in." }) : suggesting ? /* @__PURE__ */ jsx(
+        SubmitForm,
+        {
+          compact: true,
+          api: list.api,
+          boards: list.boards,
+          posts,
+          onVote: list.vote,
+          onCancel: () => setSuggesting(false),
+          onCreated: (p) => {
+            setPosts((all) => [p, ...all]);
+            setSuggesting(false);
+            setThanks(true);
+          }
+        }
+      ) : list.loading && posts.length === 0 ? /* @__PURE__ */ jsx(Skeleton, {}) : posts.length === 0 && !list.error ? /* @__PURE__ */ jsx("div", { className: "ckw-empty", children: "No requests yet. Suggest the first one." }) : /* @__PURE__ */ jsx("ul", { className: "ckw-list", "aria-live": "polite", children: posts.slice(0, 5).map((p) => /* @__PURE__ */ jsxs("li", { className: "ckw-row", children: [
+        /* @__PURE__ */ jsx(VoteButton, { post: p, onVote: list.vote }),
+        /* @__PURE__ */ jsxs("div", { className: "ckw-main", children: [
+          /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, overflowWrap: "anywhere" }, children: p.title }),
+          /* @__PURE__ */ jsx("div", { className: "ckw-meta", children: /* @__PURE__ */ jsx(StatusPill, { status: p.status }) })
+        ] })
+      ] }, p.id)) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "ckw-pop-foot", children: [
+      boardUrl ? /* @__PURE__ */ jsx("a", { href: boardUrl, children: "See all" }) : /* @__PURE__ */ jsx("span", {}),
+      !suggesting && !thanks && /* @__PURE__ */ jsxs("button", { type: "button", className: "ckw-btn ckw-btn-primary", onClick: () => setSuggesting(true), children: [
+        /* @__PURE__ */ jsx(Plus, {}),
+        " Suggest something"
+      ] }),
+      thanks && /* @__PURE__ */ jsx("button", { type: "button", className: "ckw-btn", onClick: () => setThanks(false), children: "Back" })
+    ] })
+  ] });
+};
+var FeedbackWidget = ({ position = "bottom-right", label = "Feedback", boardUrl, theme, accent }) => {
+  const [open, setOpen] = useState(false);
+  const fab = useRef(null);
+  const pop = useRef(null);
+  useEffect(() => {
+    const l = (v) => setOpen(v);
+    listeners.add(l);
+    setOpen(widgetOpen);
+    const click = (e) => {
+      if (e.target?.closest("[data-ck-feedback]")) {
+        e.preventDefault();
+        setWidgetOpen(true);
+      }
+    };
+    document.addEventListener("click", click);
+    return () => {
+      listeners.delete(l);
+      document.removeEventListener("click", click);
+    };
+  }, []);
+  const close = useCallback(() => {
+    setWidgetOpen(false);
+    fab.current?.focus();
+  }, []);
+  useEscape(() => open && close());
+  useEffect(() => {
+    if (open) pop.current?.querySelector("button, input")?.focus();
+  }, [open]);
+  const trap = (e) => {
+    if (e.key !== "Tab" || !pop.current) return;
+    const f = [...pop.current.querySelectorAll("a[href], button:not([disabled]), input, select, textarea")];
+    if (!f.length) return;
+    const first = f[0];
+    const last = f[f.length - 1];
+    if (e.shiftKey && document.activeElement === first) e.preventDefault(), last.focus();
+    else if (!e.shiftKey && document.activeElement === last) e.preventDefault(), first.focus();
+  };
+  return /* @__PURE__ */ jsxs(Root, { theme, accent, children: [
+    /* @__PURE__ */ jsxs("button", { ref: fab, type: "button", className: "ckw-fab", "data-pos": position, "aria-haspopup": "dialog", "aria-expanded": open, onClick: () => open ? close() : setWidgetOpen(true), children: [
+      /* @__PURE__ */ jsx(Chat, {}),
+      " ",
+      label
+    ] }),
+    open && /* @__PURE__ */ jsx("div", { ref: pop, className: "ckw-pop", "data-pos": position, role: "dialog", "aria-label": "Feedback", onKeyDown: trap, children: /* @__PURE__ */ jsx(WidgetPanel, { boardUrl, onClose: close }) })
+  ] });
+};
+export {
+  FeedbackBoard,
+  FeedbackWidget,
+  useFeedback
+};
+//# sourceMappingURL=feedback.js.map