@userflow-tech/react-native 0.1.0

package/lib/commonjs/surfaces/ModalSurface.js

@@ -0,0 +1,170 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ModalSurface = ModalSurface;
+var React = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _RichContentRenderer = require("../content/RichContentRenderer.js");
+var _CloseButton = require("./CloseButton.js");
+var _resolveCloseButtonColor = require("./resolveCloseButtonColor.js");
+var _MadeWithUserflow = require("./MadeWithUserflow.js");
+var _ProgressBar = require("./ProgressBar.js");
+var _absoluteFill = require("./absoluteFill.js");
+var _parseBackdropOpacity = require("./parseBackdropOpacity.js");
+var _progress = require("./progress.js");
+var _safeArea = require("./safeArea.js");
+var _resolveModalLayout = require("./resolveModalLayout.js");
+var _themeChrome = require("./themeChrome.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * Modal chrome: full-screen backdrop + centered themed card with TreeDoc body.
+ * Also used as a temporary fallback for BUBBLE/HIDDEN until dedicated surfaces.
+ *
+ * Touch model: backdrop is a full-screen Pressable; the centering wrapper is
+ * `box-none` so taps outside the card hit the backdrop, while the card itself
+ * uses default `auto` pointer events so children (buttons, scroll) keep working.
+ * Do not put `onStartShouldSetResponder` on the card — it steals touches from
+ * nested Pressables.
+ */
+function ModalSurface({
+  engine,
+  session,
+  currentStep,
+  theme,
+  lookupAttribute
+}) {
+  const version = session.version;
+  const chrome = (0, _themeChrome.resolveBubbleChrome)(theme, 'modal');
+  const progress = (0, _progress.resolveStepProgress)(version, currentStep.id);
+  const showClose = !version.closeDisabled;
+  const backdropOpacity = (0, _parseBackdropOpacity.parseBackdropOpacity)(theme.backdropOpacity);
+  const canDismissBackdrop = theme.modalBackdropOnclick === 'DISMISS' && showClose;
+  const endAsUserClosed = React.useCallback(() => {
+    void engine.endFlow('USER_CLOSED');
+  }, [engine]);
+  const insets = (0, _safeArea.useUserflowSafeAreaInsets)();
+  const windowDims = (0, _reactNative.useWindowDimensions)();
+  const centerPadding = (0, _resolveModalLayout.resolveModalCenterPadding)(insets);
+  const cardMaxWidth = (0, _resolveModalLayout.resolveModalCardMaxWidth)(theme, currentStep.width, windowDims.width);
+  const cardMaxHeight = (0, _resolveModalLayout.resolveModalCardMaxHeight)(windowDims.height, centerPadding);
+  const buttonsAlign = (0, _resolveModalLayout.resolveModalButtonsAlign)(theme, windowDims.width);
+  const progressTop = theme.progressBarEnabled && theme.progressBarPosition === 'TOP';
+  const progressBottom = theme.progressBarEnabled && theme.progressBarPosition === 'BOTTOM';
+  const showBranding = session.flow.company.flowBranding;
+  const contentPadding = chrome.contentPadding;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: styles.root,
+    testID: "userflow-modal-surface",
+    pointerEvents: "box-none",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+      testID: "userflow-modal-backdrop",
+      accessibilityRole: canDismissBackdrop ? 'button' : 'none',
+      accessibilityLabel: canDismissBackdrop ? 'Dismiss' : undefined,
+      accessibilityElementsHidden: !canDismissBackdrop,
+      importantForAccessibility: canDismissBackdrop ? 'yes' : 'no-hide-descendants',
+      disabled: !canDismissBackdrop,
+      onPress: canDismissBackdrop ? endAsUserClosed : undefined,
+      style: [_absoluteFill.ABSOLUTE_FILL, {
+        backgroundColor: theme.backdropColor,
+        opacity: backdropOpacity
+      }]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.center, centerPadding],
+      pointerEvents: "box-none",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        testID: "userflow-modal-card",
+        accessibilityViewIsModal: true,
+        pointerEvents: "auto",
+        style: [chrome.cardStyle, styles.cardShadow, {
+          maxWidth: cardMaxWidth,
+          maxHeight: cardMaxHeight,
+          width: '100%',
+          borderRadius: chrome.borderRadius
+        }],
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          testID: "userflow-modal-card-fill",
+          style: [chrome.fillStyle, styles.cardFill, {
+            borderRadius: chrome.borderRadius
+          }],
+          children: [showClose ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_CloseButton.CloseButton, {
+            onPress: endAsUserClosed,
+            color: (0, _resolveCloseButtonColor.resolveCloseButtonColor)(theme)
+          }) : null, progressTop ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProgressBar.ProgressBar, {
+            enabled: true,
+            fraction: progress.fraction,
+            position: "TOP",
+            theme: theme,
+            totalSteps: progress.total,
+            contentPadding: contentPadding
+          }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
+            testID: "userflow-flow-scroll",
+            style: styles.scroll,
+            contentContainerStyle: [styles.scrollContent, {
+              paddingHorizontal: contentPadding,
+              paddingTop: contentPadding,
+              paddingBottom: showBranding ? 0 : contentPadding
+            }],
+            keyboardShouldPersistTaps: "handled",
+            nestedScrollEnabled: true,
+            bounces: false,
+            showsVerticalScrollIndicator: true,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RichContentRenderer.RichContentRenderer, {
+              content: currentStep.content,
+              buttons: currentStep.buttons,
+              theme: theme,
+              sessionData: session.data,
+              lookupAttribute: lookupAttribute,
+              defaultButtonsAlign: buttonsAlign,
+              onActions: actions => {
+                void engine.handleActions(actions);
+              }
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_MadeWithUserflow.MadeWithUserflow, {
+              company: session.flow.company,
+              color: theme.fontColor,
+              contentPadding: contentPadding,
+              embedded: true
+            })]
+          }), progressBottom ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProgressBar.ProgressBar, {
+            enabled: true,
+            fraction: progress.fraction,
+            position: "BOTTOM",
+            theme: theme,
+            totalSteps: progress.total,
+            contentPadding: contentPadding
+          }) : null]
+        })
+      })
+    })]
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  root: {
+    ..._absoluteFill.ABSOLUTE_FILL
+  },
+  center: {
+    ..._absoluteFill.ABSOLUTE_FILL,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  cardFill: {
+    flexShrink: 1,
+    minHeight: 0,
+    width: '100%',
+    position: 'relative'
+  },
+  cardShadow: {
+    flexShrink: 1
+  },
+  scroll: {
+    flexGrow: 0,
+    flexShrink: 1,
+    minHeight: 0
+  },
+  scrollContent: {
+    flexGrow: 1
+  }
+});
+//# sourceMappingURL=ModalSurface.js.map

package/lib/commonjs/surfaces/ModalSurface.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","_interopRequireWildcard","require","_reactNative","_RichContentRenderer","_CloseButton","_resolveCloseButtonColor","_MadeWithUserflow","_ProgressBar","_absoluteFill","_parseBackdropOpacity","_progress","_safeArea","_resolveModalLayout","_themeChrome","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ModalSurface","engine","session","currentStep","theme","lookupAttribute","version","chrome","resolveBubbleChrome","progress","resolveStepProgress","id","showClose","closeDisabled","backdropOpacity","parseBackdropOpacity","canDismissBackdrop","modalBackdropOnclick","endAsUserClosed","useCallback","endFlow","insets","useUserflowSafeAreaInsets","windowDims","useWindowDimensions","centerPadding","resolveModalCenterPadding","cardMaxWidth","resolveModalCardMaxWidth","width","cardMaxHeight","resolveModalCardMaxHeight","height","buttonsAlign","resolveModalButtonsAlign","progressTop","progressBarEnabled","progressBarPosition","progressBottom","showBranding","flow","company","flowBranding","contentPadding","jsxs","View","style","styles","root","testID","pointerEvents","children","jsx","Pressable","accessibilityRole","accessibilityLabel","undefined","accessibilityElementsHidden","importantForAccessibility","disabled","onPress","ABSOLUTE_FILL","backgroundColor","backdropColor","opacity","center","accessibilityViewIsModal","cardStyle","cardShadow","maxWidth","maxHeight","borderRadius","fillStyle","cardFill","CloseButton","color","resolveCloseButtonColor","ProgressBar","enabled","fraction","position","totalSteps","total","ScrollView","scroll","contentContainerStyle","scrollContent","paddingHorizontal","paddingTop","paddingBottom","keyboardShouldPersistTaps","nestedScrollEnabled","bounces","showsVerticalScrollIndicator","RichContentRenderer","content","buttons","sessionData","data","defaultButtonsAlign","onActions","actions","handleActions","MadeWithUserflow","fontColor","embedded","StyleSheet","create","justifyContent","alignItems","flexShrink","minHeight","flexGrow"],"sourceRoot":"../../../src","sources":["surfaces/ModalSurface.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/surfaces/ProgressBar.js

@@ -0,0 +1,116 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ProgressBar = ProgressBar;
+var React = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _themeColor = require("../content/themeColor.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const PROGRESS_BAR_NUMBERED = 'NUMBERED';
+function progressBarType(theme) {
+  return String(theme.progressBarType ?? 'DEFAULT').toUpperCase();
+}
+function numberedStepLabel(fraction, totalSteps) {
+  const maxSteps = Math.max(0, totalSteps);
+  if (maxSteps === 0) return '';
+  const selected = Math.min(Math.floor(fraction * maxSteps), maxSteps);
+  return `${selected} of ${maxSteps}`;
+}
+
+/**
+ * Web bubble progress (`BubbleProgress` / bubble-frame.styl).
+ * DEFAULT: 2px track flush to the card edge. NUMBERED: "1 of 3" step label.
+ */
+function ProgressBar({
+  enabled,
+  fraction,
+  position,
+  theme,
+  totalSteps = 0,
+  contentPadding = 0
+}) {
+  if (!enabled) return null;
+  const clamped = Math.min(1, Math.max(0, fraction));
+  const type = progressBarType(theme);
+  const testId = `userflow-progress-${position === 'TOP' ? 'top' : 'bottom'}`;
+  if (type === PROGRESS_BAR_NUMBERED) {
+    const label = numberedStepLabel(clamped, totalSteps);
+    if (!label) return null;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      testID: testId,
+      style: [styles.numberedTrack, position === 'TOP' ? styles.top : styles.bottomNumbered, contentPadding > 0 ? {
+        paddingHorizontal: contentPadding,
+        alignItems: 'flex-start'
+      } : styles.numberedCentered],
+      accessibilityRole: "text",
+      accessibilityLabel: label,
+      pointerEvents: "none",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        testID: "userflow-progress-numbered",
+        style: [styles.numberedLabel, {
+          color: (0, _themeColor.foregroundAlpha)(theme.fontColor, 0.55),
+          fontFamily: theme.fontFamily || undefined,
+          fontSize: Math.max(12, Math.round(theme.fontSize * 0.875))
+        }],
+        children: label
+      })
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    testID: testId,
+    style: [styles.track, position === 'TOP' ? styles.top : styles.bottom],
+    accessibilityRole: "progressbar",
+    accessibilityValue: {
+      min: 0,
+      max: 100,
+      now: Math.round(clamped * 100)
+    },
+    pointerEvents: "none",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      testID: "userflow-progress-fill",
+      style: [styles.fill, {
+        width: `${clamped * 100}%`,
+        backgroundColor: theme.defaultButtonBackgroundColor
+      }]
+    })
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  track: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    height: 2,
+    backgroundColor: 'rgba(0,0,0,0.08)',
+    overflow: 'hidden',
+    zIndex: 1
+  },
+  numberedTrack: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    zIndex: 1
+  },
+  numberedCentered: {
+    alignItems: 'center'
+  },
+  top: {
+    top: 0
+  },
+  bottom: {
+    bottom: 0
+  },
+  bottomNumbered: {
+    bottom: 8
+  },
+  fill: {
+    height: '100%'
+  },
+  numberedLabel: {
+    fontWeight: '600'
+  }
+});
+//# sourceMappingURL=ProgressBar.js.map

package/lib/commonjs/surfaces/ProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","_interopRequireWildcard","require","_reactNative","_themeColor","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","PROGRESS_BAR_NUMBERED","progressBarType","theme","String","toUpperCase","numberedStepLabel","fraction","totalSteps","maxSteps","Math","max","selected","min","floor","ProgressBar","enabled","position","contentPadding","clamped","type","testId","label","jsx","View","testID","style","styles","numberedTrack","top","bottomNumbered","paddingHorizontal","alignItems","numberedCentered","accessibilityRole","accessibilityLabel","pointerEvents","children","Text","numberedLabel","color","foregroundAlpha","fontColor","fontFamily","undefined","fontSize","round","track","bottom","accessibilityValue","now","fill","width","backgroundColor","defaultButtonBackgroundColor","StyleSheet","create","left","right","height","overflow","zIndex","fontWeight"],"sourceRoot":"../../../src","sources":["surfaces/ProgressBar.tsx"],"mappings":"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","ignoreList":[]}