@marktiderman/genesis-forms-studio 0.0.0-stage → 0.2.0

package/dist/index.js

@@ -0,0 +1,1011 @@
+"use client";
+import { SAVE_STATE_LABEL, readinessChip, prefilledUrl, embedSnippet, STATUS_FILTER_LABEL, lowThisWeek, NO_FILTERS, lowScaleAtMost, dayLabel } from './chunk-HAEZ7G3G.js';
+export { NO_FILTERS, RESPONSE_STATUS_LABEL, SAVE_STATE_LABEL, STATUS_FILTER_LABEL, answerCell, answerColumns, answersByKey, carryAnswers, comparisonFilter, dayLabel, dropOffByQuestion, embedSnippet, filterResponses, followUpOf, formAvailability, formCounts, formNavItems, formStatusChip, hasLowRating, hasLowRatingExcept, headlineCards, headlineNumbers, highestRating, isFiltered, isFull, lowRatingAtMost, lowRatingLabel, lowScaleAtMost, lowThisWeek, lowestRating, matchesStatus, needsFollowUp, parseInstant, plainLabel, prefilledUrl, presetRange, readinessChip, readinessOf, summarizeResponses, takesResponses, toCsv, toResponseFilter, valuesByKey } from './chunk-HAEZ7G3G.js';
+import { StatusBadge, cn, Badge, Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator, BreadcrumbPage, Button, Separator, ToggleGroup, ToggleGroupItem, Skeleton, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, Tabs, TabsList, TabsTrigger, TabsContent, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, Label, Textarea, Input, EmptyState, toast } from '@marktiderman/genesis-ui';
+import { Settings, Inbox, GitBranch, ListChecks, Check, Loader2, TriangleAlert, Undo2, Redo2, Eye, Share2, Rocket, CircleAlert, CircleCheck, Star, ExternalLink, Printer, Copy, CalendarDays, CircleDashed, X, CircleDot, SquareCheck, Gauge, Type, ChartNoAxesColumnDecreasing, ImageOff, Image } from 'lucide-react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useId, useState, useEffect } from 'react';
+
+function Chip({
+  tone,
+  icon,
+  children,
+  className,
+  testID
+}) {
+  const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
+    icon ? /* @__PURE__ */ jsx("span", { className: "mr-1 inline-flex [&_svg]:size-3", "aria-hidden": true, children: icon }) : null,
+    children
+  ] });
+  if (tone === "danger") {
+    return /* @__PURE__ */ jsx(StatusBadge, { status: "offTrack", className: cn("font-normal", className), "data-testid": testID, children: inner });
+  }
+  return /* @__PURE__ */ jsx(Badge, { variant: tone, className: cn("font-normal", className), "data-testid": testID, children: inner });
+}
+var SAVE_TONE = {
+  saved: "muted",
+  saving: "muted",
+  unsaved: "muted",
+  failed: "warning",
+  stopped: "danger",
+  conflict: "danger"
+};
+function ResourceHeader({
+  title,
+  untitled = "Untitled",
+  parent,
+  status,
+  saveState,
+  onUndo,
+  onRedo,
+  canUndo = true,
+  canRedo = true,
+  onPreview,
+  onShare,
+  publish,
+  actions,
+  className
+}) {
+  const history = onUndo || onRedo;
+  const name = title.trim() || untitled;
+  return /* @__PURE__ */ jsxs(
+    "header",
+    {
+      "data-slot": "resource-header",
+      className: cn("flex flex-col gap-3 md:flex-row md:items-start md:justify-between", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
+          parent ? /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsxs(BreadcrumbList, { className: "text-xs", children: [
+            /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbLink, { asChild: true, children: parent }) }),
+            /* @__PURE__ */ jsx(BreadcrumbSeparator, {}),
+            /* @__PURE__ */ jsx(BreadcrumbItem, { className: "min-w-0", children: /* @__PURE__ */ jsx(BreadcrumbPage, { className: "truncate", children: name }) })
+          ] }) }) : null,
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-1", children: [
+            /* @__PURE__ */ jsx("h1", { className: "min-w-0 break-words text-xl font-semibold tracking-tight sm:text-2xl", children: name }),
+            status ? /* @__PURE__ */ jsx(Chip, { tone: status.tone, testID: "resource-status", children: status.label }) : null,
+            saveState ? /* @__PURE__ */ jsx("span", { "aria-live": "polite", children: /* @__PURE__ */ jsx(
+              Chip,
+              {
+                tone: SAVE_TONE[saveState],
+                testID: "resource-save-state",
+                icon: saveState === "saved" ? /* @__PURE__ */ jsx(Check, {}) : saveState === "saving" ? /* @__PURE__ */ jsx(Loader2, { className: "animate-spin" }) : saveState === "unsaved" ? null : /* @__PURE__ */ jsx(TriangleAlert, {}),
+                children: SAVE_STATE_LABEL[saveState]
+              }
+            ) }) : null
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: [
+          history ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "icon",
+                "aria-label": "Undo",
+                title: "Undo",
+                disabled: !onUndo || !canUndo,
+                onClick: onUndo,
+                "data-testid": "resource-undo",
+                children: /* @__PURE__ */ jsx(Undo2, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "icon",
+                "aria-label": "Redo",
+                title: "Redo",
+                disabled: !onRedo || !canRedo,
+                onClick: onRedo,
+                "data-testid": "resource-redo",
+                children: /* @__PURE__ */ jsx(Redo2, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "mx-1 h-6" })
+          ] }) : null,
+          actions,
+          onPreview ? /* @__PURE__ */ jsx(Button, { variant: "ghost", startIcon: /* @__PURE__ */ jsx(Eye, { className: "size-4" }), onClick: onPreview, "data-testid": "resource-preview", children: "Preview" }) : null,
+          onShare ? /* @__PURE__ */ jsx(Button, { variant: "outline", startIcon: /* @__PURE__ */ jsx(Share2, { className: "size-4" }), onClick: onShare, "data-testid": "resource-share", children: "Share" }) : null,
+          publish ? /* @__PURE__ */ jsx(
+            Button,
+            {
+              startIcon: /* @__PURE__ */ jsx(Rocket, { className: "size-4" }),
+              loading: publish.loading,
+              disabled: publish.disabled,
+              onClick: publish.onClick,
+              "data-testid": "resource-publish",
+              children: publish.label ?? "Publish"
+            }
+          ) : null
+        ] })
+      ]
+    }
+  );
+}
+function ReadinessChip({
+  readiness,
+  onClick,
+  className
+}) {
+  const { label, tone } = readinessChip(readiness);
+  const icon = readiness.state === "ready" ? /* @__PURE__ */ jsx(Check, {}) : readiness.state === "problems" ? /* @__PURE__ */ jsx(CircleAlert, {}) : readiness.state === "warnings" ? /* @__PURE__ */ jsx(TriangleAlert, {}) : null;
+  const chip = /* @__PURE__ */ jsx(Chip, { tone, icon, testID: "readiness", className, children: label });
+  if (!onClick) return chip;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick,
+      className: "rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+      children: chip
+    }
+  );
+}
+function ResponsesToolbar({
+  view,
+  onViewChange,
+  filters,
+  actions,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "responses-toolbar",
+      className: cn("flex flex-col gap-2 lg:flex-row lg:items-start lg:justify-between", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ jsxs(
+            ToggleGroup,
+            {
+              type: "single",
+              variant: "outline",
+              size: "sm",
+              className: "h-9",
+              value: view,
+              onValueChange: (v) => v && onViewChange(v),
+              "aria-label": "Show responses as",
+              children: [
+                /* @__PURE__ */ jsx(ToggleGroupItem, { value: "summary", className: "h-9 px-3", "data-testid": "responses-view-summary", children: "Summary" }),
+                /* @__PURE__ */ jsx(ToggleGroupItem, { value: "each", className: "h-9 px-3", "data-testid": "responses-view-each", children: "Each response" })
+              ]
+            }
+          ),
+          filters
+        ] }),
+        actions ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 flex-wrap items-center gap-2", children: actions }) : null
+      ]
+    }
+  );
+}
+var TONE = {
+  positive: "text-emerald-700 dark:text-emerald-300",
+  negative: "text-red-700 dark:text-red-300",
+  warning: "text-amber-800 dark:text-amber-200",
+  muted: "text-muted-foreground"
+};
+function HeadlineNumbers({
+  numbers,
+  isLoading = false,
+  className
+}) {
+  if (isLoading) {
+    return /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-2 gap-3 lg:grid-cols-4", className), children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-28 w-full rounded-lg" }, i)) });
+  }
+  if (!numbers.length) return null;
+  return /* @__PURE__ */ jsx(
+    "dl",
+    {
+      "data-slot": "headline-numbers",
+      className: cn(
+        "grid grid-cols-2 gap-3",
+        numbers.length >= 4 ? "lg:grid-cols-4" : numbers.length === 3 ? "lg:grid-cols-3" : "",
+        className
+      ),
+      children: numbers.map((n) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "flex min-w-0 flex-col gap-1 rounded-lg border border-border bg-card p-4 text-card-foreground",
+          "data-testid": `headline-${n.key}`,
+          children: [
+            /* @__PURE__ */ jsx("dt", { className: "truncate text-sm text-muted-foreground", children: n.label }),
+            /* @__PURE__ */ jsx("dd", { className: "text-2xl font-semibold tabular-nums tracking-tight sm:text-3xl", children: n.value }),
+            n.detail ? /* @__PURE__ */ jsx("dd", { className: cn("text-xs", TONE[n.tone ?? "muted"]), children: n.detail }) : null
+          ]
+        },
+        n.key
+      ))
+    }
+  );
+}
+function SummaryCard({
+  icon,
+  title,
+  meta,
+  children,
+  className,
+  testID
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-label": title,
+      "data-testid": testID,
+      "data-slot": "summary-card",
+      className: cn("flex flex-col gap-4 rounded-lg border border-border bg-card p-5 text-card-foreground", className),
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "flex flex-wrap items-baseline justify-between gap-x-4 gap-y-1", children: [
+          /* @__PURE__ */ jsxs("h3", { className: "flex min-w-0 items-center gap-2 font-semibold", children: [
+            icon ? /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground [&_svg]:size-4", "aria-hidden": true, children: icon }) : null,
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 break-words", children: title })
+          ] }),
+          meta ? /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: meta }) : null
+        ] }),
+        children
+      ]
+    }
+  );
+}
+function FollowUpList({
+  entries,
+  actions,
+  title = "Needs a follow-up",
+  isLoading = false,
+  empty = "Nothing to follow up right now.",
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-label": title,
+      "data-testid": "follow-up-list",
+      className: cn("flex flex-col gap-3 rounded-lg border border-border bg-card p-4 text-card-foreground", className),
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs("h3", { className: "flex items-center gap-2 font-semibold", children: [
+            /* @__PURE__ */ jsx(TriangleAlert, { className: "size-4 text-amber-800 dark:text-amber-200", "aria-hidden": true }),
+            title
+          ] }),
+          !isLoading ? /* @__PURE__ */ jsx("span", { className: "rounded-md bg-muted px-2 py-0.5 text-xs tabular-nums text-muted-foreground", children: entries.length }) : null
+        ] }),
+        isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Skeleton, { className: "h-24 w-full rounded-md" }),
+          /* @__PURE__ */ jsx(Skeleton, { className: "h-24 w-full rounded-md" })
+        ] }) : entries.length === 0 ? /* @__PURE__ */ jsxs("p", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+          /* @__PURE__ */ jsx(CircleCheck, { className: "size-4 shrink-0", "aria-hidden": true }),
+          empty
+        ] }) : /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-3", children: entries.map((entry) => {
+          const buttons = actions?.(entry);
+          return /* @__PURE__ */ jsxs(
+            "li",
+            {
+              className: "flex flex-col gap-1.5 rounded-md border border-border p-3",
+              "data-testid": `follow-up-${entry.id}`,
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+                  /* @__PURE__ */ jsxs("p", { className: "flex min-w-0 flex-wrap items-center gap-2", children: [
+                    /* @__PURE__ */ jsx("span", { className: "break-words font-medium", children: entry.name }),
+                    entry.tag ? /* @__PURE__ */ jsx(Chip, { tone: entry.tag.tone ?? "muted", children: entry.tag.label }) : null
+                  ] }),
+                  entry.rating ? /* @__PURE__ */ jsxs(
+                    "span",
+                    {
+                      className: "flex shrink-0 items-center gap-0.5 text-sm font-medium tabular-nums text-amber-800 dark:text-amber-200",
+                      role: "img",
+                      "aria-label": `Rated ${entry.rating.value} out of ${entry.rating.max}`,
+                      children: [
+                        entry.rating.value,
+                        /* @__PURE__ */ jsx(Star, { className: "size-3.5 fill-current", "aria-hidden": true })
+                      ]
+                    }
+                  ) : null
+                ] }),
+                entry.meta ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: entry.meta }) : null,
+                /* @__PURE__ */ jsx("p", { className: cn("line-clamp-3 break-words text-sm", !entry.comment && "text-muted-foreground"), children: entry.comment || "No comment" }),
+                buttons ? /* @__PURE__ */ jsx("div", { className: "mt-1 flex flex-wrap gap-2", children: buttons }) : null
+              ]
+            },
+            entry.id
+          );
+        }) })
+      ]
+    }
+  );
+}
+var ANY = "__any";
+async function copy(text, what) {
+  try {
+    await navigator.clipboard.writeText(text);
+    toast.success(`${what} copied.`);
+  } catch {
+    toast.error("Couldn't copy. Select it and copy it instead.");
+  }
+}
+function CopyField({
+  id,
+  label,
+  value,
+  what
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+    /* @__PURE__ */ jsx(Label, { htmlFor: id, children: label }),
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsx(Input, { id, readOnly: true, value, onFocus: (e) => e.target.select() }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          startIcon: /* @__PURE__ */ jsx(Copy, { className: "size-4" }),
+          onClick: () => void copy(value, what),
+          children: "Copy"
+        }
+      )
+    ] })
+  ] });
+}
+function ShareDialog({
+  open,
+  onOpenChange,
+  noun = "form",
+  title = `Share your ${noun}`,
+  description = "Anyone with the link can answer.",
+  url,
+  posterUrl,
+  renderQr,
+  name,
+  prefill = [],
+  prefillNote,
+  defaultTab = "link"
+}) {
+  const id = useId();
+  const [values, setValues] = useState({});
+  const chosen = Object.fromEntries(Object.entries(values).filter(([, v]) => v && v !== ANY));
+  const prefilled = url && Object.keys(chosen).length ? prefilledUrl(url, chosen) : null;
+  const poster = url ? posterUrl?.(url, {}) : null;
+  const prefilledPoster = prefilled && url ? posterUrl?.(url, chosen) : null;
+  const usable = prefill.filter((p) => p.options.length > 0);
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-h-[90dvh] overflow-y-auto sm:max-w-lg", children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: description })
+    ] }),
+    !url ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Loading the link\u2026" }) : /* @__PURE__ */ jsxs(Tabs, { defaultValue: defaultTab === "qr" && !renderQr ? "link" : defaultTab, children: [
+      /* @__PURE__ */ jsxs(TabsList, { children: [
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "link", children: "Link" }),
+        renderQr && /* @__PURE__ */ jsx(TabsTrigger, { value: "qr", children: "QR code" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "embed", children: "Embed" })
+      ] }),
+      /* @__PURE__ */ jsxs(TabsContent, { value: "link", className: "space-y-5 pt-2", children: [
+        /* @__PURE__ */ jsx(CopyField, { id: `${id}-link`, label: "Link", value: url, what: "Link" }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            asChild: true,
+            variant: "ghost",
+            size: "sm",
+            startIcon: /* @__PURE__ */ jsx(ExternalLink, { className: "size-4" }),
+            children: /* @__PURE__ */ jsxs("a", { href: url, target: "_blank", rel: "noreferrer", children: [
+              "Open the ",
+              noun
+            ] })
+          }
+        ),
+        usable.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-3 border-t border-border pt-4", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Prefilled link" }),
+            prefillNote && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: prefillNote })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: usable.map((p) => /* @__PURE__ */ jsxs(
+            Select,
+            {
+              value: values[p.key] ?? ANY,
+              onValueChange: (v) => setValues((old) => ({ ...old, [p.key]: v })),
+              children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { className: "min-w-40 flex-1", "aria-label": p.label, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                /* @__PURE__ */ jsxs(SelectContent, { children: [
+                  /* @__PURE__ */ jsx(SelectItem, { value: ANY, children: p.anyLabel }),
+                  p.options.map((o) => /* @__PURE__ */ jsx(SelectItem, { value: o.value, children: o.label }, o.value))
+                ] })
+              ]
+            },
+            p.key
+          )) }),
+          prefilled && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              CopyField,
+              {
+                id: `${id}-prefilled`,
+                label: "Prefilled link",
+                value: prefilled,
+                what: "Prefilled link"
+              }
+            ),
+            prefilledPoster && /* @__PURE__ */ jsx(
+              Button,
+              {
+                asChild: true,
+                variant: "outline",
+                startIcon: /* @__PURE__ */ jsx(Printer, { className: "size-4" }),
+                children: /* @__PURE__ */ jsx("a", { href: prefilledPoster, target: "_blank", rel: "noreferrer", children: "Print a poster for this link" })
+              }
+            )
+          ] })
+        ] })
+      ] }),
+      renderQr && /* @__PURE__ */ jsxs(TabsContent, { value: "qr", className: "space-y-4 pt-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "mx-auto w-full max-w-56", children: renderQr(url) }),
+        /* @__PURE__ */ jsxs("p", { className: "text-center text-sm text-muted-foreground", children: [
+          "Scan with a phone's camera to open the ",
+          noun,
+          "."
+        ] }),
+        poster && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", startIcon: /* @__PURE__ */ jsx(Printer, { className: "size-4" }), children: /* @__PURE__ */ jsx("a", { href: poster, target: "_blank", rel: "noreferrer", children: "Print a QR poster" }) }) })
+      ] }),
+      /* @__PURE__ */ jsxs(TabsContent, { value: "embed", className: "space-y-3 pt-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+          /* @__PURE__ */ jsx(Label, { htmlFor: `${id}-embed`, children: "Embed on your website" }),
+          /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              id: `${id}-embed`,
+              readOnly: true,
+              rows: 4,
+              className: "font-mono text-xs",
+              value: embedSnippet(url, name),
+              onFocus: (e) => e.target.select()
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            startIcon: /* @__PURE__ */ jsx(Copy, { className: "size-4" }),
+            onClick: () => void copy(embedSnippet(url, name), "Embed code"),
+            children: "Copy embed code"
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+}
+function SettingsSection({
+  id,
+  icon,
+  title,
+  description,
+  children,
+  className
+}) {
+  const headingId = id ? `${id}-title` : void 0;
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      id,
+      "aria-labelledby": headingId,
+      "data-slot": "settings-section",
+      className: cn("scroll-mt-6 rounded-lg border border-border bg-card text-card-foreground", className),
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "flex gap-3 border-b border-border px-5 py-4", children: [
+          icon ? /* @__PURE__ */ jsx("span", { className: "mt-0.5 text-primary [&_svg]:size-5", "aria-hidden": true, children: icon }) : null,
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsx("h2", { id: headingId, className: "font-semibold", children: title }),
+            description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description }) : null
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "divide-y divide-border",
+              // Rows: genesis-ui SettingsRow and ToggleRow, padded to the card.
+              "[&>*]:px-5 [&>[data-slot=settings-row]]:py-3.5",
+              "[&>[data-slot=settings-row]:not(:has([role=switch]))]:max-sm:flex-col",
+              "[&>[data-slot=settings-row]:not(:has([role=switch]))]:max-sm:items-stretch",
+              "[&>[data-slot=settings-row]>div:last-child]:max-sm:flex-wrap"
+            ),
+            children
+          }
+        )
+      ]
+    }
+  );
+}
+function ResourceSettingsPage({
+  sections,
+  navLabel = "On this page",
+  className
+}) {
+  const [active, setActive] = useState(sections[0]?.id);
+  const ids = sections.map((s) => s.id).join(" ");
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    let frame = 0;
+    const update = () => {
+      frame = 0;
+      const line = window.innerHeight / 3;
+      let current = sections[0]?.id;
+      for (const s of sections) {
+        const el = document.getElementById(s.id);
+        if (el && el.getBoundingClientRect().top <= line) current = s.id;
+      }
+      const bottom = window.innerHeight + window.scrollY >= document.documentElement.scrollHeight - 2;
+      const last = [...sections].reverse().find((s) => document.getElementById(s.id));
+      if (bottom && last && window.scrollY > 0) current = last.id;
+      setActive(current);
+    };
+    const onScroll = () => {
+      if (!frame) frame = window.requestAnimationFrame(update);
+    };
+    update();
+    window.addEventListener("scroll", onScroll, { passive: true, capture: true });
+    return () => {
+      window.removeEventListener("scroll", onScroll, { capture: true });
+      if (frame) window.cancelAnimationFrame(frame);
+    };
+  }, [ids]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "resource-settings-page",
+      className: cn("grid grid-cols-[minmax(0,1fr)] gap-6 md:grid-cols-[12rem_minmax(0,1fr)] lg:gap-8", className),
+      children: [
+        /* @__PURE__ */ jsxs("nav", { "aria-label": navLabel, className: "min-w-0 md:sticky md:top-4 md:self-start", children: [
+          /* @__PURE__ */ jsx("p", { className: "mb-2 hidden text-xs font-medium uppercase tracking-wide text-muted-foreground md:block", children: navLabel }),
+          /* @__PURE__ */ jsx("ul", { className: "-mx-1 flex gap-1 overflow-x-auto px-1 md:mx-0 md:flex-col md:overflow-visible md:px-0", children: sections.map((s) => /* @__PURE__ */ jsx("li", { className: "shrink-0", children: /* @__PURE__ */ jsxs(
+            "a",
+            {
+              href: `#${s.id}`,
+              "aria-current": active === s.id ? "location" : void 0,
+              onClick: (e) => {
+                setActive(s.id);
+                if (s.content === void 0 && s.onSelect) {
+                  e.preventDefault();
+                  s.onSelect();
+                }
+              },
+              className: cn(
+                "flex items-center gap-2 whitespace-nowrap rounded-md px-3 py-1.5 text-sm text-muted-foreground hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-4",
+                active === s.id && "bg-muted font-medium text-foreground"
+              ),
+              children: [
+                s.icon ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: s.icon }) : null,
+                s.title
+              ]
+            }
+          ) }, s.id)) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex min-w-0 flex-col gap-5", children: sections.filter((s) => s.content !== void 0).map((s) => /* @__PURE__ */ jsx(SettingsSection, { id: s.id, icon: s.icon, title: s.title, description: s.description, children: s.content }, s.id)) })
+      ]
+    }
+  );
+}
+var FORM_NAV_ICONS = {
+  questions: ListChecks,
+  logic: GitBranch,
+  responses: Inbox,
+  settings: Settings
+};
+var WHEN = [
+  { value: "all", label: "All time" },
+  { value: "today", label: "Today" },
+  { value: "week", label: "This week" },
+  { value: "7d", label: "Last 7 days" },
+  { value: "30d", label: "Last 30 days" },
+  { value: "month", label: "This month" },
+  { value: "custom", label: "Pick dates" }
+];
+var ANY2 = "__any";
+var TRIGGER = "h-9 w-auto min-w-0 gap-2 [&>span]:flex [&>span]:items-center [&>span]:gap-2";
+function ResponsesFilters({
+  value,
+  onChange,
+  choices = [],
+  ratingMax = null,
+  lowLabel = null,
+  statuses = false,
+  filtered
+}) {
+  const ratings = ratingMax ? Array.from({ length: Math.min(ratingMax, 10) - 1 }, (_, i) => i + 1) : [];
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", "data-testid": "responses-filters", children: [
+    /* @__PURE__ */ jsxs(Select, { value: value.when, onValueChange: (when) => onChange({ ...value, when }), children: [
+      /* @__PURE__ */ jsxs(SelectTrigger, { className: TRIGGER, "aria-label": "When", children: [
+        /* @__PURE__ */ jsx(CalendarDays, { className: "size-4 text-muted-foreground", "aria-hidden": true }),
+        /* @__PURE__ */ jsx(SelectValue, {})
+      ] }),
+      /* @__PURE__ */ jsx(SelectContent, { children: WHEN.map((w) => /* @__PURE__ */ jsx(SelectItem, { value: w.value, children: w.label }, w.value)) })
+    ] }),
+    value.when === "custom" ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          type: "date",
+          className: "h-9 w-auto",
+          "aria-label": "From",
+          value: value.from,
+          max: value.to || void 0,
+          onChange: (e) => onChange({ ...value, from: e.target.value })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "to" }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          type: "date",
+          className: "h-9 w-auto",
+          "aria-label": "To",
+          value: value.to,
+          min: value.from || void 0,
+          onChange: (e) => onChange({ ...value, to: e.target.value })
+        }
+      )
+    ] }) : null,
+    statuses ? /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value: value.status ?? "counted",
+        onValueChange: (status) => onChange({ ...value, status }),
+        children: [
+          /* @__PURE__ */ jsxs(SelectTrigger, { className: TRIGGER, "aria-label": "Status", "data-testid": "responses-status", children: [
+            /* @__PURE__ */ jsx(CircleDashed, { className: "size-4 text-muted-foreground", "aria-hidden": true }),
+            /* @__PURE__ */ jsx(SelectValue, {})
+          ] }),
+          /* @__PURE__ */ jsx(SelectContent, { children: Object.keys(STATUS_FILTER_LABEL).map((s) => /* @__PURE__ */ jsx(SelectItem, { value: s, children: STATUS_FILTER_LABEL[s] }, s)) })
+        ]
+      }
+    ) : null,
+    choices.filter((c) => c.options.length > 0).map((c) => /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value: value.match[c.key] || ANY2,
+        onValueChange: (v) => onChange({ ...value, match: { ...value.match, [c.key]: v === ANY2 ? "" : v } }),
+        children: [
+          /* @__PURE__ */ jsxs(SelectTrigger, { className: `${TRIGGER} max-w-56`, "aria-label": c.label, children: [
+            c.icon ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground [&_svg]:size-4", "aria-hidden": true, children: c.icon }) : null,
+            /* @__PURE__ */ jsx(SelectValue, {})
+          ] }),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: ANY2, children: c.allLabel }),
+            c.options.map((o) => /* @__PURE__ */ jsx(SelectItem, { value: o, children: o }, o))
+          ] })
+        ]
+      },
+      c.key
+    )),
+    ratings.length > 0 ? /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value: value.ratingAtMost == null ? ANY2 : String(value.ratingAtMost),
+        onValueChange: (v) => onChange({ ...value, ratingAtMost: v === ANY2 ? null : Number(v) }),
+        children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { className: TRIGGER, "aria-label": "Rating", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: ANY2, children: "Any rating" }),
+            ratings.map((r) => /* @__PURE__ */ jsx(SelectItem, { value: String(r), children: r === 1 ? "Rated 1" : `Rated ${r} or below` }, r))
+          ] })
+        ]
+      }
+    ) : null,
+    lowLabel ? value.low ? /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: "inline-flex h-9 items-center gap-1.5 rounded-md bg-warning/15 pl-2.5 pr-1 text-sm text-amber-800 dark:bg-warning/20 dark:text-amber-200",
+        "data-testid": "low-ratings-chip",
+        children: [
+          /* @__PURE__ */ jsx(TriangleAlert, { className: "size-4", "aria-hidden": true }),
+          `Low ratings (${lowLabel})`,
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Show every rating",
+              className: "rounded p-1 hover:bg-warning/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              onClick: () => onChange({ ...value, low: false }),
+              children: /* @__PURE__ */ jsx(X, { className: "size-3.5", "aria-hidden": true })
+            }
+          )
+        ]
+      }
+    ) : /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "outline",
+        size: "sm",
+        className: "h-9",
+        startIcon: /* @__PURE__ */ jsx(TriangleAlert, { className: "size-4" }),
+        onClick: () => onChange(lowThisWeek(value)),
+        "data-testid": "low-ratings-preset",
+        children: "Low ratings this week"
+      }
+    ) : null,
+    filtered ? /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", className: "h-9", onClick: () => onChange(NO_FILTERS), children: "Clear filters" }) : null
+  ] });
+}
+var FIRST_TEXT = 5;
+var MORE_TEXT = 10;
+var plural = (n, one, many = `${one}s`) => `${n} ${n === 1 ? one : many}`;
+var ICONS = {
+  rating: Star,
+  nps: Gauge,
+  consent: SquareCheck,
+  "yes-no": CircleCheck,
+  "single-choice": CircleDot,
+  dropdown: CircleDot,
+  "multi-choice": ListChecks
+};
+function Bar({ share, low = false }) {
+  return /* @__PURE__ */ jsx("span", { className: "h-2 overflow-hidden rounded-full bg-muted", "aria-hidden": true, children: /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn("block h-full rounded-full", low ? "bg-warning" : "bg-primary"),
+      style: { width: `${Math.max(0, Math.min(100, share))}%` }
+    }
+  ) });
+}
+function ScaleBody({ s }) {
+  const most = Math.max(1, ...s.buckets.map((b) => b.count));
+  const atMost = lowScaleAtMost(s.type, s.max);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    s.nps ? /* @__PURE__ */ jsxs("p", { className: "text-sm", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-2xl font-semibold tabular-nums", children: s.nps.score }),
+      " ",
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "NPS" }),
+      /* @__PURE__ */ jsxs("span", { className: "block text-xs text-muted-foreground", children: [
+        plural(s.nps.promoters, "promoter"),
+        " (9\u201310), ",
+        plural(s.nps.passives, "passive"),
+        " (7\u20138),",
+        " ",
+        plural(s.nps.detractors, "detractor"),
+        " (0\u20136)"
+      ] })
+    ] }) : null,
+    s.rescaled || s.excluded ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", "data-testid": `scale-note-${s.key}`, children: [
+      s.rescaled ? `${plural(s.rescaled, "answer")} from an earlier version's scale moved onto ${s.min}\u2013${s.max}.` : "",
+      s.excluded ? `${plural(s.excluded, "answer")} outside the scale left out.` : ""
+    ].filter(Boolean).join(" ") }) : null,
+    /* @__PURE__ */ jsx("ul", { className: "space-y-2", "aria-label": "Answers by score", children: [...s.buckets].reverse().map((b) => /* @__PURE__ */ jsxs("li", { className: "grid grid-cols-[2.25rem_1fr_2rem] items-center gap-3 text-sm", children: [
+      /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 tabular-nums", children: [
+        b.value,
+        s.type === "rating" ? /* @__PURE__ */ jsx(Star, { className: "size-3 fill-current", "aria-label": "stars" }) : null
+      ] }),
+      /* @__PURE__ */ jsx(Bar, { share: b.count / most * 100, low: b.value <= atMost }),
+      /* @__PURE__ */ jsx("span", { className: "text-right tabular-nums text-muted-foreground", children: b.count })
+    ] }, b.value)) })
+  ] });
+}
+function ChoiceBody({ s }) {
+  if (s.fieldType === "consent" || s.fieldType === "yes-no") {
+    const yes = s.options.find((o) => o.value === "true");
+    const no = s.options.find((o) => o.value === "false");
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("span", { className: "flex h-2.5 overflow-hidden rounded-full bg-muted", "aria-hidden": true, children: /* @__PURE__ */ jsx("span", { className: "h-full bg-primary", style: { width: `${yes?.percent ?? 0}%` } }) }),
+      /* @__PURE__ */ jsxs("p", { className: "flex flex-wrap gap-x-4 gap-y-1 text-sm", children: [
+        yes ? /* @__PURE__ */ jsxs("span", { className: "text-emerald-700 dark:text-emerald-300", children: [
+          yes.label,
+          " \xB7 ",
+          yes.count,
+          " (",
+          Math.round(yes.percent),
+          "%)"
+        ] }) : null,
+        no ? /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
+          no.label,
+          " \xB7 ",
+          no.count
+        ] }) : null
+      ] })
+    ] });
+  }
+  const most = Math.max(1, ...s.options.map((o) => o.count));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("ul", { className: "space-y-2", children: s.options.map((o) => /* @__PURE__ */ jsxs("li", { className: "grid grid-cols-[minmax(2rem,12rem)_1fr_auto] items-center gap-3 text-sm", children: [
+      /* @__PURE__ */ jsx("span", { className: "truncate", title: o.label, children: o.label }),
+      /* @__PURE__ */ jsx(Bar, { share: o.count / most * 100 }),
+      /* @__PURE__ */ jsxs("span", { className: "whitespace-nowrap text-right tabular-nums text-muted-foreground", children: [
+        o.count,
+        " \xB7 ",
+        Math.round(o.percent),
+        "%"
+      ] })
+    ] }, o.value)) }),
+    s.multiple ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "People could pick more than one." }) : null
+  ] });
+}
+function TextBody({
+  s,
+  today,
+  answerMeta
+}) {
+  const [shown, setShown] = useState(FIRST_TEXT);
+  const left = s.answers.length - shown;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("ul", { className: "space-y-3", children: s.answers.slice(0, shown).map((a) => {
+      const meta = answerMeta?.(a.id);
+      return /* @__PURE__ */ jsxs("li", { className: "border-l-2 border-border pl-3", children: [
+        /* @__PURE__ */ jsxs("p", { className: "whitespace-pre-wrap break-words text-sm", children: [
+          "\u201C",
+          a.text,
+          "\u201D"
+        ] }),
+        /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+          dayLabel(a.date, today),
+          meta ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            " \xB7 ",
+            meta
+          ] }) : null
+        ] })
+      ] }, a.id);
+    }) }),
+    left > 0 ? /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "sm", className: "self-start", onClick: () => setShown((n) => n + MORE_TEXT), children: [
+      "Show more (",
+      left,
+      " more)"
+    ] }) : null
+  ] });
+}
+function QuestionSummaryCard({
+  summary: s,
+  today,
+  answerMeta
+}) {
+  const Icon = ICONS[s.fieldType] ?? Type;
+  const average = s.kind === "scale" && s.average !== null ? ` \xB7 average ${s.average.toFixed(1)}` : "";
+  return /* @__PURE__ */ jsx(
+    SummaryCard,
+    {
+      icon: /* @__PURE__ */ jsx(Icon, {}),
+      title: s.label || "Untitled question",
+      meta: s.count ? `${plural(s.count, "answer")}${average}` : "No answers yet",
+      testID: `summary-${s.key}`,
+      children: s.count > 0 ? s.kind === "scale" ? /* @__PURE__ */ jsx(ScaleBody, { s }) : s.kind === "choice" ? /* @__PURE__ */ jsx(ChoiceBody, { s }) : /* @__PURE__ */ jsx(TextBody, { s, today, answerMeta }) : null
+    }
+  );
+}
+function QuestionSummaryCards({
+  summaries,
+  responses,
+  isLoading = false,
+  emptyTitle = "No responses yet",
+  emptyDescription,
+  onClearFilters,
+  today,
+  answerMeta,
+  className
+}) {
+  if (isLoading) {
+    return /* @__PURE__ */ jsxs("div", { className: cn("space-y-3", className), children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-40 w-full rounded-lg" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-32 w-full rounded-lg" })
+    ] });
+  }
+  if (!responses) {
+    return /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        icon: Inbox,
+        title: emptyTitle,
+        ...emptyDescription ? { description: emptyDescription } : {},
+        hasFilters: !!onClearFilters,
+        ...onClearFilters ? { onClearFilters } : {}
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex min-w-0 flex-col gap-3", className), children: summaries.map((s) => /* @__PURE__ */ jsx(QuestionSummaryCard, { summary: s, today, answerMeta }, s.key)) });
+}
+var plural2 = (n, one, many = `${one}s`) => `${n} ${n === 1 ? one : many}`;
+function DropOffByQuestion({
+  dropOffs,
+  isLoading = false,
+  title = "Drop-off by question",
+  className
+}) {
+  if (isLoading) return /* @__PURE__ */ jsx(Skeleton, { className: cn("h-40 w-full rounded-lg", className) });
+  const started = dropOffs[0]?.views ?? 0;
+  const worst = Math.max(0, ...dropOffs.map((d) => d.stopped));
+  return /* @__PURE__ */ jsx(
+    SummaryCard,
+    {
+      icon: /* @__PURE__ */ jsx(ChartNoAxesColumnDecreasing, {}),
+      title,
+      meta: started ? `${plural2(started, "person", "people")} started` : "Nobody has started yet",
+      className,
+      testID: "drop-off",
+      children: started ? /* @__PURE__ */ jsx("ol", { className: "space-y-3", children: dropOffs.map((d, i) => /* @__PURE__ */ jsxs("li", { className: "space-y-1.5 text-sm", "data-testid": `drop-off-${d.key}`, children: [
+        /* @__PURE__ */ jsxs("p", { className: "flex items-baseline justify-between gap-3", children: [
+          /* @__PURE__ */ jsxs("span", { className: "min-w-0 break-words", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground tabular-nums", children: [
+              i + 1,
+              ". "
+            ] }),
+            d.label || "Untitled question"
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "shrink-0 whitespace-nowrap tabular-nums text-muted-foreground", children: d.dropOff === null ? "\u2013" : `${d.dropOff}% drop-off` })
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "block h-2 overflow-hidden rounded-full bg-muted", "aria-hidden": true, children: /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "block h-full rounded-full",
+              d.stopped && d.stopped === worst ? "bg-warning" : "bg-primary"
+            ),
+            style: { width: `${d.dropOff ?? 0}%` }
+          }
+        ) }),
+        /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+          plural2(d.views, "view"),
+          " \xB7 ",
+          d.stopped,
+          " stopped here"
+        ] })
+      ] }, d.key)) }) : null
+    }
+  );
+}
+var UNDRAWABLE = /* @__PURE__ */ new Set(["image/heic", "image/heif"]);
+function Photo({ photo, resolveUrl }) {
+  const [resolved, setResolved] = useState({ state: "loading" });
+  const [broken, setBroken] = useState(false);
+  useEffect(() => {
+    let live = true;
+    setResolved({ state: "loading" });
+    setBroken(false);
+    resolveUrl(photo).then((url) => live && setResolved(url ? { state: "ready", url } : { state: "missing" })).catch(() => live && setResolved({ state: "missing" }));
+    return () => {
+      live = false;
+    };
+  }, [photo.id]);
+  const tile = "relative size-28 overflow-hidden rounded-md border border-border bg-muted";
+  if (resolved.state === "loading") return /* @__PURE__ */ jsx(Skeleton, { className: "size-28 rounded-md", "aria-label": `Loading ${photo.name}` });
+  if (resolved.state === "missing") {
+    return /* @__PURE__ */ jsxs("div", { className: cn(tile, "flex flex-col items-center justify-center gap-1 p-2 text-center text-xs text-muted-foreground"), children: [
+      /* @__PURE__ */ jsx(ImageOff, { className: "size-5", "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx("span", { children: "Photo unavailable" })
+    ] });
+  }
+  if (broken || UNDRAWABLE.has(photo.type.toLowerCase())) {
+    return /* @__PURE__ */ jsxs("div", { className: cn(tile, "flex flex-col items-center justify-center gap-1 p-2 text-center text-xs"), children: [
+      /* @__PURE__ */ jsx(Image, { className: "size-5 text-muted-foreground", "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx("span", { className: "line-clamp-2 break-all text-muted-foreground", children: photo.name }),
+      /* @__PURE__ */ jsxs(
+        "a",
+        {
+          href: resolved.url,
+          target: "_blank",
+          rel: "noreferrer",
+          className: "inline-flex items-center gap-1 font-medium text-primary underline-offset-4 hover:underline",
+          children: [
+            "Open ",
+            /* @__PURE__ */ jsx(ExternalLink, { className: "size-3", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx("span", { className: "sr-only", children: photo.name })
+          ]
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: resolved.url,
+      target: "_blank",
+      rel: "noreferrer",
+      className: cn(tile, "block outline-none ring-offset-background focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"),
+      title: photo.name,
+      children: /* @__PURE__ */ jsx("img", { src: resolved.url, alt: photo.name, loading: "lazy", className: "size-full object-cover", onError: () => setBroken(true) })
+    }
+  );
+}
+function PhotoAnswer({
+  photos,
+  resolveUrl,
+  className,
+  testID
+}) {
+  if (!photos.length) return null;
+  return /* @__PURE__ */ jsx("ul", { className: cn("flex flex-wrap gap-3", className), "aria-label": "Photos", "data-testid": testID, children: photos.map((photo) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Photo, { photo, resolveUrl }) }, photo.id)) });
+}
+
+export { Chip, DropOffByQuestion, FORM_NAV_ICONS, FollowUpList, HeadlineNumbers, PhotoAnswer, QuestionSummaryCard, QuestionSummaryCards, ReadinessChip, ResourceHeader, ResourceSettingsPage, ResponsesFilters, ResponsesToolbar, SettingsSection, ShareDialog, SummaryCard };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map