@btndprojects/loam-ui-native 0.1.0 → 0.2.1

package/dist/{chunk-BV3B2HYZ.js → chunk-XIDTBCBA.js}

@@ -1,21 +1,20 @@
-import { camInk, GlassIconButton, decorativeProps, untabbableProps, camMeta, pressedProps } from './chunk-RW6ZL2FQ.js';
-import { useReducedMotion } from './chunk-6N33LFQA.js';
-import { Icon } from './chunk-TKVFVF5D.js';
+import { camInk, useViewfinderLabels, useAnalyzerCopy, GlassIconButton, decorativeProps, untabbableProps, camMeta, pressedProps } from './chunk-HJLPZA4X.js';
+import { useLoamLocale } from './chunk-APCWFOZW.js';
+import { Icon } from './chunk-UXGIW7OK.js';
+import { useReducedMotion } from './chunk-J64KGCGX.js';
 import * as React3 from 'react';
 import { Animated, View, Text, Pressable, Easing, Dimensions, ScrollView } from 'react-native';
 import Svg2, { Path, Circle, Defs, LinearGradient, Stop, Rect, Line } from 'react-native-svg';
 import { createStyleSheet, useLoamTheme, useStyles } from '@btndprojects/loam-theme-native';
-import { TRACK_BAND_BOTTOM, EXPERT, CONTINUOUS_NOTICE, confidenceTone, TRACKING_MOTION, confidenceLabel, trackCountLabel, trackTone, chipRoom, chipAnchor, chipSlot, visibleChips, MAX_CHIPS, trackingSummaryLabel, readBatchLabel } from '@btndprojects/loam-analyzer';
+import { TRACK_BAND_BOTTOM, confidenceTone, TRACKING_MOTION, confidenceLabel, trackCountLabel, trackTone, chipRoom, chipAnchor, chipSlot, visibleChips, MAX_CHIPS, trackingSummaryLabel, readBatchLabel } from '@btndprojects/loam-analyzer';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var RING_R = 46;
 var RING_C = 2 * Math.PI * RING_R;
 var RING_STROKE = 6;
-function CountdownRing({
-  value,
-  label = "Auto-capturing"
-}) {
-  const theme = useLoamTheme();
+function CountdownRing({ value, label, labels }) {
+  const t = useViewfinderLabels(labels);
+  const theme = useLoamTheme("viewfinder");
   const reduced = useReducedMotion();
   const { styles } = useStyles(controlSheet);
   const pct2 = Math.min(100, Math.max(0, value));
@@ -25,7 +24,7 @@ function CountdownRing({
     {
       accessibilityRole: "progressbar",
       role: "progressbar",
-      accessibilityLabel: label,
+      accessibilityLabel: label ?? t.autoCapturing,
       accessibilityValue: { min: 0, max: 100, now: Math.round(pct2) },
       style: styles.ringRoot,
       ...{
@@ -57,11 +56,13 @@ function ShutterButton({
   platform = "web",
   countdown = null,
   blockedToast,
-  label = "Capture",
+  label,
+  labels,
   onPress,
   onBlocked
 }) {
-  const theme = useLoamTheme();
+  const t = useViewfinderLabels(labels);
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(controlSheet, { platform, enabled });
   const glyphColour = enabled ? theme.media.onInk : camInk(theme);
   if (mode === "continuous") return null;
@@ -69,7 +70,7 @@ function ShutterButton({
     Pressable,
     {
       accessibilityRole: "button",
-      accessibilityLabel: label,
+      accessibilityLabel: label ?? t.capture,
       accessibilityState: { disabled: !enabled },
       testID: enabled ? "loam-shutter-open" : "loam-shutter-blocked",
       style: styles.shutter,
@@ -89,81 +90,95 @@ function ShutterButton({
             color: glyphColour
           }
         ) }),
-        typeof countdown === "number" ? /* @__PURE__ */ jsx(CountdownRing, { value: countdown }) : null
+        typeof countdown === "number" ? /* @__PURE__ */ jsx(CountdownRing, { value: countdown, labels }) : null
       ]
     }
   );
 }
-function ContinuousNotice({
-  text = CONTINUOUS_NOTICE
-}) {
-  const theme = useLoamTheme();
+function ContinuousNotice({ text, copy }) {
+  const words = useAnalyzerCopy(copy);
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(controlSheet);
   const ink = camInk(theme);
   return /* @__PURE__ */ jsxs(View, { style: styles.notice, children: [
     /* @__PURE__ */ jsx(Icon, { name: "barcode", size: theme.icon.sm, color: ink }),
-    /* @__PURE__ */ jsx(Text, { style: [styles.noticeText, { color: ink }], children: text })
+    /* @__PURE__ */ jsx(Text, { style: [styles.noticeText, { color: ink }], children: text ?? words.continuousNotice })
   ] });
 }
 function TorchToggle({
   on = false,
   available = true,
-  label = "Torch",
+  label,
+  labels,
   onChange
 }) {
+  const t = useViewfinderLabels(labels);
   if (!available) return null;
   return /* @__PURE__ */ jsx(
     GlassIconButton,
     {
       icon: "flash",
-      label,
+      label: label ?? t.torch,
       on,
       onPress: () => onChange?.(!on)
     }
   );
 }
-function GridToggle({
+function ViewfinderGridToggle({
   on = false,
-  label = "Grid",
+  label,
+  labels,
   onChange
 }) {
-  return /* @__PURE__ */ jsx(GlassIconButton, { icon: "grid", label, on, onPress: () => onChange?.(!on) });
+  const t = useViewfinderLabels(labels);
+  return /* @__PURE__ */ jsx(GlassIconButton, { icon: "grid", label: label ?? t.grid, on, onPress: () => onChange?.(!on) });
 }
-function FlipButton({
-  label = "Flip camera",
-  onFlip
-}) {
-  return /* @__PURE__ */ jsx(GlassIconButton, { icon: "flip", label, onPress: onFlip });
+function FlipButton({ label, labels, onFlip }) {
+  const t = useViewfinderLabels(labels);
+  return /* @__PURE__ */ jsx(GlassIconButton, { icon: "flip", label: label ?? t.flipCamera, onPress: onFlip });
 }
 function LensStop({
   stop,
   on,
-  onPick
+  onPick,
+  labels
 }) {
-  const theme = useLoamTheme();
+  const t = useViewfinderLabels(labels);
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(controlSheet, { on });
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       accessibilityRole: "button",
-      accessibilityLabel: `${stop}x`,
+      accessibilityLabel: t.zoomStop(stop),
       accessibilityState: { selected: on },
       style: styles.lensStop,
       hitSlop: Math.max(0, (theme.hit.lg - theme.ctl.md) / 2),
       onPress: onPick,
       ...pressedProps(on),
-      children: /* @__PURE__ */ jsx(Text, { style: [styles.lensLabel, { color: on ? theme.media.onInk : camInk(theme) }], children: `${stop}x` })
+      children: /* @__PURE__ */ jsx(Text, { style: [styles.lensLabel, { color: on ? theme.media.onInk : camInk(theme) }], children: t.zoomStop(stop) })
     }
   );
 }
 function LensPicker({
   stops = [2, 1, 0.5],
   value = 1,
-  label = "Zoom",
+  label,
+  labels,
   onChange
 }) {
+  const t = useViewfinderLabels(labels);
   const { styles } = useStyles(controlSheet);
-  return /* @__PURE__ */ jsx(View, { role: "group", accessibilityLabel: label, style: styles.lensColumn, children: stops.map((stop) => /* @__PURE__ */ jsx(LensStop, { stop, on: stop === value, onPick: () => onChange?.(stop) }, stop)) });
+  return /* @__PURE__ */ jsx(View, { role: "group", accessibilityLabel: label ?? t.zoom, style: styles.lensColumn, children: stops.map((stop) => /* @__PURE__ */ jsx(
+    LensStop,
+    {
+      stop,
+      on: stop === value,
+      labels,
+      onPick: () => onChange?.(stop)
+    },
+    stop
+  )) });
 }
 var controlSheet = createStyleSheet((theme) => ({
   ringRoot: {
@@ -284,7 +299,7 @@ var controlSheet = createStyleSheet((theme) => ({
   }
 }));
 function ScanLine({ active = true, band, travel }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("viewfinder");
   const reduced = useReducedMotion();
   const { styles } = useStyles(overlaySheet);
   const height = band ?? theme.space[80];
@@ -356,7 +371,7 @@ function GuideOverlay({
   hint,
   scanning = true
 }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(overlaySheet, { pass, dimmed });
   const snap = React3.useRef(new Animated.Value(pass ? 1 : 0)).current;
   React3.useEffect(() => {
@@ -459,7 +474,7 @@ function GuideOverlay({
     }
   );
 }
-function GridOverlay({ visible = false }) {
+function ViewfinderGridOverlay({ visible = false }) {
   const { styles } = useStyles(overlaySheet);
   if (!visible) return null;
   return /* @__PURE__ */ jsxs(View, { accessible: false, testID: "loam-grid-overlay", style: styles.gridRoot, ...decorativeProps(), children: [
@@ -470,7 +485,7 @@ function GridOverlay({ visible = false }) {
   ] });
 }
 function FocusPulse({ point }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("viewfinder");
   const reduced = useReducedMotion();
   const { styles } = useStyles(overlaySheet);
   const phase = React3.useRef(new Animated.Value(0)).current;
@@ -775,7 +790,7 @@ function TrackChip({
   staggerIndex = 0,
   frozen = false
 }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("viewfinder");
   const reduced = useReducedMotion();
   const tone = confidenceTone(conf);
   const { styles } = useStyles(trackingSheet, { slot, tone, anchor });
@@ -811,10 +826,24 @@ function TrackChip({
     }
   ) });
 }
-function TrackCountPill({ count, label }) {
+function TrackCountPill({
+  count,
+  label,
+  copy
+}) {
+  const words = useAnalyzerCopy(copy);
   const { styles } = useStyles(trackingSheet);
   if (count <= 0) return null;
-  return /* @__PURE__ */ jsx(View, { accessible: false, testID: "loam-track-count", style: styles.countPill, ...decorativeProps(), children: /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.countText, children: label ?? trackCountLabel(count) }) });
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessible: false,
+      testID: "loam-track-count",
+      style: styles.countPill,
+      ...decorativeProps(),
+      children: /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.countText, children: label ?? trackCountLabel(count, words) })
+    }
+  );
 }
 var OUTLINE_PATH = {
   /** A leafy blob — the plant profile's subject. */
@@ -834,7 +863,7 @@ function TrackedBox({
   ease = TRACKING_MOTION.ease,
   frozen = false
 }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("viewfinder");
   const reduced = useReducedMotion();
   const [x, y, w, h] = object.box;
   const isLocked = locked ?? object.locked ?? false;
@@ -918,7 +947,10 @@ function TrackedBox({
     {
       accessible: false,
       testID: `loam-track-box-${object.id}`,
-      style: [styles.box, { left: pct(geo.x), top: pct(geo.y), width: pct(geo.w), height: pct(geo.h) }],
+      style: [
+        styles.box,
+        { left: pct(geo.x), top: pct(geo.y), width: pct(geo.w), height: pct(geo.h) }
+      ],
       ...decorativeProps(),
       children: [
         /* @__PURE__ */ jsxs(Animated.View, { style: [styles.bracketLayer, { transform: [{ scale: lockScale }] }], children: [
@@ -976,13 +1008,15 @@ function TrackingOverlay({
   frozen = false,
   dimmed = false,
   safeAreaBottom = 0,
-  label
+  label,
+  copy
 }) {
+  const words = useAnalyzerCopy(copy);
   const { styles } = useStyles(trackingSheet, { dimmed });
   const [framePx, setFramePx] = React3.useState(0);
   const { chips, overflow } = visibleChips([...objects], maxChips, framePx || void 0);
   const chipIndex = new Map(chips.map((o, i) => [o.id, i]));
-  const name = label === void 0 ? trackingSummaryLabel(objects) : label;
+  const name = label === void 0 ? trackingSummaryLabel(objects, words) : label;
   return /* @__PURE__ */ jsxs(
     View,
     {
@@ -1228,100 +1262,118 @@ function SequenceStrip({
   angles,
   mode = "angles",
   readLabel,
+  labels,
+  copy,
   onRedo,
   onRead
 }) {
-  const theme = useLoamTheme();
+  const t = useViewfinderLabels(labels);
+  const words = useAnalyzerCopy(copy);
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(sequenceSheet);
   const batch = mode === "batch";
   const count = batch ? Math.max(3, shots + 1) : total;
   const cells = Array.from({ length: count }, (_, i) => i);
-  return /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: batch ? "Captured pages" : "Capture sequence", style: styles.strip, children: [
-    /* @__PURE__ */ jsx(
-      ScrollView,
-      {
-        horizontal: true,
-        showsHorizontalScrollIndicator: false,
-        contentContainerStyle: styles.railContent,
-        style: styles.rail,
-        children: cells.map((i) => {
-          const done = i < shots;
-          const isCurrent = !done && i === current;
-          const name = batch ? `Page ${i + 1}` : angles?.[i]?.label ?? `Angle ${i + 1}`;
-          const label = done ? `${name} \u2014 captured, tap to redo` : name;
-          if (done) {
-            return /* @__PURE__ */ jsx(
-              Pressable,
-              {
-                accessibilityRole: "button",
-                accessibilityLabel: label,
-                style: styles.cellDone,
-                hitSlop: (theme.hit.lg - theme.space[32]) / 2,
-                onPress: () => onRedo?.(i),
-                children: /* @__PURE__ */ jsx(
-                  Icon,
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      role: "group",
+      accessibilityLabel: batch ? t.capturedPages : t.captureSequence,
+      style: styles.strip,
+      children: [
+        /* @__PURE__ */ jsx(
+          ScrollView,
+          {
+            horizontal: true,
+            showsHorizontalScrollIndicator: false,
+            contentContainerStyle: styles.railContent,
+            style: styles.rail,
+            children: cells.map((i) => {
+              const done = i < shots;
+              const isCurrent = !done && i === current;
+              const name = batch ? words.viewfinder.pageN(i + 1) : angles?.[i]?.label ?? words.viewfinder.angleN(i + 1);
+              const label = done ? t.stepCaptured(name) : name;
+              if (done) {
+                return /* @__PURE__ */ jsx(
+                  Pressable,
                   {
-                    name: "check",
-                    size: theme.icon.sm,
-                    color: theme.color.goodInk,
-                    strokeWidth: theme.icon.strokeBold
-                  }
-                )
-              },
-              i
-            );
+                    accessibilityRole: "button",
+                    accessibilityLabel: label,
+                    style: styles.cellDone,
+                    hitSlop: (theme.hit.lg - theme.space[32]) / 2,
+                    onPress: () => onRedo?.(i),
+                    children: /* @__PURE__ */ jsx(
+                      Icon,
+                      {
+                        name: "check",
+                        size: theme.icon.sm,
+                        color: theme.color.goodInk,
+                        strokeWidth: theme.icon.strokeBold
+                      }
+                    )
+                  },
+                  i
+                );
+              }
+              return /* @__PURE__ */ jsx(
+                View,
+                {
+                  accessible: true,
+                  accessibilityLabel: label,
+                  style: [styles.cellPending, isCurrent ? styles.cellCurrent : null],
+                  children: /* @__PURE__ */ jsx(Text, { style: styles.cellNumber, accessible: false, children: String(i + 1) })
+                },
+                i
+              );
+            })
           }
-          return /* @__PURE__ */ jsx(
-            View,
+        ),
+        batch && shots > 0 ? (
+          // Pinned: outside the scroller, so eleven pages cannot push it off the
+          // end of the rail.
+          /* @__PURE__ */ jsx(
+            Pressable,
             {
-              accessible: true,
-              accessibilityLabel: label,
-              style: [styles.cellPending, isCurrent ? styles.cellCurrent : null],
-              children: /* @__PURE__ */ jsx(Text, { style: styles.cellNumber, accessible: false, children: String(i + 1) })
-            },
-            i
-          );
-        })
-      }
-    ),
-    batch && shots > 0 ? (
-      // Pinned: outside the scroller, so eleven pages cannot push it off the
-      // end of the rail.
-      /* @__PURE__ */ jsx(
-        Pressable,
-        {
-          accessibilityRole: "button",
-          style: styles.pinned,
-          hitSlop: (theme.hit.lg - theme.space[32]) / 2,
-          onPress: onRead,
-          children: /* @__PURE__ */ jsx(Text, { style: styles.pinnedLabel, children: readLabel ?? readBatchLabel(shots) })
-        }
-      )
-    ) : null
-  ] });
+              accessibilityRole: "button",
+              style: styles.pinned,
+              hitSlop: (theme.hit.lg - theme.space[32]) / 2,
+              onPress: onRead,
+              children: /* @__PURE__ */ jsx(Text, { style: styles.pinnedLabel, children: readLabel ?? readBatchLabel(shots, words) })
+            }
+          )
+        ) : null
+      ]
+    }
+  );
 }
 var EV_STOPS = Array.from(
   { length: 13 },
   (_, i) => Math.round((i - 6) / 3 * 100) / 100
 );
-function evLabel(v) {
+function evLabel(v, locale) {
   if (v === 0) return "0";
-  return `${v > 0 ? "+" : ""}${v.toFixed(1)}`;
+  return new Intl.NumberFormat(locale, {
+    minimumFractionDigits: 1,
+    maximumFractionDigits: 1,
+    signDisplay: "exceptZero"
+  }).format(v);
+}
+function groupNames(expert) {
+  return {
+    ev: expert[1]?.name ?? "EV compensation",
+    torch: expert[3]?.name ?? "Torch level",
+    format: expert[4]?.name ?? "Resolution and format",
+    ae: expert[0]?.name ?? "Exposure lock",
+    af: expert[2]?.name ?? "Focus lock",
+    gridLevel: expert[5]?.name ?? "Grid and level"
+  };
 }
-var GROUP = {
-  ev: EXPERT[1]?.[0] ?? "EV compensation",
-  torch: EXPERT[3]?.[0] ?? "Torch level",
-  format: EXPERT[4]?.[0] ?? "Resolution and format",
-  ae: EXPERT[0]?.[0] ?? "Exposure lock",
-  af: EXPERT[2]?.[0] ?? "Focus lock",
-  gridLevel: EXPERT[5]?.[0] ?? "Grid and level"
-};
 function Stop2({
   on,
   label,
   onPick
 }) {
-  const theme = useLoamTheme();
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(sequenceSheet, { on });
   return /* @__PURE__ */ jsx(
     Pressable,
@@ -1339,10 +1391,16 @@ function Stop2({
 function ExpertPanel({
   platform = "ios",
   values = {},
+  labels,
+  copy,
   onChange,
   onClose
 }) {
-  const theme = useLoamTheme();
+  const t = useViewfinderLabels(labels);
+  const words = useAnalyzerCopy(copy);
+  const locale = useLoamLocale();
+  const GROUP = groupNames(words.expert);
+  const theme = useLoamTheme("viewfinder");
   const { styles } = useStyles(sequenceSheet);
   const {
     ev = 0,
@@ -1356,16 +1414,16 @@ function ExpertPanel({
   const toggles = [
     [GROUP.ae, aeLock, "aeLock"],
     [GROUP.af, afLock, "afLock"],
-    ["Level", level, "level"],
-    ["Grid", grid, "grid"]
+    [t.level, level, "level"],
+    [t.grid, grid, "grid"]
   ];
-  return /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: "Expert controls", style: styles.panel, children: [
+  return /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: t.expertControls, style: styles.panel, children: [
     /* @__PURE__ */ jsxs(View, { style: styles.panelHead, children: [
-      /* @__PURE__ */ jsx(Text, { style: [styles.panelTitle, { color: camInk(theme) }], children: "Expert" }),
-      /* @__PURE__ */ jsx(View, { style: styles.panelHeadEnd, children: onClose ? /* @__PURE__ */ jsx(GlassIconButton, { icon: "x", label: "Close expert controls", onPress: onClose }) : null })
+      /* @__PURE__ */ jsx(Text, { style: [styles.panelTitle, { color: camInk(theme) }], children: t.expert }),
+      /* @__PURE__ */ jsx(View, { style: styles.panelHeadEnd, children: onClose ? /* @__PURE__ */ jsx(GlassIconButton, { icon: "x", label: t.closeExpert, onPress: onClose }) : null })
     ] }),
     /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: GROUP.ev, style: styles.group, children: [
-      /* @__PURE__ */ jsx(Text, { style: [styles.groupLabel, camMeta(theme)], children: GROUP.ev.toUpperCase() }),
+      /* @__PURE__ */ jsx(Text, { style: [styles.groupLabel, camMeta(theme)], children: GROUP.ev.toLocaleUpperCase(locale) }),
       /* @__PURE__ */ jsx(
         ScrollView,
         {
@@ -1376,7 +1434,7 @@ function ExpertPanel({
             Stop2,
             {
               on: stop === ev,
-              label: evLabel(stop),
+              label: evLabel(stop, locale),
               onPick: () => onChange?.({ control: "ev", value: stop })
             },
             stop
@@ -1385,24 +1443,24 @@ function ExpertPanel({
       )
     ] }),
     /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: GROUP.torch, style: styles.group, children: [
-      /* @__PURE__ */ jsx(Text, { style: [styles.groupLabel, camMeta(theme)], children: GROUP.torch.toUpperCase() }),
+      /* @__PURE__ */ jsx(Text, { style: [styles.groupLabel, camMeta(theme)], children: GROUP.torch.toLocaleUpperCase(locale) }),
       /* @__PURE__ */ jsx(View, { style: styles.stopRow, children: ["off", "low", "high"].map((lvl) => /* @__PURE__ */ jsx(
         Stop2,
         {
           on: lvl === torch,
-          label: lvl,
+          label: t.torchLevels[lvl],
           onPick: () => onChange?.({ control: "torch", value: lvl })
         },
         lvl
       )) })
     ] }),
     /* @__PURE__ */ jsxs(View, { role: "group", accessibilityLabel: GROUP.format, style: styles.group, children: [
-      /* @__PURE__ */ jsx(Text, { style: [styles.groupLabel, camMeta(theme)], children: GROUP.format.toUpperCase() }),
+      /* @__PURE__ */ jsx(Text, { style: [styles.groupLabel, camMeta(theme)], children: GROUP.format.toLocaleUpperCase(locale) }),
       /* @__PURE__ */ jsx(View, { style: styles.stopRow, children: ["pipeline", "full"].map((f) => /* @__PURE__ */ jsx(
         Stop2,
         {
           on: f === format,
-          label: f === "pipeline" ? "Pipeline-native" : "Full sensor",
+          label: t.formats[f],
           onPick: () => onChange?.({ control: "format", value: f })
         },
         f
@@ -1632,4 +1690,4 @@ var traySheet = createStyleSheet((theme) => ({
   }
 }));
 
-export { ContinuousNotice, CountdownRing, EV_STOPS, ExpertPanel, FlipButton, FocusIndicator, FocusTapZone, GridOverlay, GridToggle, GuideOverlay, LensPicker, ScanLine, SequenceStrip, ShutterButton, ShutterTray, TorchToggle, TrackChip, TrackCountPill, TrackedBox, TrackingOverlay };
+export { ContinuousNotice, CountdownRing, EV_STOPS, ExpertPanel, FlipButton, FocusIndicator, FocusTapZone, GuideOverlay, LensPicker, ScanLine, SequenceStrip, ShutterButton, ShutterTray, TorchToggle, TrackChip, TrackCountPill, TrackedBox, TrackingOverlay, ViewfinderGridOverlay, ViewfinderGridToggle };