@btndprojects/loam-ui-native 0.1.0 → 0.2.1

package/dist/{chunk-S7F6XLTK.js → chunk-FYWNRX4F.js}

@@ -1,11 +1,12 @@
-import { ContinuousNotice, ShutterButton, TorchToggle, GridToggle, GuideOverlay, ExpertPanel, LensPicker, SequenceStrip, ShutterTray, FlipButton, TrackingOverlay, GridOverlay, FocusTapZone, FocusIndicator } from './chunk-BV3B2HYZ.js';
-import { PlaceholderFeed } from './chunk-LAECSR4H.js';
-import { decorativeProps, camInk, SurfaceLiveRegion, ViewfinderTopBar, GlassIconButton, GuidanceChip, GateHint, useSurfaceAnnounce } from './chunk-RW6ZL2FQ.js';
-import { Icon } from './chunk-TKVFVF5D.js';
+import { ContinuousNotice, ShutterButton, TorchToggle, ViewfinderGridToggle, GuideOverlay, ExpertPanel, LensPicker, SequenceStrip, ShutterTray, FlipButton, TrackingOverlay, ViewfinderGridOverlay, FocusTapZone, FocusIndicator } from './chunk-XIDTBCBA.js';
+import { PlaceholderFeed } from './chunk-5LAAAXFP.js';
+import { decorativeProps, useAnalyzerCopy, camInk, useAnalyzerLabels, AnalyzerCopyScope, SurfaceLiveRegion, ViewfinderTopBar, GlassIconButton, GuidanceChip, GateHint, useSurfaceAnnounce } from './chunk-HJLPZA4X.js';
+import { NAMED_ROLE } from './chunk-W23G6JLF.js';
+import { Icon } from './chunk-UXGIW7OK.js';
 import * as React2 from 'react';
 import { View, Animated, Easing, Text, Pressable } from 'react-native';
 import { createStyleSheet, useStyles, useLoamTheme } from '@btndprojects/loam-theme-native';
-import { queueLabel, profile, caps, isFrozen, primaryCheck, TOASTS, gateHint, angleAt, viewfinderSubtitle, PRIVACY_STATEMENT, confidenceTone, confidenceLabel, CAPTURED_PILL, DONE_LABEL } from '@btndprojects/loam-analyzer';
+import { queueLabel, localizeProfile, profile, caps, isFrozen, primaryCheck, gateHint, angleAt, viewfinderSubtitle, confidenceTone, confidenceLabel } from '@btndprojects/loam-analyzer';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 function numericRatio(ratio) {
@@ -60,7 +61,7 @@ function PreviewSlot({ preview, label, topInset }) {
   return /* @__PURE__ */ jsx(View, { style: styles.previewSlot, children: preview ?? /* @__PURE__ */ jsx(PlaceholderFeed, { label, topInset }) });
 }
 function CaptureFlash({ token = null }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("analyzer");
   const { styles } = useStyles(stageSheet);
   const [flashes, setFlashes] = React2.useState(0);
   const first = React2.useRef(true);
@@ -91,11 +92,12 @@ function CaptureFlash({ token = null }) {
     }
   );
 }
-function QueueBadge({ count, onPress }) {
-  const theme = useLoamTheme();
+function QueueBadge({ count, onPress, copy }) {
+  const theme = useLoamTheme("analyzer");
   const { styles } = useStyles(stageSheet);
+  const words = useAnalyzerCopy(copy);
   if (count <= 0) return null;
-  const text = queueLabel(count);
+  const text = queueLabel(count, words);
   const ink = camInk(theme);
   const body = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(Icon, { name: "scan", size: theme.icon.sm, color: ink }),
@@ -113,7 +115,7 @@ function QueueBadge({ count, onPress }) {
       }
     );
   }
-  return /* @__PURE__ */ jsx(View, { accessible: true, accessibilityLabel: text, style: styles.badge, children: body });
+  return /* @__PURE__ */ jsx(View, { accessible: true, accessibilityRole: NAMED_ROLE, accessibilityLabel: text, style: styles.badge, children: body });
 }
 var stageSheet = createStyleSheet((theme) => ({
   stage: {
@@ -183,22 +185,22 @@ var SCRIM_STOP = {
   analysing: "a10",
   failure: "a11"
 };
-function feedLabel(p, phase, platform, zoom) {
-  const facing = platform === "web" ? "webcam \xB7 front" : "rear camera";
-  if (phase === "live") return `${facing} \xB7 ${p.ratio} \xB7 ${zoom}x \xB7 placeholder feed`;
-  if (phase === "captured") return `frozen frame \xB7 ${p.ratio} \xB7 placeholder`;
-  if (phase === "analysing") return "frozen frame \xB7 analysing";
-  if (phase === "result" || phase === "failure") return "frozen frame";
-  if (phase === "done") return "captured frame";
-  return `${facing} \xB7 ${p.ratio} \xB7 placeholder feed`;
+function feedLabel(p, phase, platform, zoom, t) {
+  const facing = platform === "web" ? t.webcamFront : t.rearCamera;
+  if (phase === "live") return t.feedLive(facing, p.ratio, zoom);
+  if (phase === "captured") return t.feedCaptured(p.ratio);
+  if (phase === "analysing") return t.feedAnalysing;
+  if (phase === "result" || phase === "failure") return t.feedFrozen;
+  if (phase === "done") return t.feedDone;
+  return t.feedLive(facing, p.ratio, zoom);
 }
-function phaseMessage(p, phase) {
-  if (phase === "live") return `${p.label}. ${p.subject}.`;
-  if (phase === "captured") return CAPTURED_PILL;
-  if (phase === "analysing") return "Analysing";
-  if (phase === "result") return "Result ready";
-  if (phase === "failure") return "Analysis failed";
-  if (phase === "done") return DONE_LABEL;
+function phaseMessage(p, phase, copy, t) {
+  if (phase === "live") return copy.viewfinder.phaseLine(p.label, p.subject);
+  if (phase === "captured") return copy.capturedPill;
+  if (phase === "analysing") return t.analysing;
+  if (phase === "result") return t.resultReady;
+  if (phase === "failure") return t.analysisFailed;
+  if (phase === "done") return copy.done;
   return null;
 }
 function detectedChip(detected, confidence) {
@@ -212,15 +214,17 @@ function detectedChip(detected, confidence) {
 function PhaseAnnouncer({
   profile: p,
   phase,
-  detected
+  detected,
+  copy,
+  labels
 }) {
   const announce = useSurfaceAnnounce();
   const sink = React2.useRef(announce);
   sink.current = announce;
   React2.useEffect(() => {
-    const message = phaseMessage(p, phase);
+    const message = phaseMessage(p, phase, copy, labels);
     if (message) sink.current?.(message);
-  }, [p, phase]);
+  }, [p, phase, copy, labels]);
   React2.useEffect(() => {
     if (detected) sink.current?.(detected);
   }, [detected]);
@@ -252,7 +256,11 @@ function Analyzer({
   focusPoint = null,
   flashToken = null,
   title,
-  privacyStatement = PRIVACY_STATEMENT,
+  privacyStatement,
+  enforceGate = true,
+  uploadLabel,
+  labels: labelsProp,
+  copy: copyProp,
   children,
   onCapture,
   onUpload,
@@ -270,9 +278,11 @@ function Analyzer({
   onGatePass,
   onNotify
 }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("analyzer");
   const { styles } = useStyles(analyzerSheet);
-  const p = profile(profileProp);
+  const copy = useAnalyzerCopy(copyProp);
+  const t = useAnalyzerLabels(labelsProp);
+  const p = React2.useMemo(() => localizeProfile(profile(profileProp), copy), [profileProp, copy]);
   const caps$1 = caps(level);
   const chip = detected ? detectedChip(detected, detectedConfidence) : null;
   const live = phase === "live";
@@ -281,10 +291,13 @@ function Analyzer({
   const tracking = objects.length > 0;
   const trackLocked = objects.some((o) => o.locked === true);
   const gateOpen = caps$1.gate ? gate.pass : true;
+  const captureOpen = enforceGate ? gateOpen : true;
   const blockedToast = React2.useMemo(() => {
     const check = primaryCheck(p, gate);
-    return TOASTS.gateBlocked(check ? check.fix : gateHint(p, gate));
-  }, [p, gate]);
+    return copy.toasts.gateBlocked(
+      check ? copy.checks[check.id]?.fix ?? check.fix : gateHint(p, gate, null, copy)
+    );
+  }, [p, gate, copy]);
   const notify = React2.useRef(onNotify);
   notify.current = onNotify;
   const gatePass = React2.useRef(onGatePass);
@@ -302,16 +315,16 @@ function Analyzer({
     (next) => {
       if (!caps$1.grid) return;
       onGridChange?.(next);
-      notify.current?.({ title: TOASTS.grid(next) });
+      notify.current?.({ title: copy.toasts.grid(next) });
     },
     [caps$1.grid, onGridChange]
   );
   const close = React2.useCallback(() => {
     onClose?.();
-    notify.current?.({ title: TOASTS.close });
+    notify.current?.({ title: copy.toasts.close });
   }, [onClose]);
   const angle = angleAt(p, angleIndex);
-  const subtitle = viewfinderSubtitle(p, { angleIndex, shots });
+  const subtitle = viewfinderSubtitle(p, { angleIndex, shots }, copy);
   const sequence = caps$1.sequence && (p.frames === "multi" || typeof p.frames === "number" && p.frames > 1);
   const scrimStop = SCRIM_STOP[phase];
   const trayPrimary = continuous ? /* @__PURE__ */ jsx(ContinuousNotice, {}) : /* @__PURE__ */ jsx(
@@ -319,28 +332,37 @@ function Analyzer({
     {
       platform,
       mode: p.shutter,
-      enabled: gateOpen,
+      enabled: captureOpen,
       countdown: caps$1.auto ? countdown : null,
       blockedToast,
       onPress: onCapture,
       onBlocked: blocked
     }
   );
-  return /* @__PURE__ */ jsxs(SurfaceLiveRegion, { children: [
-    /* @__PURE__ */ jsx(PhaseAnnouncer, { profile: p, phase, detected: chip ? chip.text : null }),
+  return /* @__PURE__ */ jsx(AnalyzerCopyScope.Provider, { value: copyProp, children: /* @__PURE__ */ jsxs(SurfaceLiveRegion, { children: [
+    /* @__PURE__ */ jsx(
+      PhaseAnnouncer,
+      {
+        profile: p,
+        phase,
+        detected: chip ? chip.text : null,
+        copy,
+        labels: t
+      }
+    ),
     /* @__PURE__ */ jsxs(
       CameraSurface,
       {
         ratio,
         platform,
         insets,
-        accessibilityLabel: `${title ?? p.label} viewfinder`,
+        accessibilityLabel: copy.viewfinder.aria(title ?? p.label),
         feed: /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(
             PreviewSlot,
             {
               preview,
-              label: feedLabel(p, phase, platform, zoom),
+              label: feedLabel(p, phase, platform, zoom, t),
               topInset: insets?.top ?? 0
             }
           ),
@@ -362,7 +384,7 @@ function Analyzer({
               safeAreaBottom: insets?.bottom ?? 0
             }
           ) : null,
-          live ? /* @__PURE__ */ jsx(GridOverlay, { visible: caps$1.grid && grid }) : null,
+          live ? /* @__PURE__ */ jsx(ViewfinderGridOverlay, { visible: caps$1.grid && grid }) : null,
           live ? /* @__PURE__ */ jsx(FocusTapZone, { onFocusPoint }) : null,
           live ? /* @__PURE__ */ jsx(
             FocusIndicator,
@@ -383,12 +405,12 @@ function Analyzer({
               onClose: onClose ? close : void 0,
               children: [
                 caps$1.torch ? /* @__PURE__ */ jsx(TorchToggle, { on: torch, available: torchAvailable, onChange: onTorchChange }) : null,
-                caps$1.grid ? /* @__PURE__ */ jsx(GridToggle, { on: grid, onChange: toggleGrid }) : null,
+                caps$1.grid ? /* @__PURE__ */ jsx(ViewfinderGridToggle, { on: grid, onChange: toggleGrid }) : null,
                 caps$1.expert && onExpertOpenChange ? /* @__PURE__ */ jsx(
                   GlassIconButton,
                   {
                     icon: "sliders",
-                    label: "Expert controls",
+                    label: t.expertControls,
                     on: expertOpen,
                     onPress: () => onExpertOpenChange(!expertOpen)
                   }
@@ -455,18 +477,25 @@ function Analyzer({
               ShutterTray,
               {
                 platform,
-                start: /* @__PURE__ */ jsx(GlassIconButton, { icon: "upload", label: "Upload a photo", onPress: onUpload }),
+                start: /* @__PURE__ */ jsx(
+                  GlassIconButton,
+                  {
+                    icon: "upload",
+                    label: uploadLabel ?? t.uploadPhoto,
+                    onPress: onUpload
+                  }
+                ),
                 primary: trayPrimary,
                 stack: continuous,
                 end: caps$1.flip ? /* @__PURE__ */ jsx(FlipButton, { onFlip }) : null
               }
             ),
-            /* @__PURE__ */ jsx(Text, { style: [styles.privacy, { color: camInk(theme) }], children: privacyStatement })
+            privacyStatement ? /* @__PURE__ */ jsx(Text, { style: [styles.privacy, { color: camInk(theme) }], children: privacyStatement }) : null
           ] }) : null
         ]
       }
     )
-  ] });
+  ] }) });
 }
 var analyzerSheet = createStyleSheet((theme) => ({
   scrim: {

package/dist/{chunk-YG3ZJHGU.js → chunk-FZGAAOKS.js}

@@ -1,6 +1,7 @@
-import { Spinner } from './chunk-O7AE6DAF.js';
+import { Spinner } from './chunk-KQZ3GLHR.js';
 import { haptics } from './chunk-NY2U3PBI.js';
-import { useResolvedMotion } from './chunk-6N33LFQA.js';
+import { useLabels } from './chunk-APCWFOZW.js';
+import { useResolvedMotion } from './chunk-J64KGCGX.js';
 import * as React from 'react';
 import { Animated, Easing, View, Pressable, Platform } from 'react-native';
 import { createStyleSheet, useLoamTheme, useStyles } from '@btndprojects/loam-theme-native';
@@ -39,12 +40,15 @@ function geometry(theme, os, size) {
   return { width, height, pad: 0, knob, travel: width - knob };
 }
 function useResolvedPlatform(explicit) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("switch");
   if (explicit) return explicit;
   if (Platform.OS === "ios") return "ios";
   if (Platform.OS === "android") return "android";
   return theme.platform === "iOS" ? "ios" : "android";
 }
+var DEFAULT_LABELS = {
+  loading: "Loading"
+};
 function Switch({
   value,
   defaultValue = false,
@@ -53,21 +57,24 @@ function Switch({
   platform,
   disabled = false,
   pending = false,
+  failed = false,
   motion = "full",
   accessibilityLabel,
-  decorative = false
+  decorative = false,
+  labels: labelsProp
 }) {
+  const labels = useLabels("switch", DEFAULT_LABELS, labelsProp);
   const isControlled = value !== void 0;
   const [internal, setInternal] = React.useState(defaultValue);
   const checked = isControlled ? value : internal;
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("switch");
   const os = useResolvedPlatform(platform);
   const shape = `${os}-${size}`;
   const { styles } = useStyles(sheet, { shape, disabled });
   const { travel, width: trackW, height: trackH } = geometry(theme, os, size);
   const slopX = Math.max(0, (theme.tapMin - trackW) / 2);
   const slopY = Math.max(0, (theme.tapMin - trackH) / 2);
-  const resolved = useResolvedMotion(motion);
+  const resolved = useResolvedMotion(motion, "switch");
   const tint = React.useRef(new Animated.Value(checked ? 1 : 0)).current;
   const slide = React.useRef(new Animated.Value(checked ? 1 : 0)).current;
   React.useEffect(() => {
@@ -108,6 +115,20 @@ function Switch({
     // needs mirroring by hand.
     outputRange: [0, theme.rtl ? -travel : travel]
   });
+  const shake = React.useRef(new Animated.Value(0)).current;
+  const wasFailed = React.useRef(false);
+  React.useEffect(() => {
+    if (failed && !wasFailed.current && resolved === "full") {
+      const step = theme.space[4];
+      const d = Math.max(1, Math.round(theme.duration.fast / 4));
+      Animated.sequence(
+        [-step, step, -step, 0].map(
+          (toValue) => Animated.timing(shake, { toValue, duration: d, useNativeDriver: true })
+        )
+      ).start();
+    }
+    wasFailed.current = failed;
+  }, [failed, resolved, shake, theme.space, theme.duration.fast]);
   const toggle = () => {
     const next = !checked;
     if (!isControlled) setInternal(next);
@@ -136,7 +157,7 @@ function Switch({
                 size: "sm",
                 color: theme.color.accent,
                 motion,
-                accessibilityLabel: "Loading"
+                accessibilityLabel: labels.loading
               }
             )
           }
@@ -155,10 +176,11 @@ function Switch({
       accessibilityState: { checked, disabled, busy: pending },
       "aria-checked": checked,
       "aria-busy": pending || void 0,
+      "aria-invalid": failed || void 0,
       disabled,
       onPress: disabled || pending ? void 0 : toggle,
       hitSlop: { top: slopY, bottom: slopY, left: slopX, right: slopX },
-      children: visual
+      children: /* @__PURE__ */ jsx(Animated.View, { testID: "switch-shake", style: { transform: [{ translateX: shake }] }, children: visual })
     }
   );
 }

package/dist/{chunk-YDGVJETP.js → chunk-G3AFC24V.js}

@@ -1,4 +1,4 @@
-import { ErrorSummary } from './chunk-C2NTXVWM.js';
+import { ErrorSummary } from './chunk-XBZGDDMR.js';
 import * as React from 'react';
 import { View } from 'react-native';
 import { createStyleSheet, useStyles } from '@btndprojects/loam-theme-native';

package/dist/{chunk-EJBDRVIH.js → chunk-G6UESEVN.js}

@@ -1,14 +1,18 @@
-import { ContextMenuOverlay } from './chunk-PZXZJBMP.js';
-import { expandedProps } from './chunk-RQ3HASCC.js';
-import { Button } from './chunk-3ARE4TES.js';
-import { Icon } from './chunk-TKVFVF5D.js';
+import { ContextMenuOverlay } from './chunk-U5NLHYV6.js';
+import { expandedProps } from './chunk-W23G6JLF.js';
+import { Button } from './chunk-E2E3I5W2.js';
+import { useLabels } from './chunk-APCWFOZW.js';
+import { Icon } from './chunk-UXGIW7OK.js';
 import * as React from 'react';
 import { Animated, View, Pressable } from 'react-native';
 import { createStyleSheet, useLoamTheme, useStyles } from '@btndprojects/loam-theme-native';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
+var DEFAULT_LABELS = {
+  menu: "More actions"
+};
 function useChevronColors(variant, disabled) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("split-button");
   if (disabled) return { bg: theme.color.surface3, fg: theme.color.text3 };
   switch (variant) {
     case "primary":
@@ -28,10 +32,13 @@ function SplitButton({
   leadingIcon,
   disabled = false,
   loading = false,
-  menuLabel = "More actions",
-  motion = "full"
+  menuLabel: menuLabelProp,
+  motion = "full",
+  labels: labelsProp
 }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("split-button");
+  const labels = useLabels("splitButton", DEFAULT_LABELS, labelsProp);
+  const menuLabel = menuLabelProp ?? labels.menu;
   const isDisabled = disabled || loading;
   const { styles } = useStyles(sheet, { size });
   const colors = useChevronColors(variant, isDisabled);