@repzo/widget-react-native 1.0.0

package/src/ui/utils/rtl.ts

@@ -0,0 +1,43 @@
+/**
+ * Right-to-left helpers.
+ *
+ * Yoga mirrors `flexDirection: 'row'`, `flex-start`/`flex-end` and the
+ * `start`/`end` style props on its own once the host app has turned RTL on.
+ * What it cannot mirror is meaning: an arrow that points "forward" is drawn
+ * rightwards in English and leftwards in Arabic, and a bubble's tail corner
+ * swaps sides with it. Those decisions live here.
+ */
+
+import { I18nManager } from 'react-native';
+
+/**
+ * Text alignment follows the LAYOUT's direction, not the script's. Left to
+ * itself, a Latin string inside an Arabic screen renders hard against the
+ * left edge while everything around it is anchored right, which reads as a
+ * broken row rather than as mixed content.
+ *
+ * Read once at module load: switching direction requires an app restart.
+ */
+export const START_ALIGN: 'left' | 'right' = I18nManager.isRTL ? 'right' : 'left';
+
+export function isRTL(): boolean {
+  return I18nManager.isRTL;
+}
+
+/** Deeper into the app: a disclosure chevron, a "continue" arrow. */
+export function forwardDirection(): 'left' | 'right' {
+  return I18nManager.isRTL ? 'left' : 'right';
+}
+
+/** Back out of the current screen. */
+export function backDirection(): 'left' | 'right' {
+  return I18nManager.isRTL ? 'right' : 'left';
+}
+
+/**
+ * Mirrors a glyph that is drawn pointing right. Cheaper and less error-prone
+ * than maintaining a second set of geometry for every directional icon.
+ */
+export function flipForRTL(): { transform: [{ scaleX: number }] } | undefined {
+  return I18nManager.isRTL ? { transform: [{ scaleX: -1 }] } : undefined;
+}

package/src/ui/utils/safe-url.ts

@@ -0,0 +1,63 @@
+/**
+ * The one gate every widget link goes through before `Linking.openURL`.
+ *
+ * Agent and AI replies, campaign CTAs and attachment URLs are remote content.
+ * Opened blindly they could fire the host app's own deep links
+ * (`myapp://transfer?…`), Android `intent:` URLs, `sms:` or `file:` URIs. Only
+ * web, mail and phone links open by default; the host can route anything else
+ * itself through `boot({ onOpenUrl })`.
+ */
+
+import { Linking } from 'react-native';
+
+type OpenUrlHandler = (url: string) => boolean | Promise<boolean>;
+
+const ALLOWED_SCHEMES = new Set(['https:', 'http:', 'mailto:', 'tel:']);
+
+// eslint-disable-next-line no-control-regex
+const CONTROL_CHARS = /[\u0000-\u001F\u007F]/;
+
+let hostHandler: OpenUrlHandler | null = null;
+
+/** Set from `boot({ onOpenUrl })`; `null` restores the default policy. */
+export function setOpenUrlHandler(handler: OpenUrlHandler | null): void {
+  hostHandler = handler;
+}
+
+/** Lower-cased scheme including the colon (`'https:'`), or null when relative. */
+export function urlScheme(url: string): string | null {
+  const match = /^([a-z][a-z0-9+.-]*):/i.exec(url);
+  return match ? `${match[1].toLowerCase()}:` : null;
+}
+
+/** Absolute `http(s)://host…` — the only shape media URLs may take. */
+export function isHttpUrl(url: string): boolean {
+  return !CONTROL_CHARS.test(url) && /^https?:\/\/[^/\s]/i.test(url);
+}
+
+export function isSafeExternalUrl(url: string): boolean {
+  if (!url || CONTROL_CHARS.test(url)) return false;
+  const scheme = urlScheme(url);
+  if (!scheme || !ALLOWED_SCHEMES.has(scheme)) return false;
+  return scheme === 'http:' || scheme === 'https:' ? isHttpUrl(url) : true;
+}
+
+/** Host handler first, then the allow-list. Never throws. */
+export async function openExternalUrl(url: string | null | undefined): Promise<void> {
+  const target = (url ?? '').trim();
+  if (!target) return;
+
+  if (hostHandler) {
+    try {
+      if (await hostHandler(target)) return;
+    } catch (error) {
+      console.warn('[repzo-widget] onOpenUrl threw — falling back to the default policy', error);
+    }
+  }
+
+  if (!isSafeExternalUrl(target)) {
+    console.warn(`[repzo-widget] blocked a link with a disallowed scheme (${urlScheme(target) ?? 'none'})`);
+    return;
+  }
+  Linking.openURL(target).catch(() => {});
+}