@guidelytech/react-native 0.15.0 → 0.16.0

package/dist/index.d.cts

@@ -685,13 +685,18 @@ interface UiState {
     checklists: ChecklistView[];
     survey: SurveyView | null;
     resourceCenterOpen: boolean;
+    /** An article to show in the resource center (from a help-article link); `seq` changes per request. */
+    resourceCenterArticle?: {
+        id: string;
+        seq: number;
+    } | null;
     theme: Partial<ProjectTheme>;
     /** Scout is on for this platform; the overlay renders the messenger (see `client.getMessenger()`). */
     messenger: boolean;
 }
 
 declare const SDK_NAME = "@guidelytech/react-native";
-declare const SDK_VERSION = "0.15.0";
+declare const SDK_VERSION = "0.16.0";
 declare const DEFAULT_API_URL = "https://guidelytech.com";
 /** Host-platform services the engine needs; the provider supplies React Native implementations. */
 interface PlatformBridge {
@@ -753,6 +758,8 @@ declare class GuidelyClient {
     private expanded;
     private surveyView;
     private resourceCenterOpen;
+    /** The article a help-article link asked the resource center to show (`seq` tells repeats apart). */
+    private resourceCenterArticle;
     private cleanups;
     private timers;
     private visibilityWatchers;
@@ -944,6 +951,8 @@ declare class GuidelyClient {
     pressButton(guideId: string, button: StepButton): void;
     /** The close (×) button of a step. */
     closeStep(guideId: string): void;
+    /** The video on a step was tapped: records `guide_video_clicked`, then opens the video outside the app. */
+    openVideo(guideId: string, url: string): void;
     /** The dimmed backdrop behind a step was tapped. */
     backdropPressed(guideId: string): void;
     /** Hotspot dot tapped: show (or hide) its card. */
@@ -998,6 +1007,13 @@ declare class GuidelyClient {
     /** Impressions, completion and dismissal for a guide. */
     getGuideState(idOrKey: string): GuideLocalState;
     openResourceCenter(): void;
+    /**
+     * Opens one help article: in Scout's Help tab when the messenger is on, otherwise in the resource
+     * center. Help-article links in guides and articles (`#guidely-article:<id>`) call this.
+     */
+    openArticle(articleId: string): void;
+    /** A resource-center article with its body: from the config, or fetched when the config left it out. */
+    loadArticle(articleId: string): Promise<ResourceCenterArticle | null>;
     closeResourceCenter(): void;
     /** Creates or removes the messenger to match the config (on only when enabled for this platform). */
     private syncMessenger;

package/dist/index.d.ts

@@ -685,13 +685,18 @@ interface UiState {
     checklists: ChecklistView[];
     survey: SurveyView | null;
     resourceCenterOpen: boolean;
+    /** An article to show in the resource center (from a help-article link); `seq` changes per request. */
+    resourceCenterArticle?: {
+        id: string;
+        seq: number;
+    } | null;
     theme: Partial<ProjectTheme>;
     /** Scout is on for this platform; the overlay renders the messenger (see `client.getMessenger()`). */
     messenger: boolean;
 }
 
 declare const SDK_NAME = "@guidelytech/react-native";
-declare const SDK_VERSION = "0.15.0";
+declare const SDK_VERSION = "0.16.0";
 declare const DEFAULT_API_URL = "https://guidelytech.com";
 /** Host-platform services the engine needs; the provider supplies React Native implementations. */
 interface PlatformBridge {
@@ -753,6 +758,8 @@ declare class GuidelyClient {
     private expanded;
     private surveyView;
     private resourceCenterOpen;
+    /** The article a help-article link asked the resource center to show (`seq` tells repeats apart). */
+    private resourceCenterArticle;
     private cleanups;
     private timers;
     private visibilityWatchers;
@@ -944,6 +951,8 @@ declare class GuidelyClient {
     pressButton(guideId: string, button: StepButton): void;
     /** The close (×) button of a step. */
     closeStep(guideId: string): void;
+    /** The video on a step was tapped: records `guide_video_clicked`, then opens the video outside the app. */
+    openVideo(guideId: string, url: string): void;
     /** The dimmed backdrop behind a step was tapped. */
     backdropPressed(guideId: string): void;
     /** Hotspot dot tapped: show (or hide) its card. */
@@ -998,6 +1007,13 @@ declare class GuidelyClient {
     /** Impressions, completion and dismissal for a guide. */
     getGuideState(idOrKey: string): GuideLocalState;
     openResourceCenter(): void;
+    /**
+     * Opens one help article: in Scout's Help tab when the messenger is on, otherwise in the resource
+     * center. Help-article links in guides and articles (`#guidely-article:<id>`) call this.
+     */
+    openArticle(articleId: string): void;
+    /** A resource-center article with its body: from the config, or fetched when the config left it out. */
+    loadArticle(articleId: string): Promise<ResourceCenterArticle | null>;
     closeResourceCenter(): void;
     /** Creates or removes the messenger to match the config (on only when enabled for this platform). */
     private syncMessenger;

package/dist/index.js

@@ -96,7 +96,7 @@ function FlagsProvider({ children, client: external, payload, ...options }) {
   return /* @__PURE__ */ jsx(FlagsContext.Provider, { value, children });
 }
 
-// ../shared/dist/chunk-XJXXVV3C.js
+// ../shared/dist/chunk-7PWYIAJI.js
 function fnv1a(input) {
   let h = 2166136261;
   for (let i = 0; i < input.length; i++) {
@@ -505,6 +505,16 @@ function isSafeMediaUrl(url) {
     return false;
   }
 }
+function videoThumbnailUrl(url) {
+  const embed = url ? toEmbedUrl(url) : null;
+  if (embed?.provider !== "youtube") return null;
+  const id = embed.src.split("/embed/")[1]?.split("?")[0];
+  return id ? `https://i.ytimg.com/vi/${id}/hqdefault.jpg` : null;
+}
+function stepVideo(step) {
+  if (!step.videoUrl || !isSafeMediaUrl(step.videoUrl)) return null;
+  return { url: step.videoUrl, poster: (step.imageUrl && isSafeMediaUrl(step.imageUrl) ? step.imageUrl : null) ?? videoThumbnailUrl(step.videoUrl) };
+}
 var MAX_COLLECTION_DEPTH = 3;
 function matchesAudiences(required, member) {
   if (!required || required.length === 0) return true;
@@ -574,6 +584,13 @@ function unreadAnnouncements(items, lastSeenAt) {
   if (Number.isNaN(seen)) return items.length;
   return items.filter((a) => Date.parse(a.publishedAt) > seen).length;
 }
+var ARTICLE_HREF_PREFIX = "#guidely-article:";
+var ARTICLE_ID = /^[A-Za-z0-9_-]{1,64}$/;
+function articleIdFromHref(href) {
+  if (!href || !href.startsWith(ARTICLE_HREF_PREFIX)) return null;
+  const id = href.slice(ARTICLE_HREF_PREFIX.length);
+  return ARTICLE_ID.test(id) ? id : null;
+}
 var CAPTURE_SCREENSHOT_MAX_BYTES = 8 * 1024 * 1024;
 var DEFAULT_LOCALE = "en";
 function normalizeLocale(input) {
@@ -2900,7 +2917,7 @@ var PersistentStore = class {
 
 // src/core/client.ts
 var SDK_NAME = "@guidelytech/react-native";
-var SDK_VERSION = "0.15.0";
+var SDK_VERSION = "0.16.0";
 var DEFAULT_API_URL = "https://guidelytech.com";
 var PAGE_SCOPED = /* @__PURE__ */ new Set(["page_load", "url_match", "element_click", "element_visible", "delay"]);
 var CACHED_START_MS = 1500;
@@ -2952,6 +2969,8 @@ var GuidelyClient = class {
     __publicField(this, "expanded", /* @__PURE__ */ new Set());
     __publicField(this, "surveyView", null);
     __publicField(this, "resourceCenterOpen", false);
+    /** The article a help-article link asked the resource center to show (`seq` tells repeats apart). */
+    __publicField(this, "resourceCenterArticle", null);
     __publicField(this, "cleanups", []);
     __publicField(this, "timers", /* @__PURE__ */ new Set());
     __publicField(this, "visibilityWatchers", /* @__PURE__ */ new Map());
@@ -4117,6 +4136,8 @@ var GuidelyClient = class {
    */
   navigate(url) {
     if (!url) return;
+    const articleId = articleIdFromHref(url);
+    if (articleId) return this.openArticle(articleId);
     try {
       if (this.options.onNavigate?.(url) === true) return;
       if (/^[a-z][a-z0-9+.-]*:/i.test(url)) this.bridge.openExternal(url);
@@ -4140,7 +4161,7 @@ var GuidelyClient = class {
     for (const f of [...this.flows.values(), ...this.active ? [this.active] : []]) if (f.view) steps.push({ ...f.view, expanded: this.expanded.has(f.guide.id) });
     const checklists = [];
     this.checklists.forEach((w, id) => checklists.push({ guide: w.guide, progress: this.getChecklistProgress(id), open: w.open }));
-    this.ui = { steps, checklists, survey: this.surveyView, resourceCenterOpen: this.resourceCenterOpen, theme: this.themeFor(), messenger: !!this.messenger };
+    this.ui = { steps, checklists, survey: this.surveyView, resourceCenterOpen: this.resourceCenterOpen, resourceCenterArticle: this.resourceCenterArticle, theme: this.themeFor(), messenger: !!this.messenger };
     for (const cb of Array.from(this.uiListeners)) {
       try {
         cb();
@@ -4160,6 +4181,12 @@ var GuidelyClient = class {
   closeStep(guideId) {
     this.flowFor(guideId)?.controller.dismiss();
   }
+  /** The video on a step was tapped: records `guide_video_clicked`, then opens the video outside the app. */
+  openVideo(guideId, url) {
+    const v = this.flowFor(guideId)?.view;
+    if (v) this.enqueue("guide_video_clicked", { guideId: v.guide.id, guideVersion: v.guide.version, stepId: v.step.id, stepIndex: v.index, properties: { videoUrl: url } });
+    this.navigate(url);
+  }
   /** The dimmed backdrop behind a step was tapped. */
   backdropPressed(guideId) {
     const f = this.flowFor(guideId);
@@ -4432,10 +4459,40 @@ var GuidelyClient = class {
     this.emitter.emit("resource-center:open");
     this.notify();
   }
+  /**
+   * Opens one help article: in Scout's Help tab when the messenger is on, otherwise in the resource
+   * center. Help-article links in guides and articles (`#guidely-article:<id>`) call this.
+   */
+  openArticle(articleId) {
+    if (this.messenger) {
+      this.whenHydrated(() => void this.messenger?.openArticle(articleId));
+      return;
+    }
+    if (!this.getResourceCenter()) {
+      this.log("openArticle: the resource center is not enabled or published for this environment");
+      return;
+    }
+    this.resourceCenterArticle = { id: articleId, seq: (this.resourceCenterArticle?.seq ?? 0) + 1 };
+    if (this.resourceCenterOpen) this.notify();
+    else this.openResourceCenter();
+  }
+  /** A resource-center article with its body: from the config, or fetched when the config left it out. */
+  async loadArticle(articleId) {
+    const listed = this.getResourceCenter()?.articles.find((a) => a.id === articleId);
+    if (listed && !listed.bodyOmitted) return listed;
+    try {
+      const locale = this.articleLocale();
+      const res = await this.api.get(`/articles/${encodeURIComponent(articleId)}`, locale ? { params: { locale } } : {});
+      return res.ok && res.data ? res.data.article : null;
+    } catch {
+      return null;
+    }
+  }
   closeResourceCenter() {
     if (this.messenger) return this.closeMessenger();
     if (!this.resourceCenterOpen) return;
     this.resourceCenterOpen = false;
+    this.resourceCenterArticle = null;
     this.notify();
   }
   // ---------------------------------------------------------------------------
@@ -4846,7 +4903,7 @@ function resolveTapTarget(event, opts = {}) {
 
 // src/ui/Overlay.tsx
 import { useCallback as useCallback2, useEffect as useEffect7, useRef as useRef4, useState as useState7, useSyncExternalStore as useSyncExternalStore3 } from "react";
-import { Platform as Platform5, Pressable as Pressable8, StatusBar, StyleSheet as StyleSheet9, Text as Text8, useColorScheme, useWindowDimensions, View as View9 } from "react-native";
+import { Platform as Platform5, Pressable as Pressable9, StatusBar, StyleSheet as StyleSheet9, Text as Text8, useColorScheme, useWindowDimensions, View as View9 } from "react-native";
 
 // src/ui/Checklist.tsx
 import { Pressable as Pressable3, ScrollView as ScrollView2, StyleSheet as StyleSheet3, Text as Text3, View as View3 } from "react-native";
@@ -5781,7 +5838,7 @@ var styles4 = StyleSheet4.create({
 import { Fragment as Fragment4, useEffect as useEffect4, useMemo as useMemo4, useState as useState4 } from "react";
 import { Modal as Modal3, Platform as Platform3, Pressable as Pressable5, ScrollView as ScrollView4, StyleSheet as StyleSheet5, Text as Text5, TextInput as TextInput2, View as View5 } from "react-native";
 import { Fragment as Fragment5, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
-function ResourceCenter({ client, palette: p, open, topInset, bottomInset }) {
+function ResourceCenter({ client, palette: p, open, articleRequest, topInset, bottomInset }) {
   const rc = client.getResourceCenter();
   const [query, setQuery] = useState4("");
   const [results, setResults] = useState4(null);
@@ -5794,6 +5851,19 @@ function ResourceCenter({ client, palette: p, open, topInset, bottomInset }) {
       setArticle(null);
     }
   }, [open]);
+  useEffect4(() => {
+    if (!open || !articleRequest) return;
+    let alive = true;
+    void client.loadArticle(articleRequest.id).then((a) => {
+      if (!alive || !a) return;
+      if (a.externalUrl) return client.navigate(a.externalUrl);
+      client.articleViewed(a);
+      setArticle(a);
+    });
+    return () => {
+      alive = false;
+    };
+  }, [client, open, articleRequest?.seq]);
   useEffect4(() => {
     const q = query.trim();
     if (q.length < 2) {
@@ -5933,7 +6003,7 @@ var styles5 = StyleSheet5.create({
 
 // src/ui/StepLayer.tsx
 import { useEffect as useEffect5, useRef as useRef3, useState as useState5 } from "react";
-import { AccessibilityInfo as AccessibilityInfo2, Animated as Animated2, Easing as Easing2, Pressable as Pressable6, StyleSheet as StyleSheet7, View as View7 } from "react-native";
+import { AccessibilityInfo as AccessibilityInfo2, Animated as Animated2, Easing as Easing2, Pressable as Pressable7, StyleSheet as StyleSheet7, View as View7 } from "react-native";
 
 // src/core/position.ts
 var MARGIN = 12;
@@ -5973,7 +6043,7 @@ function positionCard(target, size, viewport, insets, placement, offset) {
 }
 
 // src/ui/StepCard.tsx
-import { Image as Image2, StyleSheet as StyleSheet6, Text as Text6, View as View6 } from "react-native";
+import { Image as Image2, Pressable as Pressable6, StyleSheet as StyleSheet6, Text as Text6, View as View6 } from "react-native";
 import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 function StepCard({ view, client, palette: p, width, style, compact }) {
   const { step, guide } = view;
@@ -5981,8 +6051,25 @@ function StepCard({ view, client, palette: p, width, style, compact }) {
   const body = step.type === "custom" ? step.customHtml || step.body : step.body;
   const showProgress = step.showProgress && view.total > 1;
   const onLink = (url) => client.navigate(url);
+  const video = stepVideo(step);
   return /* @__PURE__ */ jsx7(Surface, { palette: p, style: [{ width }, style], children: /* @__PURE__ */ jsxs5(View6, { accessible: false, accessibilityViewIsModal: view.asModal || step.type === "modal", style: compact ? styles6.compact : styles6.inner, children: [
-    step.imageUrl ? (
+    video ? (
+      // The video opens outside the app (browser or the provider's app), like a new tab on the web.
+      /* @__PURE__ */ jsxs5(
+        Pressable6,
+        {
+          onPress: () => client.openVideo(guide.id, video.url),
+          accessibilityRole: "button",
+          accessibilityLabel: step.title ? `Play video: ${step.title}` : "Play video",
+          accessibilityHint: "Opens the video outside the app",
+          style: [styles6.video, { borderRadius: Math.max(0, p.radius - 4) }],
+          children: [
+            video.poster ? /* @__PURE__ */ jsx7(Image2, { source: { uri: video.poster }, style: StyleSheet6.absoluteFill, resizeMode: "cover", accessibilityIgnoresInvertColors: true, accessible: false }) : null,
+            /* @__PURE__ */ jsx7(View6, { style: styles6.play, children: /* @__PURE__ */ jsx7(View6, { style: styles6.playTriangle }) })
+          ]
+        }
+      )
+    ) : step.imageUrl ? (
       // An empty description marks the image as decorative: screen readers skip it.
       /* @__PURE__ */ jsx7(
         Image2,
@@ -6023,6 +6110,10 @@ var styles6 = StyleSheet6.create({
   inner: { padding: 16, gap: 10 },
   compact: { paddingHorizontal: 14, paddingVertical: 10, gap: 6 },
   image: { width: "100%", height: 140, marginBottom: 2 },
+  video: { width: "100%", aspectRatio: 16 / 9, maxHeight: 200, marginBottom: 2, overflow: "hidden", backgroundColor: "#0f172a", alignItems: "center", justifyContent: "center" },
+  play: { width: 52, height: 52, borderRadius: 26, backgroundColor: "rgba(15,23,42,0.72)", alignItems: "center", justifyContent: "center", paddingLeft: 4 },
+  // A CSS-border triangle: no icon font needed.
+  playTriangle: { width: 0, height: 0, borderTopWidth: 10, borderBottomWidth: 10, borderLeftWidth: 16, borderTopColor: "transparent", borderBottomColor: "transparent", borderLeftColor: "#fff" },
   header: { flexDirection: "row", alignItems: "flex-start", gap: 8 },
   title: { flex: 1, fontSize: 17, fontWeight: "700", lineHeight: 22 },
   flex: { flex: 1 },
@@ -6082,7 +6173,7 @@ function StepLayer({ view, client, palette: p, geometry }) {
     if (step.type === "hotspot" && !view.expanded) return;
     AccessibilityInfo2.announceForAccessibility?.(announcement(view));
   }, [view.key, view.expanded]);
-  const backdrop = (children) => /* @__PURE__ */ jsx8(Pressable6, { accessible: false, style: [StyleSheet7.absoluteFill, { backgroundColor: p.overlay }], onPress: () => client.backdropPressed(view.guide.id), children });
+  const backdrop = (children) => /* @__PURE__ */ jsx8(Pressable7, { accessible: false, style: [StyleSheet7.absoluteFill, { backgroundColor: p.overlay }], onPress: () => client.backdropPressed(view.guide.id), children });
   const anchored = !view.asModal && ["tooltip", "popover", "spotlight", "hotspot"].includes(step.type);
   if (!anchored && step.type === "banner") {
     const top = step.position.startsWith("top");
@@ -6121,10 +6212,10 @@ function StepLayer({ view, client, palette: p, geometry }) {
       [hole.x + hole.width - r, hole.y + hole.height - r, -2 * r, -2 * r]
     ];
     return /* @__PURE__ */ jsxs6(Animated2.View, { pointerEvents: "box-none", style: [StyleSheet7.absoluteFill, { opacity }], children: [
-      /* @__PURE__ */ jsx8(Pressable6, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: 0, right: 0, top: 0, height: Math.max(0, hole.y) }] }),
-      /* @__PURE__ */ jsx8(Pressable6, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: 0, right: 0, top: hole.y + hole.height, bottom: 0 }] }),
-      /* @__PURE__ */ jsx8(Pressable6, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: 0, width: Math.max(0, hole.x), top: hole.y, height: hole.height }] }),
-      /* @__PURE__ */ jsx8(Pressable6, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: hole.x + hole.width, right: 0, top: hole.y, height: hole.height }] }),
+      /* @__PURE__ */ jsx8(Pressable7, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: 0, right: 0, top: 0, height: Math.max(0, hole.y) }] }),
+      /* @__PURE__ */ jsx8(Pressable7, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: 0, right: 0, top: hole.y + hole.height, bottom: 0 }] }),
+      /* @__PURE__ */ jsx8(Pressable7, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: 0, width: Math.max(0, hole.x), top: hole.y, height: hole.height }] }),
+      /* @__PURE__ */ jsx8(Pressable7, { accessible: false, onPress: press, style: [styles7.abs, shade, { left: hole.x + hole.width, right: 0, top: hole.y, height: hole.height }] }),
       r > 0 ? corners.map(([left, top, dx, dy], i) => /* @__PURE__ */ jsx8(View7, { pointerEvents: "none", style: [styles7.abs, { left, top, width: r, height: r, overflow: "hidden" }], children: /* @__PURE__ */ jsx8(View7, { style: [styles7.abs, { left: dx, top: dy, width: 4 * r, height: 4 * r, borderRadius: 2 * r, borderWidth: r, borderColor: p.overlay }] }) }, i)) : null,
       /* @__PURE__ */ jsx8(View7, { pointerEvents: "none", style: [styles7.abs, { left: hole.x, top: hole.y, width: hole.width, height: hole.height, borderRadius: r, borderWidth: 2, borderColor: p.primary }] }),
       /* @__PURE__ */ jsx8(Anchored, { view, client, palette: p, geometry, rect: hole, width: cardWidth })
@@ -6168,7 +6259,7 @@ function Hotspot({ x, y, size, pulse, color, onPress, label }) {
     loop.start();
     return () => loop.stop();
   }, [pulse, reduceMotion, scale]);
-  return /* @__PURE__ */ jsxs6(Pressable6, { accessibilityRole: "button", accessibilityLabel: label, onPress, hitSlop: 14, style: [styles7.abs, { left: x, top: y, width: size, height: size }], children: [
+  return /* @__PURE__ */ jsxs6(Pressable7, { accessibilityRole: "button", accessibilityLabel: label, onPress, hitSlop: 14, style: [styles7.abs, { left: x, top: y, width: size, height: size }], children: [
     pulse && !reduceMotion ? /* @__PURE__ */ jsx8(
       Animated2.View,
       {
@@ -6192,7 +6283,7 @@ import {
   AccessibilityInfo as AccessibilityInfo3,
   KeyboardAvoidingView,
   Platform as Platform4,
-  Pressable as Pressable7,
+  Pressable as Pressable8,
   ScrollView as ScrollView5,
   StyleSheet as StyleSheet8,
   Text as Text7,
@@ -6250,7 +6341,7 @@ function Survey({
         style: StyleSheet8.absoluteFill,
         children: [
           centered ? /* @__PURE__ */ jsx9(
-            Pressable7,
+            Pressable8,
             {
               accessible: false,
               style: [StyleSheet8.absoluteFill, { backgroundColor: p.overlay }],
@@ -6347,7 +6438,7 @@ function QuestionInput({
       const values = Array.from({ length: max - min + 1 }, (_, i) => min + i);
       return /* @__PURE__ */ jsxs7(View8, { children: [
         /* @__PURE__ */ jsx9(View8, { style: styles8.scale, accessibilityRole: "radiogroup", accessibilityLabel: q.title, children: values.map((n) => /* @__PURE__ */ jsx9(
-          Pressable7,
+          Pressable8,
           {
             accessibilityRole: "radio",
             accessibilityState: { selected: value === n },
@@ -6367,7 +6458,7 @@ function QuestionInput({
     case "rating": {
       const max = q.scaleMax ?? 5;
       return /* @__PURE__ */ jsx9(View8, { style: styles8.stars, accessibilityRole: "radiogroup", accessibilityLabel: q.title, children: Array.from({ length: max }, (_, i) => i + 1).map((n) => /* @__PURE__ */ jsx9(
-        Pressable7,
+        Pressable8,
         {
           accessibilityRole: "radio",
           accessibilityLabel: `${n} of ${max}`,
@@ -6393,7 +6484,7 @@ function QuestionInput({
         [true, "\u{1F44D}", "Thumbs up"],
         [false, "\u{1F44E}", "Thumbs down"]
       ].map(([val, icon, label]) => /* @__PURE__ */ jsx9(
-        Pressable7,
+        Pressable8,
         {
           accessibilityRole: "radio",
           accessibilityLabel: label,
@@ -6413,7 +6504,7 @@ function QuestionInput({
       return /* @__PURE__ */ jsx9(View8, { style: styles8.choices, children: q.options.map((o) => {
         const on = selected.has(o.id);
         return /* @__PURE__ */ jsxs7(
-          Pressable7,
+          Pressable8,
           {
             accessibilityRole: multi ? "checkbox" : "radio",
             accessibilityState: { checked: on },
@@ -6599,7 +6690,7 @@ function GuidelyOverlay({ client, insets: insetsProp, launcherOffset }) {
   return /* @__PURE__ */ jsxs8(View9, { ref, collapsable: false, pointerEvents: "box-none", style: StyleSheet9.absoluteFill, onLayout: measureOrigin, children: [
     ui.checklists.map((c) => /* @__PURE__ */ jsx10(Checklist, { view: c, client, palette: palette(client.themeFor(c.guide), scheme), geometry, showLauncher: client.options.showChecklistLauncher !== false, launcherBottom: launcherOffset }, c.guide.id)),
     showRcLauncher ? /* @__PURE__ */ jsxs8(
-      Pressable8,
+      Pressable9,
       {
         accessibilityRole: "button",
         accessibilityLabel: rcLauncherLabel(client),
@@ -6624,7 +6715,7 @@ function GuidelyOverlay({ client, insets: insetsProp, launcherOffset }) {
     ) : null,
     ui.survey ? /* @__PURE__ */ jsx10(Survey, { view: ui.survey, client, palette: palette(client.themeFor(ui.survey.guide), scheme), geometry }) : null,
     ui.steps.map((s) => /* @__PURE__ */ jsx10(StepLayer, { view: s, client, palette: palette(client.themeFor(s.guide), scheme, s.guide.config.appearance), geometry }, s.key)),
-    messenger ? /* @__PURE__ */ jsx10(MessengerSheet, { store: messenger, client, palette: basePalette, topInset: insets.top, bottomInset: insets.bottom }) : /* @__PURE__ */ jsx10(ResourceCenter, { client, palette: basePalette, open: ui.resourceCenterOpen, topInset: insets.top, bottomInset: insets.bottom })
+    messenger ? /* @__PURE__ */ jsx10(MessengerSheet, { store: messenger, client, palette: basePalette, topInset: insets.top, bottomInset: insets.bottom }) : /* @__PURE__ */ jsx10(ResourceCenter, { client, palette: basePalette, open: ui.resourceCenterOpen, articleRequest: ui.resourceCenterArticle ?? null, topInset: insets.top, bottomInset: insets.bottom })
   ] });
 }
 var styles9 = StyleSheet9.create({