@btndprojects/loam-ui-native 0.0.0-stage → 0.1.1

package/dist/chunk-423B7SPN.js

@@ -0,0 +1,993 @@
+import { Stepper } from './chunk-VQHPQEUH.js';
+import { DescriptionList } from './chunk-TUTI5HOZ.js';
+import { Input } from './chunk-ITTYJZWX.js';
+import { PhaseAnnouncement, ConfidenceBadge, MatchRow, NoteBlock } from './chunk-N32RGOA5.js';
+import { Badge } from './chunk-SBMNWWBV.js';
+import { Card, CardHeader, CardTitle, CardContent, CardFooter } from './chunk-KMI5ML5I.js';
+import { PlaceholderFeed } from './chunk-LAECSR4H.js';
+import { decorativeProps, GuidanceChip, camInk } from './chunk-RW6ZL2FQ.js';
+import { Button } from './chunk-3ARE4TES.js';
+import { useReducedMotion } from './chunk-6N33LFQA.js';
+import { Icon } from './chunk-TKVFVF5D.js';
+import * as React5 from 'react';
+import { Animated, View, Text, Pressable, Platform, findNodeHandle, AccessibilityInfo, PanResponder, ScrollView, Easing } from 'react-native';
+import Svg, { Defs, LinearGradient, Stop, Rect } from 'react-native-svg';
+import { createStyleSheet, useLoamTheme, useStyles } from '@btndprojects/loam-theme-native';
+import { STAGE_PRIVACY, profile, pipelineFrom, PIPELINE_FOOTER, RESULT_NOTES, estimateRange, failure, failureBody, FAILURE_OFFER_PREFIX, FAILURE_SECONDARY_LABEL, failurePrimaryLabel, CAPTURED_PILL, resultPrimaryLabel, fieldFlagged, FIELD_FLAG_COPY } from '@btndprojects/loam-analyzer';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { money } from '@btndprojects/loam-pay';
+
+function ScanSweep({ active = true }) {
+  const theme = useLoamTheme();
+  const reduced = useReducedMotion();
+  const { styles } = useStyles(analysisSheet);
+  const [band, setBand] = React5.useState(0);
+  const phase = React5.useRef(new Animated.Value(0)).current;
+  const still = reduced || theme.reduceMotion;
+  React5.useEffect(() => {
+    if (!active || still || band === 0) {
+      phase.setValue(0);
+      return;
+    }
+    const leg = (to) => Animated.timing(phase, {
+      toValue: to,
+      duration: theme.loop.spin * 2,
+      easing: Easing.bezier(...theme.easing.inOut),
+      useNativeDriver: true
+    });
+    const loop = Animated.loop(Animated.sequence([leg(1), leg(0)]));
+    loop.start();
+    return () => loop.stop();
+  }, [active, still, band, phase, theme.loop.spin, theme.easing.inOut]);
+  if (!active) return null;
+  const onLayout = (e) => setBand(e.nativeEvent.layout.height);
+  const translateY = still ? band : phase.interpolate({ inputRange: [0, 1], outputRange: [-band, band * 4] });
+  return /* @__PURE__ */ jsx(View, { accessible: false, testID: "loam-scan-sweep", style: styles.sweepRoot, ...decorativeProps(), children: /* @__PURE__ */ jsx(
+    Animated.View,
+    {
+      testID: still ? "loam-scan-sweep-static" : "loam-scan-sweep-band",
+      onLayout,
+      style: [styles.sweepBand, { transform: [{ translateY }] }],
+      children: /* @__PURE__ */ jsxs(Svg, { width: "100%", height: "100%", children: [
+        /* @__PURE__ */ jsx(Defs, { children: /* @__PURE__ */ jsxs(LinearGradient, { id: "loam-cam-sweep", x1: "0", y1: "0", x2: "0", y2: "1", children: [
+          /* @__PURE__ */ jsx(Stop, { offset: "0", stopColor: theme.color.good, stopOpacity: theme.opacity[0] }),
+          /* @__PURE__ */ jsx(Stop, { offset: "0.5", stopColor: theme.color.good, stopOpacity: theme.opacity[100] }),
+          /* @__PURE__ */ jsx(Stop, { offset: "1", stopColor: theme.color.good, stopOpacity: theme.opacity[0] })
+        ] }) }),
+        /* @__PURE__ */ jsx(Rect, { x: "0", y: "0", width: "100%", height: "100%", fill: "url(#loam-cam-sweep)" })
+      ] })
+    }
+  ) });
+}
+function StageBadge({ where }) {
+  const privacy = STAGE_PRIVACY[where];
+  return /* @__PURE__ */ jsx(View, { accessible: false, importantForAccessibility: "no-hide-descendants", ...decorativeProps(), children: /* @__PURE__ */ jsx(Badge, { variant: where === "device" ? "good" : "neutral", size: "sm", children: privacy.badge.toUpperCase() }) });
+}
+function StageDot({ status }) {
+  const theme = useLoamTheme();
+  const { styles } = useStyles(analysisSheet, { status });
+  if (status === "done") {
+    return /* @__PURE__ */ jsx(Icon, { name: "check-circle", size: theme.icon.sm, color: theme.color.good });
+  }
+  if (status === "failed") {
+    return /* @__PURE__ */ jsx(Icon, { name: "alert-circle", size: theme.icon.sm, color: theme.color.danger });
+  }
+  return /* @__PURE__ */ jsx(View, { accessible: false, style: styles.dot });
+}
+function StageRow({ stage, status = "pending" }) {
+  const { styles } = useStyles(analysisSheet, { status });
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      role: "listitem",
+      accessible: true,
+      accessibilityLabel: `${stage.label}, ${status}, runs on ${stage.where}`,
+      testID: `loam-stage-${status}`,
+      style: styles.stageRow,
+      children: [
+        /* @__PURE__ */ jsx(StageDot, { status }),
+        /* @__PURE__ */ jsx(Text, { style: styles.stageLabel, children: stage.label }),
+        /* @__PURE__ */ jsx(StageBadge, { where: stage.where })
+      ]
+    }
+  );
+}
+function defaultTitle(p) {
+  return p.id === "car" ? "Reading six angles" : "Analysing";
+}
+function AnalysisProgress({
+  profile: profileProp,
+  index = 0,
+  title,
+  cancelLabel = "Cancel",
+  onCancel,
+  footer = PIPELINE_FOOTER,
+  announce = true
+}) {
+  const { styles } = useStyles(analysisSheet);
+  const p = profile(profileProp);
+  const pipeline = pipelineFrom(p, index);
+  const heading = title ?? defaultTitle(p);
+  const active = pipeline.index >= 0 ? pipeline.stages[pipeline.index] : void 0;
+  const message = announce ? active ? `${active.stage.label}, runs on ${active.stage.where}` : heading : null;
+  return /* @__PURE__ */ jsxs(Card, { variant: "elevated", style: styles.card, children: [
+    /* @__PURE__ */ jsx(PhaseAnnouncement, { message }),
+    /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: heading }) }) }),
+    /* @__PURE__ */ jsxs(CardContent, { children: [
+      pipeline.stages.length > 0 ? /* @__PURE__ */ jsx(View, { role: "list", style: styles.stageList, children: pipeline.stages.map((s) => /* @__PURE__ */ jsx(StageRow, { stage: s.stage, status: s.status }, s.stage.label)) }) : /* @__PURE__ */ jsx(Text, { style: styles.noPipeline, children: `${p.label} runs no analysis pipeline \u2014 the capture is kept as it is.` }),
+      footer ? /* @__PURE__ */ jsx(Text, { style: styles.footer, children: footer }) : null
+    ] }),
+    onCancel && pipeline.cancellable ? /* @__PURE__ */ jsx(CardFooter, { children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onPress: onCancel, children: cancelLabel }) }) : null
+  ] });
+}
+var analysisSheet = createStyleSheet((theme) => ({
+  sweepRoot: {
+    pointerEvents: "none",
+    position: "absolute",
+    top: theme.space[0],
+    bottom: theme.space[0],
+    left: theme.space[0],
+    right: theme.space[0],
+    overflow: "hidden"
+  },
+  sweepBand: {
+    position: "absolute",
+    left: theme.space[0],
+    right: theme.space[0],
+    top: theme.space[0],
+    height: "25%"
+  },
+  card: {
+    width: "100%",
+    maxWidth: theme.panel.lg
+  },
+  heading: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.title3.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  stageList: {
+    flexDirection: "column"
+  },
+  stageRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[12],
+    paddingVertical: theme.space[6]
+  },
+  dot: {
+    flexGrow: 0,
+    flexShrink: 0,
+    width: theme.space[10],
+    height: theme.space[10],
+    borderRadius: theme.radius.full,
+    variants: {
+      status: {
+        pending: {
+          backgroundColor: theme.color.surface3,
+          borderWidth: theme.borderWidth.strong,
+          borderColor: theme.color.borderStrong
+        },
+        active: { backgroundColor: theme.color.accent },
+        done: {},
+        failed: {}
+      }
+    }
+  },
+  stageLabel: {
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: theme.space[0],
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[13],
+    variants: {
+      status: {
+        pending: { color: theme.color.text3 },
+        active: { color: theme.color.text, fontWeight: theme.fontWeight.semibold },
+        done: { color: theme.color.text },
+        failed: { color: theme.color.text }
+      }
+    }
+  },
+  noPipeline: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[13],
+    color: theme.color.text2
+  },
+  footer: {
+    marginTop: theme.space[12],
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[12],
+    lineHeight: theme.fontSize[12] * theme.lineHeight.relaxed,
+    color: theme.color.text3
+  }
+}));
+function Money({
+  minor,
+  currency,
+  emphasis = false
+}) {
+  const { styles } = useStyles(bodySheet, { emphasis });
+  return /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.money, children: money(minor, currency) });
+}
+function ResultNote({ children }) {
+  const { styles } = useStyles(bodySheet);
+  return /* @__PURE__ */ jsx(Text, { style: styles.note, children });
+}
+function Body({
+  kind,
+  children
+}) {
+  const { styles } = useStyles(bodySheet);
+  return /* @__PURE__ */ jsx(View, { testID: `loam-result-${kind}`, style: styles.body, children });
+}
+function SpeciesResult({
+  result,
+  onPickAlternate,
+  alternatesLabel = "Or possibly"
+}) {
+  const { styles } = useStyles(bodySheet);
+  const { top, alternates, facts } = result;
+  return /* @__PURE__ */ jsxs(Body, { kind: "species", children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.headRow, children: [
+      /* @__PURE__ */ jsxs(View, { style: styles.headText, children: [
+        /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: top.common }),
+        /* @__PURE__ */ jsxs(Text, { style: styles.subheading, children: [
+          /* @__PURE__ */ jsx(Text, { style: styles.italic, children: top.name }),
+          top.family ? ` \xB7 ${top.family}` : ""
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(ConfidenceBadge, { value: top.confidence, size: "md" })
+    ] }),
+    alternates.length > 0 ? /* @__PURE__ */ jsxs(View, { style: styles.group, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.overline, children: alternatesLabel.toUpperCase() }),
+      /* @__PURE__ */ jsx(View, { style: styles.list, children: alternates.map((m) => /* @__PURE__ */ jsx(MatchRow, { match: m, onPick: onPickAlternate }, m.name)) })
+    ] }) : null,
+    facts.length > 0 ? /* @__PURE__ */ jsx(
+      DescriptionList,
+      {
+        layout: "inline",
+        density: "compact",
+        dividers: true,
+        items: facts.map(([term, description]) => ({ term, description }))
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(ResultNote, { children: RESULT_NOTES.species })
+  ] });
+}
+var SEVERITY = {
+  none: { variant: "good", label: "no damage" },
+  minor: { variant: "info", label: "minor" },
+  moderate: { variant: "warn", label: "moderate" }
+};
+function PanelsResult({
+  result,
+  currency = "HUF",
+  estimateLabel = "Estimate"
+}) {
+  const { styles } = useStyles(bodySheet);
+  const { vehicle, findings } = result;
+  const [low, high] = estimateRange(findings);
+  return /* @__PURE__ */ jsxs(Body, { kind: "panels", children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.group, children: [
+      /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: `${vehicle.year} ${vehicle.make} ${vehicle.model}` }),
+      /* @__PURE__ */ jsx(Text, { style: styles.subheading, children: `${vehicle.plate} \xB7 ${vehicle.colour}` }),
+      /* @__PURE__ */ jsx(Text, { style: styles.mono, children: vehicle.vin })
+    ] }),
+    /* @__PURE__ */ jsxs(View, { testID: "loam-estimate", style: styles.estimate, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.overline, children: estimateLabel.toUpperCase() }),
+      /* @__PURE__ */ jsxs(View, { style: styles.estimateRow, children: [
+        /* @__PURE__ */ jsx(Money, { minor: low, currency, emphasis: true }),
+        /* @__PURE__ */ jsx(Text, { style: styles.dash, children: "\u2013" }),
+        /* @__PURE__ */ jsx(Money, { minor: high, currency, emphasis: true })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(View, { style: styles.list, children: findings.map((f) => {
+      const sev = SEVERITY[f.severity];
+      return /* @__PURE__ */ jsxs(View, { style: styles.finding, children: [
+        /* @__PURE__ */ jsxs(View, { style: styles.findingTop, children: [
+          /* @__PURE__ */ jsx(Text, { style: styles.findingPanel, children: f.panel }),
+          /* @__PURE__ */ jsx(Badge, { variant: sev.variant, children: sev.label })
+        ] }),
+        /* @__PURE__ */ jsxs(View, { style: styles.findingBottom, children: [
+          /* @__PURE__ */ jsx(Text, { style: styles.findingDamage, children: f.damage }),
+          /* @__PURE__ */ jsxs(View, { style: styles.findingMeta, children: [
+            /* @__PURE__ */ jsx(Money, { minor: f.cost, currency }),
+            /* @__PURE__ */ jsx(ConfidenceBadge, { value: f.confidence })
+          ] })
+        ] })
+      ] }, f.panel);
+    }) }),
+    /* @__PURE__ */ jsx(ResultNote, { children: RESULT_NOTES.panels })
+  ] });
+}
+function FieldRow({
+  field,
+  onChange
+}) {
+  const theme = useLoamTheme();
+  const { styles } = useStyles(bodySheet, { flagged: fieldFlagged(field) });
+  const flagged = fieldFlagged(field);
+  return /* @__PURE__ */ jsxs(View, { style: styles.group, children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.fieldHead, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.fieldLabel, children: field.key }),
+      /* @__PURE__ */ jsx(ConfidenceBadge, { value: field.confidence })
+    ] }),
+    /* @__PURE__ */ jsx(View, { style: styles.fieldInput, children: /* @__PURE__ */ jsx(
+      Input,
+      {
+        size: "sm",
+        value: field.value,
+        editable: !!onChange,
+        accessibilityLabel: flagged ? `${field.key}, ${FIELD_FLAG_COPY}` : field.key,
+        accessibilityHint: flagged ? FIELD_FLAG_COPY : void 0,
+        onChangeText: (next) => onChange?.(field.key, next)
+      }
+    ) }),
+    flagged ? /* @__PURE__ */ jsxs(View, { style: styles.flagChip, children: [
+      /* @__PURE__ */ jsx(Icon, { name: "alert-triangle", size: theme.icon.xs, color: theme.color.warnOnSoft }),
+      /* @__PURE__ */ jsx(Text, { style: styles.flagText, children: FIELD_FLAG_COPY })
+    ] }) : null
+  ] });
+}
+function FieldsResult({ result, onFieldChange }) {
+  const { styles } = useStyles(bodySheet);
+  return /* @__PURE__ */ jsxs(Body, { kind: "fields", children: [
+    /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: result.doc }),
+    /* @__PURE__ */ jsx(View, { style: styles.fieldList, children: result.fields.map((f) => /* @__PURE__ */ jsx(FieldRow, { field: f, onChange: onFieldChange }, f.key)) }),
+    /* @__PURE__ */ jsx(ResultNote, { children: RESULT_NOTES.fields })
+  ] });
+}
+function CodeResult({
+  result,
+  currency = "HUF",
+  quantity = 1,
+  onQuantityChange,
+  quantityLabel = "Quantity"
+}) {
+  const { styles } = useStyles(bodySheet);
+  const { product, format, value } = result;
+  const mono = [format, value, product?.sku].filter(Boolean).join(" \xB7 ");
+  return /* @__PURE__ */ jsxs(Body, { kind: "code", children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.group, children: [
+      /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: product ? product.name : value }),
+      /* @__PURE__ */ jsx(Text, { style: styles.subheading, children: product ? product.stock : "No product matched this code." })
+    ] }),
+    product ? /* @__PURE__ */ jsx(Money, { minor: product.price, currency, emphasis: true }) : null,
+    onQuantityChange ? /* @__PURE__ */ jsxs(View, { style: styles.quantityRow, children: [
+      /* @__PURE__ */ jsx(
+        Text,
+        {
+          accessible: false,
+          importantForAccessibility: "no-hide-descendants",
+          style: styles.fieldLabel,
+          children: quantityLabel
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Stepper,
+        {
+          value: quantity,
+          min: 1,
+          accessibilityLabel: quantityLabel,
+          onValueChange: onQuantityChange
+        }
+      )
+    ] }) : null,
+    /* @__PURE__ */ jsx(Text, { style: styles.mono, children: mono }),
+    /* @__PURE__ */ jsx(ResultNote, { children: RESULT_NOTES.code })
+  ] });
+}
+function VerdictResult({ result }) {
+  const { styles } = useStyles(bodySheet);
+  return /* @__PURE__ */ jsxs(Body, { kind: "verdict", children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.headRow, children: [
+      /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: result.outcome }),
+      /* @__PURE__ */ jsx(ConfidenceBadge, { value: result.confidence, size: "md", icon: true })
+    ] }),
+    /* @__PURE__ */ jsx(
+      DescriptionList,
+      {
+        layout: "stacked",
+        density: "compact",
+        dividers: true,
+        items: result.lines.map(([term, description]) => ({ term, description }))
+      }
+    ),
+    /* @__PURE__ */ jsx(ResultNote, { children: RESULT_NOTES.verdict })
+  ] });
+}
+var bodySheet = createStyleSheet((theme) => ({
+  body: {
+    flexDirection: "column",
+    gap: theme.space[16]
+  },
+  headRow: {
+    flexDirection: "row",
+    alignItems: "flex-start",
+    justifyContent: "space-between",
+    gap: theme.space[12]
+  },
+  headText: {
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: theme.space[0],
+    flexDirection: "column",
+    gap: theme.space[4]
+  },
+  heading: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.title3.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  subheading: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[13],
+    color: theme.color.text2
+  },
+  italic: {
+    fontStyle: "italic"
+  },
+  mono: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.fontSize[11],
+    color: theme.color.text3
+  },
+  overline: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[10],
+    letterSpacing: theme.tracking.caps,
+    color: theme.color.text3
+  },
+  group: {
+    flexDirection: "column",
+    gap: theme.space[6]
+  },
+  list: {
+    flexDirection: "column",
+    gap: theme.space[6]
+  },
+  fieldList: {
+    flexDirection: "column",
+    gap: theme.space[12]
+  },
+  note: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[12],
+    lineHeight: theme.fontSize[12] * theme.lineHeight.relaxed,
+    color: theme.color.text3
+  },
+  money: {
+    fontFamily: theme.font.sans,
+    fontVariant: ["tabular-nums"],
+    color: theme.color.text,
+    variants: {
+      emphasis: {
+        true: { fontSize: theme.fontSize[20], fontWeight: theme.fontWeight.bold },
+        false: { fontSize: theme.fontSize[13] }
+      }
+    }
+  },
+  estimate: {
+    flexDirection: "column",
+    gap: theme.space[4],
+    padding: theme.space[8],
+    borderRadius: theme.radius.md,
+    backgroundColor: theme.color.surface2,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border
+  },
+  estimateRow: {
+    flexDirection: "row",
+    alignItems: "baseline",
+    flexWrap: "wrap",
+    gap: theme.space[6]
+  },
+  dash: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[15],
+    color: theme.color.text3
+  },
+  finding: {
+    flexDirection: "column",
+    gap: theme.space[6],
+    paddingVertical: theme.space[12],
+    borderBottomWidth: theme.borderWidth.base,
+    borderBottomColor: theme.color.border
+  },
+  findingTop: {
+    flexDirection: "row",
+    alignItems: "flex-start",
+    justifyContent: "space-between",
+    gap: theme.space[12]
+  },
+  findingPanel: {
+    flexShrink: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[13],
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  findingBottom: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: theme.space[12]
+  },
+  findingDamage: {
+    flexShrink: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[13],
+    color: theme.color.text2
+  },
+  findingMeta: {
+    flexGrow: 0,
+    flexShrink: 0,
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[8]
+  },
+  fieldHead: {
+    flexDirection: "row",
+    alignItems: "baseline",
+    justifyContent: "space-between",
+    gap: theme.space[8]
+  },
+  fieldLabel: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[12],
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text2
+  },
+  // A warn *edge*, not a warn fill: the value stays on the field surface its
+  // ink was measured against, and the flag says the rest in words.
+  fieldInput: {
+    borderRadius: theme.ctl.r.sm,
+    variants: {
+      flagged: {
+        true: { borderWidth: theme.borderWidth.base, borderColor: theme.color.warn },
+        false: {}
+      }
+    }
+  },
+  flagChip: {
+    alignSelf: "flex-start",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[4],
+    paddingHorizontal: theme.space[8],
+    paddingVertical: theme.space[2],
+    borderRadius: theme.radius.full,
+    backgroundColor: theme.color.warnSoft,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.edge.warn
+  },
+  flagText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[12],
+    color: theme.color.warnOnSoft
+  },
+  quantityRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: theme.space[12]
+  }
+}));
+function FailureCard({
+  failure: failure$1 = "low_confidence",
+  alternates = [],
+  onRetake,
+  onManualEntry,
+  onPickAlternate,
+  alternatesLabel = "The closest we got",
+  manualLabel = FAILURE_SECONDARY_LABEL,
+  announce = true
+}) {
+  const theme = useLoamTheme();
+  const { styles } = useStyles(failureSheet);
+  const resolved = failure(failure$1);
+  const body = failureBody(resolved.id);
+  const showAlternates = resolved.id === "low_confidence" && alternates.length > 0;
+  return /* @__PURE__ */ jsxs(Card, { variant: "elevated", style: styles.card, children: [
+    /* @__PURE__ */ jsx(PhaseAnnouncement, { message: announce ? `${resolved.label}. ${body}` : null }),
+    /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(View, { style: styles.headRow, children: [
+      /* @__PURE__ */ jsx(View, { accessible: false, style: styles.toneMark, ...decorativeProps(), children: /* @__PURE__ */ jsx(Icon, { name: "alert-triangle", size: theme.icon.sm, color: theme.color.warnOnSoft }) }),
+      /* @__PURE__ */ jsxs(View, { style: styles.headText, children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.heading, children: resolved.label }) }),
+        /* @__PURE__ */ jsx(Text, { style: styles.body, children: body })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs(View, { style: styles.stack, children: [
+      /* @__PURE__ */ jsx(NoteBlock, { title: FAILURE_OFFER_PREFIX, description: resolved.offer }),
+      showAlternates ? /* @__PURE__ */ jsxs(View, { style: styles.group, children: [
+        /* @__PURE__ */ jsx(Text, { style: styles.overline, children: alternatesLabel.toUpperCase() }),
+        /* @__PURE__ */ jsx(View, { style: styles.list, children: alternates.map((m) => /* @__PURE__ */ jsx(MatchRow, { match: m, onPick: onPickAlternate }, m.name)) })
+      ] }) : null
+    ] }) }),
+    /* @__PURE__ */ jsx(CardFooter, { children: /* @__PURE__ */ jsxs(View, { style: styles.actions, children: [
+      /* @__PURE__ */ jsx(View, { style: styles.actionSlot, children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "lg", fullWidth: true, onPress: onManualEntry, children: manualLabel }) }),
+      /* @__PURE__ */ jsx(View, { style: styles.actionSlot, children: /* @__PURE__ */ jsx(Button, { variant: "primary", size: "lg", fullWidth: true, onPress: onRetake, children: failurePrimaryLabel(resolved.id) }) })
+    ] }) })
+  ] });
+}
+var failureSheet = createStyleSheet((theme) => ({
+  card: {
+    width: "100%",
+    maxWidth: theme.panel.lg
+  },
+  headRow: {
+    flexDirection: "row",
+    alignItems: "flex-start",
+    gap: theme.space[12]
+  },
+  toneMark: {
+    flexGrow: 0,
+    flexShrink: 0,
+    width: theme.space[32],
+    height: theme.space[32],
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: theme.radius.full,
+    backgroundColor: theme.color.warnSoft,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.edge.warn
+  },
+  headText: {
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: theme.space[0],
+    flexDirection: "column",
+    gap: theme.space[4]
+  },
+  heading: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.title3.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  body: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[15],
+    lineHeight: theme.fontSize[15] * theme.lineHeight.relaxed,
+    color: theme.color.text2
+  },
+  stack: {
+    flexDirection: "column",
+    gap: theme.space[12]
+  },
+  group: {
+    flexDirection: "column",
+    gap: theme.space[6]
+  },
+  list: {
+    flexDirection: "column",
+    gap: theme.space[6]
+  },
+  overline: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[10],
+    letterSpacing: theme.tracking.caps,
+    color: theme.color.text3
+  },
+  // Shared row when both labels fit, a full-width stack when they do not —
+  // never a label broken across two lines inside its own button.
+  actions: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    alignItems: "center",
+    gap: theme.space[8],
+    width: "100%"
+  },
+  actionSlot: {
+    flexGrow: 1,
+    flexShrink: 0,
+    flexBasis: "auto"
+  }
+}));
+var SCRIM = {
+  captured: "a6",
+  done: "a7",
+  result: "a8",
+  analysing: "a10",
+  failure: "a11",
+  none: null
+};
+function CapturePreview({
+  preview,
+  label = "frozen frame \xB7 placeholder",
+  scrim = "captured",
+  pill = CAPTURED_PILL,
+  tracking,
+  announce = true,
+  children
+}) {
+  const theme = useLoamTheme();
+  const { styles } = useStyles(reviewSheet);
+  const stop = SCRIM[scrim];
+  return /* @__PURE__ */ jsxs(View, { testID: `loam-capture-preview-${scrim}`, style: styles.frozen, children: [
+    /* @__PURE__ */ jsx(PhaseAnnouncement, { message: announce && pill ? pill : null }),
+    preview ?? /* @__PURE__ */ jsx(PlaceholderFeed, { label, drift: false }),
+    stop ? /* @__PURE__ */ jsx(
+      View,
+      {
+        accessible: false,
+        testID: `loam-capture-scrim-${scrim}`,
+        style: [styles.scrim, { backgroundColor: theme.black[stop] }],
+        ...decorativeProps()
+      }
+    ) : null,
+    tracking,
+    pill ? /* @__PURE__ */ jsx(View, { style: styles.pillRow, children: /* @__PURE__ */ jsx(GuidanceChip, { text: pill }) }) : null,
+    children
+  ] });
+}
+function RetakeBar({
+  analyse = true,
+  retakeLabel = "Retake",
+  acceptLabel,
+  onRetake,
+  onAccept
+}) {
+  const theme = useLoamTheme();
+  const { styles } = useStyles(reviewSheet);
+  return /* @__PURE__ */ jsxs(View, { testID: "loam-retake-bar", style: styles.retakeBar, children: [
+    /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: retakeLabel,
+        style: [styles.retakeSlot, styles.glassAction],
+        onPress: onRetake,
+        children: /* @__PURE__ */ jsx(Text, { style: [styles.glassActionLabel, { color: camInk(theme) }], children: retakeLabel })
+      }
+    ),
+    /* @__PURE__ */ jsx(View, { style: styles.acceptSlot, children: /* @__PURE__ */ jsx(Button, { variant: "primary", size: "lg", fullWidth: true, onPress: onAccept, children: acceptLabel ?? (analyse ? "Analyse" : "Use photo") }) })
+  ] });
+}
+var FROZEN_PHASES = [
+  "captured",
+  "analysing",
+  "result",
+  "failure",
+  "done"
+];
+var reviewSheet = createStyleSheet((theme) => ({
+  frozen: {
+    position: "absolute",
+    top: theme.space[0],
+    bottom: theme.space[0],
+    left: theme.space[0],
+    right: theme.space[0],
+    overflow: "hidden"
+  },
+  scrim: {
+    pointerEvents: "none",
+    position: "absolute",
+    top: theme.space[0],
+    bottom: theme.space[0],
+    left: theme.space[0],
+    right: theme.space[0]
+  },
+  pillRow: {
+    pointerEvents: "box-none",
+    position: "absolute",
+    top: theme.space[0],
+    left: theme.space[0],
+    right: theme.space[0],
+    alignItems: "center",
+    padding: theme.space[8]
+  },
+  retakeBar: {
+    width: "100%",
+    flexDirection: "row",
+    flexWrap: "wrap",
+    alignItems: "center",
+    gap: theme.space[8]
+  },
+  // Floored at their labels' widths and the bar wraps, so no label breaks
+  // inside its button; when both fit, accept keeps the 2:1 share.
+  retakeSlot: {
+    flexGrow: 1,
+    flexShrink: 0,
+    flexBasis: "auto"
+  },
+  acceptSlot: {
+    flexGrow: 2,
+    flexShrink: 0,
+    flexBasis: "auto"
+  },
+  glassAction: {
+    height: theme.ctl.lg,
+    alignItems: "center",
+    justifyContent: "center",
+    paddingHorizontal: theme.ctl.px.lg,
+    borderRadius: theme.ctl.r.lg,
+    backgroundColor: theme.black.a12,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.white.a5
+  },
+  glassActionLabel: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.ctl.fs.lg
+  }
+}));
+function ResultCard({
+  result,
+  profile: profileProp,
+  currency = "HUF",
+  quantity = 1,
+  onFieldChange,
+  onPickAlternate,
+  onQuantityChange
+}) {
+  const stamp = typeof profileProp === "string" ? profileProp : profileProp ? profileProp.id : void 0;
+  return /* @__PURE__ */ jsxs(View, { testID: stamp ? `loam-result-profile-${stamp}` : void 0, children: [
+    result.kind === "species" ? /* @__PURE__ */ jsx(SpeciesResult, { result, onPickAlternate }) : null,
+    result.kind === "panels" ? /* @__PURE__ */ jsx(PanelsResult, { result, currency }) : null,
+    result.kind === "fields" ? /* @__PURE__ */ jsx(FieldsResult, { result, onFieldChange }) : null,
+    result.kind === "code" ? /* @__PURE__ */ jsx(
+      CodeResult,
+      {
+        result,
+        currency,
+        quantity,
+        onQuantityChange
+      }
+    ) : null,
+    result.kind === "verdict" ? /* @__PURE__ */ jsx(VerdictResult, { result }) : null
+  ] });
+}
+function ResultSheet({
+  title = "Result",
+  primaryLabel = resultPrimaryLabel("plant"),
+  scanAnotherLabel = "Scan another",
+  onScanAnother,
+  onKeep,
+  onDismiss,
+  autoFocus = true,
+  maxHeight = "82%",
+  dismissRatio = 0.3,
+  grabberLabel = "Dismiss result",
+  children
+}) {
+  const theme = useLoamTheme();
+  const { styles } = useStyles(sheetSheet);
+  const panel = React5.useRef(null);
+  const height = React5.useRef(0);
+  const offset = React5.useRef(new Animated.Value(0)).current;
+  const dismiss = React5.useRef(onDismiss);
+  dismiss.current = onDismiss;
+  const ratio = React5.useRef(dismissRatio);
+  ratio.current = dismissRatio;
+  React5.useLayoutEffect(() => {
+    if (!autoFocus) return;
+    const node = panel.current;
+    if (!node || Platform.OS === "web") return;
+    const tag = findNodeHandle(node);
+    if (tag !== null) AccessibilityInfo.setAccessibilityFocus(tag);
+  }, [autoFocus]);
+  const grabberSlop = Math.max(0, (theme.hit.lg - theme.space[24]) / 2);
+  const pan = React5.useRef(
+    // eslint-disable-next-line loam/no-pan-responder
+    PanResponder.create({
+      onStartShouldSetPanResponder: () => true,
+      onMoveShouldSetPanResponder: (_e, g) => Math.abs(g.dy) > 2,
+      onPanResponderMove: (_e, g) => {
+        if (!dismiss.current) return;
+        offset.setValue(Math.max(0, g.dy));
+      },
+      onPanResponderRelease: (_e, g) => {
+        offset.setValue(0);
+        if (!dismiss.current) return;
+        if (height.current > 0 && Math.max(0, g.dy) > height.current * ratio.current) {
+          dismiss.current();
+        }
+      },
+      onPanResponderTerminate: () => offset.setValue(0)
+    })
+  ).current;
+  return /* @__PURE__ */ jsxs(
+    Animated.View,
+    {
+      ref: panel,
+      role: "dialog",
+      accessibilityViewIsModal: true,
+      accessibilityLabel: title,
+      testID: "loam-result-sheet",
+      onLayout: (e) => {
+        height.current = e.nativeEvent.layout.height;
+      },
+      style: [styles.sheet, { maxHeight, transform: [{ translateY: offset }] }],
+      children: [
+        onDismiss ? /* @__PURE__ */ jsx(
+          Pressable,
+          {
+            accessibilityRole: "button",
+            accessibilityLabel: grabberLabel,
+            testID: "loam-result-grabber",
+            hitSlop: { top: grabberSlop, bottom: grabberSlop },
+            style: styles.grabberHit,
+            onPress: onDismiss,
+            ...pan.panHandlers,
+            children: /* @__PURE__ */ jsx(View, { accessible: false, style: styles.grabber })
+          }
+        ) : /* @__PURE__ */ jsx(View, { accessible: false, style: styles.grabberHit, children: /* @__PURE__ */ jsx(View, { style: styles.grabber }) }),
+        /* @__PURE__ */ jsx(ScrollView, { style: styles.body, contentContainerStyle: styles.bodyContent, children }),
+        /* @__PURE__ */ jsxs(View, { style: styles.actions, children: [
+          /* @__PURE__ */ jsx(View, { style: styles.secondarySlot, children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "lg", fullWidth: true, onPress: onScanAnother, children: scanAnotherLabel }) }),
+          /* @__PURE__ */ jsx(View, { style: styles.primarySlot, children: /* @__PURE__ */ jsx(Button, { variant: "primary", size: "lg", fullWidth: true, onPress: onKeep, children: primaryLabel }) })
+        ] })
+      ]
+    }
+  );
+}
+var sheetSheet = createStyleSheet((theme) => ({
+  sheet: {
+    position: "absolute",
+    left: theme.space[0],
+    right: theme.space[0],
+    bottom: theme.space[0],
+    zIndex: theme.z.modal,
+    flexDirection: "column",
+    overflow: "hidden",
+    borderTopLeftRadius: theme.radius.xl,
+    borderTopRightRadius: theme.radius.xl,
+    borderTopWidth: theme.borderWidth.base,
+    borderTopColor: theme.color.border,
+    backgroundColor: theme.color.surface,
+    ...theme.shadow.lg
+  },
+  grabberHit: {
+    width: "100%",
+    height: theme.space[24],
+    flexGrow: 0,
+    flexShrink: 0,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  grabber: {
+    width: theme.space[36],
+    height: theme.layout.sheetGrabber,
+    borderRadius: theme.radius.full,
+    backgroundColor: theme.color.text3
+  },
+  body: {
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: theme.space[0]
+  },
+  bodyContent: {
+    paddingHorizontal: theme.space[16],
+    paddingBottom: theme.space[12]
+  },
+  actions: {
+    flexGrow: 0,
+    flexShrink: 0,
+    flexDirection: "row",
+    flexWrap: "wrap",
+    alignItems: "center",
+    gap: theme.space[8],
+    paddingHorizontal: theme.space[16],
+    paddingVertical: theme.space[12],
+    borderTopWidth: theme.borderWidth.base,
+    borderTopColor: theme.color.border
+  },
+  // Both slots are floored at their own label's width and the row wraps, so a
+  // label never breaks inside its button ("Save to collection" did at 140pt);
+  // when both fit, the primary still takes two thirds of the spare width.
+  secondarySlot: {
+    flexGrow: 1,
+    flexShrink: 0,
+    flexBasis: "auto"
+  },
+  primarySlot: {
+    flexGrow: 2,
+    flexShrink: 0,
+    flexBasis: "auto"
+  }
+}));
+
+export { AnalysisProgress, CapturePreview, CodeResult, FROZEN_PHASES, FailureCard, FieldsResult, PanelsResult, ResultCard, ResultSheet, RetakeBar, ScanSweep, SpeciesResult, StageBadge, StageRow, VerdictResult };