@userflow-tech/react-native 0.1.1 → 0.3.0

package/lib/module/authoring/chrome/ChromeTopBar.js

@@ -0,0 +1,117 @@
+"use strict";
+
+import * as React from 'react';
+import { Image, StyleSheet, Text, View } from 'react-native';
+import { useUserflowSafeAreaInsets } from "../../surfaces/safeArea.js";
+import { ChromeIcon } from "./ChromeIcon.js";
+import logomark from './icons/userflow-logomark.png';
+import { chromeColors, chromeShadows, chromeSpace, chromeText } from "./tokens.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Full-bleed authoring top bar. Height comes from safe-area + content, not
+ * the Figma frame (that number already includes the status bar).
+ *
+ * On the Pro Max reference the 16pt label starts 13pt below the status bar
+ * and ends 24pt above the bottom edge. The 40pt controls are taller than
+ * that label, so the outer padding is what remains after centering them.
+ */
+export function ChromeTopBar({
+  label,
+  tone = 'default',
+  icon,
+  left,
+  right,
+  onMeasureHeight,
+  numberOfLines = 1,
+  accessibilityElementsHidden,
+  importantForAccessibility,
+  testID = 'userflow-chrome-top-bar'
+}) {
+  const insets = useUserflowSafeAreaInsets();
+  const onLayout = React.useCallback(event => {
+    onMeasureHeight?.(event.nativeEvent.layout.height);
+  }, [onMeasureHeight]);
+  return /*#__PURE__*/_jsx(View, {
+    accessibilityElementsHidden: accessibilityElementsHidden,
+    importantForAccessibility: importantForAccessibility,
+    testID: testID,
+    onLayout: onLayout,
+    style: [styles.bar, chromeShadows.card, {
+      backgroundColor: tone === 'error' ? chromeColors.danger : chromeColors.primaryText,
+      paddingTop: insets.top + CONTENT_TOP_GAP
+    }],
+    children: /*#__PURE__*/_jsxs(View, {
+      style: styles.row,
+      children: [/*#__PURE__*/_jsx(View, {
+        style: styles.slot,
+        children: left
+      }), /*#__PURE__*/_jsxs(View, {
+        style: styles.labelRow,
+        pointerEvents: "none",
+        children: [icon ? /*#__PURE__*/_jsx(ChromeIcon, {
+          name: icon.name,
+          size: 16,
+          testID: "userflow-chrome-top-bar-icon",
+          tintColor: icon.tintColor
+        }) : /*#__PURE__*/_jsx(Image, {
+          accessibilityIgnoresInvertColors: true,
+          source: logomark,
+          style: styles.logomark,
+          testID: "userflow-chrome-logomark"
+        }), /*#__PURE__*/_jsx(Text, {
+          numberOfLines: numberOfLines,
+          style: [chromeText.labelSmBold, styles.label],
+          children: label
+        })]
+      }), /*#__PURE__*/_jsx(View, {
+        style: styles.slot,
+        children: right
+      })]
+    })
+  });
+}
+const SLOT = 40;
+/** Figma: 13pt from the status-bar inset to the 16pt label, 24pt below it. */
+const LABEL_LINE_HEIGHT = 16;
+const LABEL_GAP_BELOW_STATUS_BAR = 13;
+const LABEL_GAP_ABOVE_BAR_EDGE = 24;
+const SLOT_SLACK = (SLOT - LABEL_LINE_HEIGHT) / 2;
+const CONTENT_TOP_GAP = LABEL_GAP_BELOW_STATUS_BAR - SLOT_SLACK;
+const CONTENT_BOTTOM_GAP = LABEL_GAP_ABOVE_BAR_EDGE - SLOT_SLACK;
+const styles = StyleSheet.create({
+  bar: {
+    paddingHorizontal: chromeSpace[24],
+    paddingBottom: CONTENT_BOTTOM_GAP
+  },
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    minHeight: SLOT
+  },
+  slot: {
+    width: SLOT,
+    height: SLOT,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  labelRow: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: chromeSpace[8],
+    paddingHorizontal: chromeSpace[8]
+  },
+  label: {
+    color: chromeColors.invertedText,
+    textAlign: 'center',
+    flexShrink: 1
+  },
+  logomark: {
+    // Figma `Warstwa_1` stacked-card mark. Not the Made-with-Userflow footer glyph.
+    width: 16,
+    height: 15,
+    tintColor: chromeColors.invertedText
+  }
+});
+//# sourceMappingURL=ChromeTopBar.js.map

package/lib/module/authoring/chrome/ChromeTopBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Image","StyleSheet","Text","View","useUserflowSafeAreaInsets","ChromeIcon","logomark","chromeColors","chromeShadows","chromeSpace","chromeText","jsx","_jsx","jsxs","_jsxs","ChromeTopBar","label","tone","icon","left","right","onMeasureHeight","numberOfLines","accessibilityElementsHidden","importantForAccessibility","testID","insets","onLayout","useCallback","event","nativeEvent","layout","height","style","styles","bar","card","backgroundColor","danger","primaryText","paddingTop","top","CONTENT_TOP_GAP","children","row","slot","labelRow","pointerEvents","name","size","tintColor","accessibilityIgnoresInvertColors","source","labelSmBold","SLOT","LABEL_LINE_HEIGHT","LABEL_GAP_BELOW_STATUS_BAR","LABEL_GAP_ABOVE_BAR_EDGE","SLOT_SLACK","CONTENT_BOTTOM_GAP","create","paddingHorizontal","paddingBottom","flexDirection","alignItems","minHeight","width","justifyContent","flex","gap","color","invertedText","textAlign","flexShrink"],"sourceRoot":"../../../../src","sources":["authoring/chrome/ChromeTopBar.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/authoring/chrome/DoubleTapBridge.js

@@ -0,0 +1,59 @@
+"use strict";
+
+import * as React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { changedTouchPoints, forEachChangedTouch } from "../../runtime/changedTouchPoints.js";
+import { isolateSync } from "../../runtime/isolateCall.js";
+import { doubleTapMonitor } from "./doubleTapMonitor.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Observes screen-wide touches for {@link doubleTapMonitor} without claiming
+ * the responder. Must wrap **both** host app content and authoring chrome —
+ * preview-bar taps never bubble through `TargetPressBridge`, which only
+ * wraps the app tree.
+ */
+export function DoubleTapBridge({
+  children
+}) {
+  const onTouchStart = React.useCallback(event => {
+    isolateSync('double-tap', () => {
+      forEachChangedTouch(event, (identifier, pageX, pageY) => {
+        doubleTapMonitor.handleTouchStart(identifier, pageX, pageY);
+      });
+    });
+  }, []);
+  const onTouchEnd = React.useCallback(event => {
+    isolateSync('double-tap', () => {
+      forEachChangedTouch(event, (identifier, pageX, pageY) => {
+        doubleTapMonitor.handleTouchEnd(identifier, pageX, pageY);
+      });
+    });
+  }, []);
+  const onTouchCancel = React.useCallback(event => {
+    isolateSync('double-tap', () => {
+      const points = changedTouchPoints(event);
+      if (points.length === 0) {
+        doubleTapMonitor.cancelTouch();
+        return;
+      }
+      for (const touch of points) {
+        doubleTapMonitor.cancelTouch(touch.identifier);
+      }
+    });
+  }, []);
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.root,
+    collapsable: false,
+    onTouchStart: onTouchStart,
+    onTouchEnd: onTouchEnd,
+    onTouchCancel: onTouchCancel,
+    testID: "userflow-double-tap-bridge",
+    children: children
+  });
+}
+const styles = StyleSheet.create({
+  root: {
+    flex: 1
+  }
+});
+//# sourceMappingURL=DoubleTapBridge.js.map

package/lib/module/authoring/chrome/DoubleTapBridge.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","changedTouchPoints","forEachChangedTouch","isolateSync","doubleTapMonitor","jsx","_jsx","DoubleTapBridge","children","onTouchStart","useCallback","event","identifier","pageX","pageY","handleTouchStart","onTouchEnd","handleTouchEnd","onTouchCancel","points","length","cancelTouch","touch","style","styles","root","collapsable","testID","create","flex"],"sourceRoot":"../../../../src","sources":["authoring/chrome/DoubleTapBridge.tsx"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,EAAEC,IAAI,QAAoC,cAAc;AAE3E,SAASC,kBAAkB,EAAEC,mBAAmB,QAAQ,qCAAkC;AAC1F,SAASC,WAAW,QAAQ,8BAA2B;AAEvD,SAASC,gBAAgB,QAAQ,uBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAMtD;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAAC;EAAEC;AAA+B,CAAC,EAAsB;EACtF,MAAMC,YAAY,GAAGX,KAAK,CAACY,WAAW,CAAEC,KAA4B,IAAK;IACvER,WAAW,CAAC,YAAY,EAAE,MAAM;MAC9BD,mBAAmB,CAACS,KAAK,EAAE,CAACC,UAAU,EAAEC,KAAK,EAAEC,KAAK,KAAK;QACvDV,gBAAgB,CAACW,gBAAgB,CAACH,UAAU,EAAEC,KAAK,EAAEC,KAAK,CAAC;MAC7D,CAAC,CAAC;IACJ,CAAC,CAAC;EACJ,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,UAAU,GAAGlB,KAAK,CAACY,WAAW,CAAEC,KAA4B,IAAK;IACrER,WAAW,CAAC,YAAY,EAAE,MAAM;MAC9BD,mBAAmB,CAACS,KAAK,EAAE,CAACC,UAAU,EAAEC,KAAK,EAAEC,KAAK,KAAK;QACvDV,gBAAgB,CAACa,cAAc,CAACL,UAAU,EAAEC,KAAK,EAAEC,KAAK,CAAC;MAC3D,CAAC,CAAC;IACJ,CAAC,CAAC;EACJ,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMI,aAAa,GAAGpB,KAAK,CAACY,WAAW,CAAEC,KAA4B,IAAK;IACxER,WAAW,CAAC,YAAY,EAAE,MAAM;MAC9B,MAAMgB,MAAM,GAAGlB,kBAAkB,CAACU,KAAK,CAAC;MACxC,IAAIQ,MAAM,CAACC,MAAM,KAAK,CAAC,EAAE;QACvBhB,gBAAgB,CAACiB,WAAW,CAAC,CAAC;QAC9B;MACF;MACA,KAAK,MAAMC,KAAK,IAAIH,MAAM,EAAE;QAC1Bf,gBAAgB,CAACiB,WAAW,CAACC,KAAK,CAACV,UAAU,CAAC;MAChD;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEN,IAAA,CAACN,IAAI;IACHuB,KAAK,EAAEC,MAAM,CAACC,IAAK;IACnBC,WAAW,EAAE,KAAM;IACnBjB,YAAY,EAAEA,YAAa;IAC3BO,UAAU,EAAEA,UAAW;IACvBE,aAAa,EAAEA,aAAc;IAC7BS,MAAM,EAAC,4BAA4B;IAAAnB,QAAA,EAElCA;EAAQ,CACL,CAAC;AAEX;AAEA,MAAMgB,MAAM,GAAGzB,UAAU,CAAC6B,MAAM,CAAC;EAC/BH,IAAI,EAAE;IACJI,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/authoring/chrome/doubleTapMonitor.js

@@ -0,0 +1,85 @@
+"use strict";
+
+import { TARGET_PRESS_TAP_SLOP } from "../../anchors/targetPressMonitor.js";
+import { isDoubleTap } from "../doubleTap.js";
+/**
+ * Screen-wide double-tap observer. Never claims the responder — the host app
+ * keeps scrolling and tapping. Used by preview-mode chrome, which has no
+ * capture layer of its own.
+ *
+ * Distinct from `targetPressMonitor`: that singleton is bound to a tooltip
+ * target rect and fires `onPress`, not a double-tap toggle.
+ */
+export class DoubleTapMonitor {
+  subscription = null;
+  touchStarts = new Map();
+  lastTap = null;
+  set(subscription) {
+    this.subscription = subscription;
+    if (!subscription) {
+      this.touchStarts.clear();
+      this.lastTap = null;
+    }
+  }
+
+  /**
+   * Drop `subscription` only when it is still the active one. A later owner
+   * (preview bar after the picker leaves navigate mode) must survive cleanup.
+   */
+  clearIfCurrent(subscription) {
+    if (this.subscription === subscription) {
+      this.set(null);
+    }
+  }
+  handleTouchStart(identifier, pageX, pageY) {
+    if (!this.subscription) {
+      this.touchStarts.clear();
+      return;
+    }
+    this.touchStarts.set(identifier, {
+      pageX,
+      pageY
+    });
+  }
+  handleTouchEnd(identifier, pageX, pageY) {
+    const start = this.touchStarts.get(identifier) ?? null;
+    this.touchStarts.delete(identifier);
+    const sub = this.subscription;
+    if (!start || !sub) return;
+    const dx = pageX - start.pageX;
+    const dy = pageY - start.pageY;
+    if (dx * dx + dy * dy > TARGET_PRESS_TAP_SLOP * TARGET_PRESS_TAP_SLOP) {
+      this.lastTap = null;
+      return;
+    }
+    const sample = {
+      pageX,
+      pageY,
+      timestamp: Date.now()
+    };
+    if (isDoubleTap(this.lastTap, sample)) {
+      this.lastTap = null;
+      sub.onDoubleTap();
+      return;
+    }
+    this.lastTap = sample;
+  }
+  cancelTouch(identifier) {
+    if (identifier == null) {
+      this.touchStarts.clear();
+      return;
+    }
+    this.touchStarts.delete(identifier);
+  }
+
+  /** Test helper. */
+  resetForTests() {
+    this.subscription = null;
+    this.touchStarts.clear();
+    this.lastTap = null;
+  }
+}
+
+/** Shared singleton used by PreviewModeBanner and DoubleTapBridge. */
+export const doubleTapMonitor = new DoubleTapMonitor();
+//# sourceMappingURL=doubleTapMonitor.js.map

package/lib/module/authoring/chrome/doubleTapMonitor.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["TARGET_PRESS_TAP_SLOP","isDoubleTap","DoubleTapMonitor","subscription","touchStarts","Map","lastTap","set","clear","clearIfCurrent","handleTouchStart","identifier","pageX","pageY","handleTouchEnd","start","get","delete","sub","dx","dy","sample","timestamp","Date","now","onDoubleTap","cancelTouch","resetForTests","doubleTapMonitor"],"sourceRoot":"../../../../src","sources":["authoring/chrome/doubleTapMonitor.ts"],"mappings":";;AAAA,SACEA,qBAAqB,QAGhB,qCAAkC;AACzC,SAASC,WAAW,QAAwB,iBAAc;AAM1D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,gBAAgB,CAAC;EACpBC,YAAY,GAAiC,IAAI;EACjDC,WAAW,GAAG,IAAIC,GAAG,CAA8B,CAAC;EACpDC,OAAO,GAAqB,IAAI;EAExCC,GAAGA,CAACJ,YAA0C,EAAQ;IACpD,IAAI,CAACA,YAAY,GAAGA,YAAY;IAChC,IAAI,CAACA,YAAY,EAAE;MACjB,IAAI,CAACC,WAAW,CAACI,KAAK,CAAC,CAAC;MACxB,IAAI,CAACF,OAAO,GAAG,IAAI;IACrB;EACF;;EAEA;AACF;AACA;AACA;EACEG,cAAcA,CAACN,YAAmC,EAAQ;IACxD,IAAI,IAAI,CAACA,YAAY,KAAKA,YAAY,EAAE;MACtC,IAAI,CAACI,GAAG,CAAC,IAAI,CAAC;IAChB;EACF;EAEAG,gBAAgBA,CAACC,UAA2B,EAAEC,KAAa,EAAEC,KAAa,EAAQ;IAChF,IAAI,CAAC,IAAI,CAACV,YAAY,EAAE;MACtB,IAAI,CAACC,WAAW,CAACI,KAAK,CAAC,CAAC;MACxB;IACF;IACA,IAAI,CAACJ,WAAW,CAACG,GAAG,CAACI,UAAU,EAAE;MAAEC,KAAK;MAAEC;IAAM,CAAC,CAAC;EACpD;EAEAC,cAAcA,CAACH,UAA2B,EAAEC,KAAa,EAAEC,KAAa,EAAQ;IAC9E,MAAME,KAAK,GAAG,IAAI,CAACX,WAAW,CAACY,GAAG,CAACL,UAAU,CAAC,IAAI,IAAI;IACtD,IAAI,CAACP,WAAW,CAACa,MAAM,CAACN,UAAU,CAAC;IACnC,MAAMO,GAAG,GAAG,IAAI,CAACf,YAAY;IAC7B,IAAI,CAACY,KAAK,IAAI,CAACG,GAAG,EAAE;IAEpB,MAAMC,EAAE,GAAGP,KAAK,GAAGG,KAAK,CAACH,KAAK;IAC9B,MAAMQ,EAAE,GAAGP,KAAK,GAAGE,KAAK,CAACF,KAAK;IAC9B,IAAIM,EAAE,GAAGA,EAAE,GAAGC,EAAE,GAAGA,EAAE,GAAGpB,qBAAqB,GAAGA,qBAAqB,EAAE;MACrE,IAAI,CAACM,OAAO,GAAG,IAAI;MACnB;IACF;IAEA,MAAMe,MAAiB,GAAG;MAAET,KAAK;MAAEC,KAAK;MAAES,SAAS,EAAEC,IAAI,CAACC,GAAG,CAAC;IAAE,CAAC;IACjE,IAAIvB,WAAW,CAAC,IAAI,CAACK,OAAO,EAAEe,MAAM,CAAC,EAAE;MACrC,IAAI,CAACf,OAAO,GAAG,IAAI;MACnBY,GAAG,CAACO,WAAW,CAAC,CAAC;MACjB;IACF;IACA,IAAI,CAACnB,OAAO,GAAGe,MAAM;EACvB;EAEAK,WAAWA,CAACf,UAA4B,EAAQ;IAC9C,IAAIA,UAAU,IAAI,IAAI,EAAE;MACtB,IAAI,CAACP,WAAW,CAACI,KAAK,CAAC,CAAC;MACxB;IACF;IACA,IAAI,CAACJ,WAAW,CAACa,MAAM,CAACN,UAAU,CAAC;EACrC;;EAEA;EACAgB,aAAaA,CAAA,EAAS;IACpB,IAAI,CAACxB,YAAY,GAAG,IAAI;IACxB,IAAI,CAACC,WAAW,CAACI,KAAK,CAAC,CAAC;IACxB,IAAI,CAACF,OAAO,GAAG,IAAI;EACrB;AACF;;AAEA;AACA,OAAO,MAAMsB,gBAAgB,GAAG,IAAI1B,gBAAgB,CAAC,CAAC","ignoreList":[]}

package/lib/module/authoring/chrome/tokens.js

@@ -0,0 +1,147 @@
+"use strict";
+
+/**
+ * Authoring-chrome tokens from the Userflow React Native Figma file
+ * (`BojC6qdlFUytdD1bRsNLV8`). These are independent of end-user flow
+ * `ThemeFragment` — pairing / picker UI is not themed by the server.
+ *
+ * Typography omits `fontFamily` so RN uses SF Pro / Roboto.
+ */
+
+export const chromeColors = {
+  primaryText: '#132b39',
+  invertedText: '#ffffff',
+  blue500: '#1a57e6',
+  overlay: 'rgba(0, 0, 0, 0.2)',
+  /** Figma Colors/Effect/Focus Ring (`#2f69ee59`). */
+  focusRing: 'rgba(47, 105, 238, 0.35)',
+  bgMiddle: '#f4f8fb',
+  danger: '#57000e',
+  /** Figma Colors/Accent/Warning (`#f0c000`). */
+  warningAccent: '#f0c000',
+  /** Figma Colors/Accent/Danger (`#eb1e47`). */
+  dangerAccent: '#eb1e47',
+  /** Figma Primitive Colors/Gray/150 — disabled primary pill. */
+  disabledFill: '#c3d5e0',
+  white: '#ffffff',
+  /** Figma Shadow/Button. Opacity is applied in `chromeShadows`. */
+  shadowButton: 'rgb(54, 107, 214)'
+};
+
+/**
+ * `chromeColors.overlay` split for TooltipCutout's composite-once contract
+ * (`backdropColor` + `backdropOpacity` rather than a single rgba string).
+ */
+export const chromeOverlay = {
+  color: '#000000',
+  opacity: 0.2
+};
+export const chromeSpace = {
+  0: 0,
+  8: 8,
+  12: 12,
+  16: 16,
+  20: 20,
+  24: 24
+};
+export const chromeRadius = {
+  md: 4,
+  lg: 8,
+  fullyRounded: 9999
+};
+export const chromeText = {
+  buttonLabel: {
+    fontSize: 16,
+    fontWeight: '600',
+    lineHeight: 20
+  },
+  /** Figma Labels/SM Bold — header title and bottom-sheet helper copy. */
+  labelSmBold: {
+    fontSize: 14,
+    fontWeight: '600',
+    lineHeight: 16
+  },
+  dialogTitle: {
+    fontSize: 18,
+    fontWeight: '500',
+    lineHeight: 24
+  },
+  dialogBody: {
+    fontSize: 16,
+    fontWeight: '400',
+    lineHeight: 24
+  },
+  tooltip: {
+    fontSize: 14,
+    fontWeight: '500',
+    lineHeight: 16
+  }
+};
+
+/**
+ * Figma drop shadows approximated as RN `shadow*` + Android `elevation`.
+ * There is no shared chrome shadow helper — TooltipBubble's elevation pairing
+ * is tooltip-specific and is not reused here.
+ */
+export const chromeShadows = {
+  /** Shadow/Button — primary pill. */
+  button: {
+    shadowColor: chromeColors.shadowButton,
+    shadowOffset: {
+      width: 0,
+      height: 4
+    },
+    shadowOpacity: 0.5,
+    shadowRadius: 8,
+    elevation: 4
+  },
+  /** Shadow/Button (Subtle) — secondary / icon pills. */
+  buttonSubtle: {
+    shadowColor: chromeColors.shadowButton,
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.5,
+    shadowRadius: 4,
+    elevation: 2
+  },
+  /** Shadow/Card — full-bleed top/bottom bars. */
+  card: {
+    shadowColor: chromeColors.primaryText,
+    shadowOffset: {
+      width: 0,
+      height: 4
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 12,
+    elevation: 8
+  },
+  /** Shadow/Default (Subtle) — onboarding tooltip. */
+  tooltip: {
+    shadowColor: chromeColors.primaryText,
+    shadowOffset: {
+      width: 0,
+      height: 4
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 12,
+    elevation: 4
+  },
+  /**
+   * Dialog card. Carries the values ChromeDialog shipped with (shadowRadius 6 /
+   * elevation 6). Figma names this Shadow/Default (Subtle) — the same token as
+   * `tooltip` — but the radius-convention audit across chrome shadows is Phase 6.
+   */
+  dialog: {
+    shadowColor: chromeColors.primaryText,
+    shadowOffset: {
+      width: 0,
+      height: 4
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 6,
+    elevation: 6
+  }
+};
+//# sourceMappingURL=tokens.js.map

package/lib/module/authoring/chrome/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["chromeColors","primaryText","invertedText","blue500","overlay","focusRing","bgMiddle","danger","warningAccent","dangerAccent","disabledFill","white","shadowButton","chromeOverlay","color","opacity","chromeSpace","chromeRadius","md","lg","fullyRounded","chromeText","buttonLabel","fontSize","fontWeight","lineHeight","labelSmBold","dialogTitle","dialogBody","tooltip","chromeShadows","button","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","buttonSubtle","card","dialog"],"sourceRoot":"../../../../src","sources":["authoring/chrome/tokens.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/authoring/doubleTap.js

@@ -0,0 +1,18 @@
+"use strict";
+
+export const DOUBLE_TAP_WINDOW_MS = 300;
+export const DOUBLE_TAP_SLOP = 40;
+/**
+ * True when `next` lands close enough in space and time to `prev` to count as
+ * the second half of a double tap. Inclusive on both the time window and slop
+ * so a tap at exactly the boundary still toggles chrome rather than selecting.
+ */
+export function isDoubleTap(prev, next, windowMs = DOUBLE_TAP_WINDOW_MS, slop = DOUBLE_TAP_SLOP) {
+  if (prev == null) return false;
+  const dt = next.timestamp - prev.timestamp;
+  if (dt < 0 || dt > windowMs) return false;
+  const dx = next.pageX - prev.pageX;
+  const dy = next.pageY - prev.pageY;
+  return dx * dx + dy * dy <= slop * slop;
+}
+//# sourceMappingURL=doubleTap.js.map

package/lib/module/authoring/doubleTap.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DOUBLE_TAP_WINDOW_MS","DOUBLE_TAP_SLOP","isDoubleTap","prev","next","windowMs","slop","dt","timestamp","dx","pageX","dy","pageY"],"sourceRoot":"../../../src","sources":["authoring/doubleTap.ts"],"mappings":";;AAAA,OAAO,MAAMA,oBAAoB,GAAG,GAAG;AACvC,OAAO,MAAMC,eAAe,GAAG,EAAE;AAQjC;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,WAAWA,CACzBC,IAAsB,EACtBC,IAAe,EACfC,QAAgB,GAAGL,oBAAoB,EACvCM,IAAY,GAAGL,eAAe,EACrB;EACT,IAAIE,IAAI,IAAI,IAAI,EAAE,OAAO,KAAK;EAC9B,MAAMI,EAAE,GAAGH,IAAI,CAACI,SAAS,GAAGL,IAAI,CAACK,SAAS;EAC1C,IAAID,EAAE,GAAG,CAAC,IAAIA,EAAE,GAAGF,QAAQ,EAAE,OAAO,KAAK;EACzC,MAAMI,EAAE,GAAGL,IAAI,CAACM,KAAK,GAAGP,IAAI,CAACO,KAAK;EAClC,MAAMC,EAAE,GAAGP,IAAI,CAACQ,KAAK,GAAGT,IAAI,CAACS,KAAK;EAClC,OAAOH,EAAE,GAAGA,EAAE,GAAGE,EAAE,GAAGA,EAAE,IAAIL,IAAI,GAAGA,IAAI;AACzC","ignoreList":[]}

package/lib/module/authoring/elementPickerController.js

@@ -0,0 +1,97 @@
+"use strict";
+
+const IDLE = {
+  active: false
+};
+/**
+ * Module singleton for the in-app element picker. Pairing glue (and the QA
+ * harness) call {@link beginSelection}; {@link ElementPickerOverlay} reads
+ * state and commits/cancels.
+ */
+export class ElementPickerController {
+  request = null;
+  nextId = 1;
+  listeners = new Set();
+  getState() {
+    if (!this.request) return {
+      ...IDLE
+    };
+    return {
+      active: true,
+      requestId: this.request.requestId,
+      ...(this.request.elementType != null ? {
+        elementType: this.request.elementType
+      } : {})
+    };
+  }
+  subscribe(listener) {
+    this.listeners.add(listener);
+    listener(this.getState());
+    return () => {
+      this.listeners.delete(listener);
+    };
+  }
+  beginSelection(request) {
+    if (this.request) {
+      this.request.onCancel?.();
+    }
+    const requestId = request.requestId ?? `pick-${this.nextId++}`;
+    this.request = {
+      ...request,
+      requestId
+    };
+    this.emit();
+  }
+
+  /**
+   * Deliver `result` to the active request. When `expectedId` is passed, a
+   * mismatch (stale Confirm after a newer `beginSelection`) is a no-op.
+   * Omitting `expectedId` is for synchronous tests/QA.
+   *
+   * If `onResult` returns a rejected promise (e.g. relay not connected), the
+   * request stays active so the overlay can retry. Ack timeouts should be
+   * swallowed by the caller of `onResult`, not thrown here.
+   */
+  async commit(result, expectedId) {
+    const req = this.request;
+    if (!req) return false;
+    if (expectedId != null && req.requestId !== expectedId) return false;
+    try {
+      await req.onResult(result);
+    } catch {
+      return this.request === req ? false : true;
+    }
+    if (this.request !== req) return true;
+    this.request = null;
+    this.emit();
+    return true;
+  }
+  cancel() {
+    const req = this.request;
+    this.request = null;
+    this.emit();
+    if (!req) return;
+    try {
+      req.onCancel?.();
+    } catch {
+      // Authoring callbacks must not break the host.
+    }
+  }
+  resetForTests() {
+    this.request = null;
+    this.nextId = 1;
+    this.listeners.clear();
+  }
+  emit() {
+    const state = this.getState();
+    for (const listener of this.listeners) {
+      try {
+        listener(state);
+      } catch {
+        // listeners are infrastructure
+      }
+    }
+  }
+}
+export const elementPickerController = new ElementPickerController();
+//# sourceMappingURL=elementPickerController.js.map

package/lib/module/authoring/elementPickerController.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["IDLE","active","ElementPickerController","request","nextId","listeners","Set","getState","requestId","elementType","subscribe","listener","add","delete","beginSelection","onCancel","emit","commit","result","expectedId","req","onResult","cancel","resetForTests","clear","state","elementPickerController"],"sourceRoot":"../../../src","sources":["authoring/elementPickerController.ts"],"mappings":"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","ignoreList":[]}