@webority/mobile-ui 0.0.38 → 0.1.0

package/lib/commonjs/components/Modal/Modal.js

@@ -1,376 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Modal = exports.MODAL_DISMISS_GRACE_MS = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
-var _index = require("../../theme/index.js");
-var _corners = require("../../utils/corners.js");
-var _hapticUtils = require("../../utils/hapticUtils.js");
-var _squircle = require("../../utils/squircle.js");
-var _SquircleFill = require("../SquircleFill/SquircleFill.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); }
-// Local shape mirror — see types.ts ModalTokens for the canonical definition.
-
-/**
- * Grace period between `visible` flipping false and the native modal being
- * safely gone. Unmounting the tree (navigation reset, auth flip) before this
- * elapses races Android's ReactModalHostView dismiss and NPE-crashes.
- */
-const MODAL_DISMISS_GRACE_MS = exports.MODAL_DISMISS_GRACE_MS = 300;
-const Modal = exports.Modal = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  const {
-    visible,
-    onRequestClose,
-    presentation = 'centered',
-    backdropOpacity,
-    backdropPressClose = true,
-    animationDuration,
-    accessibilityLabel,
-    hardwareBackPress = true,
-    children,
-    contentStyle,
-    backdropStyle,
-    restoreFocusRef,
-    onDismissed,
-    haptic,
-    testID
-  } = props;
-  const theme = (0, _index.useTheme)();
-  const insets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
-  const duration = animationDuration ?? theme.motion.duration.normal;
-  const screenHeight = _reactNative.Dimensions.get('window').height;
-  const modalTokens = theme.components.modal;
-  const scaleStartValue = modalTokens?.scaleStartValue ?? 0.9;
-  const scaleAnim = (0, _react.useRef)((0, _index.createAnimatedValue)(scaleStartValue)).current;
-  const opacityAnim = (0, _react.useRef)((0, _index.createAnimatedValue)(0)).current;
-  const translateYAnim = (0, _react.useRef)((0, _index.createAnimatedValue)(screenHeight)).current;
-  const containerRef = (0, _react.useRef)(null);
-  const wasVisibleRef = (0, _react.useRef)(false);
-  // The native modal must stay mounted while the exit plays; unmounting on the
-  // `visible` flip is what made the modal snap away after springing in. Exit
-  // finishes well inside MODAL_DISMISS_GRACE_MS, so `onDismissed` still lands
-  // after the content is actually gone.
-  const [rendered, setRendered] = (0, _react.useState)(visible);
-  const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
-
-  // The backdrop is a pre-baked colour, not an animated opacity (see the render
-  // comment for the Fabric reason), so `backdropOpacity` has to override the
-  // token's alpha channel rather than drive an Animated value.
-  const backdropColor = (0, _react.useMemo)(() => {
-    const token = theme.colors.background.overlay;
-    if (typeof backdropOpacity !== 'number') {
-      return token;
-    }
-    const rgba = token.match(/^rgba?\(([^)]+)\)$/);
-    if (!rgba) {
-      return token;
-    }
-    const [r, g, b] = rgba[1].split(',').map(part => part.trim());
-    return `rgba(${r}, ${g}, ${b}, ${backdropOpacity})`;
-  }, [theme.colors.background.overlay, backdropOpacity]);
-
-  // Mounting is its own effect: folding it into the animation effect below
-  // would make `rendered` flipping true re-run that effect and replay the
-  // enter animation.
-  (0, _react.useEffect)(() => {
-    if (visible) {
-      setRendered(true);
-    }
-  }, [visible]);
-  (0, _react.useEffect)(() => {
-    const running = [];
-    if (visible && rendered) {
-      // The backdrop is NOT animated: it is a pre-baked colour, because on
-      // RN 0.85 / Fabric / iOS an animated opacity on a View that also sets
-      // backgroundColor renders as 0 and the dim layer never appears (see the
-      // render comment). It used to be tweened here and in the exit below, but
-      // nothing consumed the value — a dead animation on every open and close.
-
-      if (presentation === 'bottom') {
-        const slide = _reactNative.Animated.spring(translateYAnim, {
-          toValue: 0,
-          damping: theme.motion.spring.gentle.damping,
-          stiffness: theme.motion.spring.gentle.stiffness,
-          mass: theme.motion.spring.gentle.mass,
-          useNativeDriver: true
-        });
-        slide.start();
-        running.push(slide);
-      } else {
-        const enter = _reactNative.Animated.parallel([_reactNative.Animated.spring(scaleAnim, {
-          toValue: 1,
-          damping: theme.motion.spring.gentle.damping,
-          stiffness: theme.motion.spring.gentle.stiffness,
-          mass: theme.motion.spring.gentle.mass,
-          useNativeDriver: true
-        }), _reactNative.Animated.timing(opacityAnim, {
-          toValue: 1,
-          duration,
-          useNativeDriver: true
-        })]);
-        enter.start();
-        running.push(enter);
-      }
-    } else if (rendered) {
-      // Leave decisively: timing + accelerate, never a spring on the way out
-      // (theme.motion.spring documents the rule).
-      const exitDuration = theme.motion.duration.fast;
-      const accelerate = _reactNative.Easing.bezier(...theme.motion.easing.accelerate);
-      const exit = _reactNative.Animated.parallel([presentation === 'bottom' ? _reactNative.Animated.timing(translateYAnim, {
-        toValue: screenHeight,
-        duration: exitDuration,
-        easing: accelerate,
-        useNativeDriver: true
-      }) : _reactNative.Animated.parallel([_reactNative.Animated.timing(scaleAnim, {
-        toValue: scaleStartValue,
-        duration: exitDuration,
-        easing: accelerate,
-        useNativeDriver: true
-      }), _reactNative.Animated.timing(opacityAnim, {
-        toValue: 0,
-        duration: exitDuration,
-        easing: accelerate,
-        useNativeDriver: true
-      })])]);
-      exit.start(({
-        finished
-      }) => {
-        if (finished) {
-          setRendered(false);
-        }
-      });
-      running.push(exit);
-    }
-    // Stop in-flight tweens on unmount / visibility flip so an enter animation
-    // never resolves against a torn-down tree (fixes the jest async leak and
-    // the equivalent post-unmount work in the real app).
-    return () => running.forEach(animation => animation.stop());
-  }, [visible, rendered, presentation, duration, scaleAnim, opacityAnim, translateYAnim, screenHeight, theme.motion.spring.gentle.damping, theme.motion.spring.gentle.stiffness, theme.motion.spring.gentle.mass, theme.motion.duration.fast, theme.motion.easing.accelerate, scaleStartValue]);
-
-  // Accessibility focus trap: when the modal opens, push screen-reader focus
-  // into the dialog container after the mount animation; when it closes,
-  // restore focus to the trigger element if the consumer provided a ref.
-  (0, _react.useEffect)(() => {
-    let openTimer;
-    let closeTimer;
-    if (visible) {
-      openTimer = setTimeout(() => {
-        // sendAccessibilityEvent takes the host instance directly; the older
-        // setAccessibilityFocus needs a react tag via the deprecated findNodeHandle.
-        if (containerRef.current) {
-          _reactNative.AccessibilityInfo.sendAccessibilityEvent(containerRef.current, 'focus');
-        }
-      }, 150);
-      wasVisibleRef.current = true;
-    } else if (wasVisibleRef.current) {
-      wasVisibleRef.current = false;
-      if (restoreFocusRef && restoreFocusRef.current) {
-        closeTimer = setTimeout(() => {
-          const target = restoreFocusRef.current;
-          if (target) {
-            _reactNative.AccessibilityInfo.sendAccessibilityEvent(target, 'focus');
-          }
-        }, duration);
-      }
-    }
-    return () => {
-      if (openTimer) {
-        clearTimeout(openTimer);
-      }
-      if (closeTimer) {
-        clearTimeout(closeTimer);
-      }
-    };
-  }, [visible, duration, restoreFocusRef]);
-  const wasOpenRef = (0, _react.useRef)(false);
-  (0, _react.useEffect)(() => {
-    if (visible) {
-      wasOpenRef.current = true;
-      return;
-    }
-    if (!wasOpenRef.current) {
-      return;
-    }
-    wasOpenRef.current = false;
-    if (!onDismissed) {
-      return;
-    }
-    const timer = setTimeout(onDismissed, MODAL_DISMISS_GRACE_MS);
-    return () => clearTimeout(timer);
-  }, [visible, onDismissed]);
-  const handleBackdropPress = (0, _react.useCallback)(() => {
-    if (!backdropPressClose) {
-      return;
-    }
-    const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
-    if (h) {
-      (0, _hapticUtils.triggerHaptic)(h);
-    }
-    onRequestClose();
-  }, [backdropPressClose, onRequestClose, haptic]);
-  const handleHardwareBack = (0, _react.useCallback)(() => {
-    if (hardwareBackPress) {
-      onRequestClose();
-    }
-  }, [hardwareBackPress, onRequestClose]);
-
-  // Android smooth corners for the centered card. The host keeps its opaque
-  // background (its elevation shadow is cast from the view's own outline)
-  // with a deeper native radius, and the squircle is drawn over it. The
-  // bottom sheet rounds only its top corners, a shape the path does not
-  // draw, and the full-screen presentation has no corner.
-  const squircle = (0, _SquircleFill.useSquircle)(presentation !== 'bottom' && presentation !== 'fullScreen', theme.radius.xl);
-  const containerStyle = (0, _react.useMemo)(() => {
-    if (presentation === 'fullScreen') {
-      return [styles.fullScreenContent, {
-        backgroundColor: theme.colors.background.elevated
-      }];
-    }
-    if (presentation === 'bottom') {
-      // paddingBottom includes the Android navigation-bar / iOS home-indicator
-      // inset so sheet content never lands behind the system chrome.
-      return [styles.bottomContent, {
-        backgroundColor: theme.colors.background.elevated,
-        borderTopLeftRadius: theme.radius.xl,
-        borderTopRightRadius: theme.radius.xl,
-        ..._corners.smoothCorners,
-        paddingTop: theme.spacing.lg,
-        paddingHorizontal: theme.spacing.lg,
-        paddingBottom: theme.spacing.lg + insets.bottom
-      }, theme.shadows.xl];
-    }
-    return [styles.centeredContent, {
-      backgroundColor: theme.colors.background.elevated,
-      // Under the Android squircle the opaque host's own corner is pushed
-      // deeper so it hides under the shape (see squircleHostRadius).
-      borderRadius: squircle.active && squircle.size ? (0, _squircle.squircleHostRadius)(squircle.size.width, squircle.size.height, theme.radius.xl) : theme.radius.xl,
-      ..._corners.smoothCorners,
-      padding: theme.spacing.xl
-    }, theme.shadows.xl];
-  }, [presentation, theme, styles, insets.bottom, squircle.active, squircle.size]);
-  const wrapperStyle = (0, _react.useMemo)(() => {
-    if (presentation === 'bottom') {
-      return styles.bottomWrapper;
-    }
-    if (presentation === 'fullScreen') {
-      return styles.fullScreenWrapper;
-    }
-    return styles.centeredWrapper;
-  }, [presentation, styles]);
-  const animatedTransform = (0, _react.useMemo)(() => {
-    if (presentation === 'bottom') {
-      return {
-        transform: [{
-          translateY: translateYAnim
-        }]
-      };
-    }
-    if (presentation === 'fullScreen') {
-      return {
-        opacity: opacityAnim
-      };
-    }
-    return {
-      opacity: opacityAnim,
-      transform: [{
-        scale: scaleAnim
-      }]
-    };
-  }, [presentation, scaleAnim, opacityAnim, translateYAnim]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Modal, {
-    visible: rendered,
-    transparent: true,
-    statusBarTranslucent: true
-    // Android-only API (RN 0.71+). On iOS the prop is harmless / ignored.
-    // Lets the backdrop and sheet extend behind the system navigation bar
-    // so the dim layer covers the entire screen and gesture-nav devices
-    // don't show a gap under the sheet.
-    ,
-    navigationBarTranslucent: true,
-    animationType: "none",
-    onRequestClose: handleHardwareBack,
-    testID: testID,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      ref: node => {
-        containerRef.current = node;
-        if (typeof ref === 'function') {
-          ref(node);
-        } else if (ref) {
-          ref.current = node;
-        }
-      },
-      style: styles.root,
-      accessible: false,
-      accessibilityViewIsModal: true,
-      accessibilityRole: "alert",
-      accessibilityLabel: accessibilityLabel,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View
-      // Backdrop wraps the dialog content (not sibling) — empirically,
-      // on RN 0.85 / Fabric / iOS a sibling backdrop is occluded by the
-      // wrapper View regardless of render order or pointerEvents.
-      // collapsable={false} prevents the backdrop View from being
-      // flattened out of the native tree. The backdrop uses a pre-baked
-      // rgba colour (no animated opacity) because Animated.View opacity
-      // on a coloured View doesn't update visibly on Fabric.
-      , {
-        collapsable: false,
-        style: [_reactNative.StyleSheet.absoluteFill, wrapperStyle, {
-          backgroundColor: backdropColor
-        }, backdropStyle],
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-          style: _reactNative.StyleSheet.absoluteFill,
-          onPress: handleBackdropPress,
-          accessibilityRole: "button",
-          accessibilityLabel: "Close modal",
-          disabled: !backdropPressClose
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Animated.View, {
-          style: [containerStyle, animatedTransform, contentStyle],
-          onLayout: squircle.onLayout,
-          pointerEvents: "auto",
-          children: [squircle.active && squircle.size ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_SquircleFill.SquircleFill, {
-            width: squircle.size.width,
-            height: squircle.size.height,
-            radius: theme.radius.xl,
-            fill: theme.colors.background.elevated
-          }) : null, children]
-        })]
-      })
-    })
-  });
-});
-Modal.displayName = 'Modal';
-const buildStyles = _theme => _reactNative.StyleSheet.create({
-  root: {
-    flex: 1
-  },
-  centeredWrapper: {
-    flex: 1,
-    alignItems: 'center',
-    justifyContent: 'center',
-    paddingHorizontal: 16
-  },
-  centeredContent: {
-    maxWidth: '90%',
-    width: '90%'
-  },
-  bottomWrapper: {
-    flex: 1,
-    justifyContent: 'flex-end'
-  },
-  bottomContent: {
-    width: '100%'
-  },
-  fullScreenWrapper: {
-    flex: 1
-  },
-  fullScreenContent: {
-    flex: 1
-  }
-});
-var _default = exports.default = Modal;
-//# sourceMappingURL=Modal.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Modal=exports.MODAL_DISMISS_GRACE_MS=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_squircle=require("../../utils/squircle.js"),_SquircleFill=require("../SquircleFill/SquircleFill.js"),_ToastProvider=require("../Toast/ToastProvider.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,i=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var a,s,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(a=t?i:r){if(a.has(e))return a.get(e);a.set(e,n)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?a(n,t,s):n[t]=e[t]);return n})(e,t)}const MODAL_DISMISS_GRACE_MS=exports.MODAL_DISMISS_GRACE_MS=300,Modal=exports.Modal=(0,_react.forwardRef)((e,t)=>{const{visible:r,onRequestClose:i,presentation:a="centered",backdropOpacity:s,backdropPressClose:n=!0,animationDuration:o,accessibilityLabel:c,hardwareBackPress:l=!0,children:u,contentStyle:d,backdropStyle:m,restoreFocusRef:_,onDismissed:f,haptic:p,testID:g}=e,v=(0,_index.useTheme)(),b=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),x=o??v.motion.duration.normal,S=_reactNative.Dimensions.get("window").height,h=v.components.modal,y=h?.scaleStartValue??.9,N=(0,_react.useRef)((0,_index.createAnimatedValue)(y)).current,R=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current,M=(0,_react.useRef)((0,_index.createAnimatedValue)(S)).current,j=(0,_react.useRef)(null),A=(0,_react.useRef)(!1),[q,C]=(0,_react.useState)(r),w=(0,_react.useMemo)(()=>buildStyles(v),[v]),D=(0,_react.useMemo)(()=>{const e=v.colors.background.overlay;if("number"!=typeof s)return e;const t=e.match(/^rgba?\(([^)]+)\)$/);if(!t)return e;const[r,i,a]=t[1].split(",").map(e=>e.trim());return`rgba(${r}, ${i}, ${a}, ${s})`},[v.colors.background.overlay,s]);(0,_react.useEffect)(()=>{r&&C(!0)},[r]),(0,_react.useEffect)(()=>{const e=[];if(r&&q)if("bottom"===a){const t=_reactNative.Animated.spring(M,{toValue:0,damping:v.motion.spring.gentle.damping,stiffness:v.motion.spring.gentle.stiffness,mass:v.motion.spring.gentle.mass,useNativeDriver:!0});t.start(),e.push(t)}else{const t=_reactNative.Animated.parallel([_reactNative.Animated.spring(N,{toValue:1,damping:v.motion.spring.gentle.damping,stiffness:v.motion.spring.gentle.stiffness,mass:v.motion.spring.gentle.mass,useNativeDriver:!0}),_reactNative.Animated.timing(R,{toValue:1,duration:x,useNativeDriver:!0})]);t.start(),e.push(t)}else if(q){const t=v.motion.duration.fast,r=_reactNative.Easing.bezier(...v.motion.easing.accelerate),i=_reactNative.Animated.parallel(["bottom"===a?_reactNative.Animated.timing(M,{toValue:S,duration:t,easing:r,useNativeDriver:!0}):_reactNative.Animated.parallel([_reactNative.Animated.timing(N,{toValue:y,duration:t,easing:r,useNativeDriver:!0}),_reactNative.Animated.timing(R,{toValue:0,duration:t,easing:r,useNativeDriver:!0})])]);i.start(({finished:e})=>{e&&C(!1)}),e.push(i)}return()=>e.forEach(e=>e.stop())},[r,q,a,x,N,R,M,S,v.motion.spring.gentle.damping,v.motion.spring.gentle.stiffness,v.motion.spring.gentle.mass,v.motion.duration.fast,v.motion.easing.accelerate,y]),(0,_react.useEffect)(()=>{if("web"===_reactNative.Platform.OS)return;let e,t;return r?(e=setTimeout(()=>{j.current&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(j.current,"focus")},150),A.current=!0):A.current&&(A.current=!1,_&&_.current&&(t=setTimeout(()=>{const e=_.current;e&&_reactNative.AccessibilityInfo.sendAccessibilityEvent(e,"focus")},x))),()=>{e&&clearTimeout(e),t&&clearTimeout(t)}},[r,x,_]);const k=(0,_react.useRef)(!1);(0,_react.useEffect)(()=>{if(r)return void(k.current=!0);if(!k.current)return;if(k.current=!1,!f)return;const e=setTimeout(f,MODAL_DISMISS_GRACE_MS);return()=>clearTimeout(e)},[r,f]);const T=(0,_react.useCallback)(()=>{if(!n)return;const e=(0,_hapticUtils.resolveHaptic)(p,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),i()},[n,i,p]),I=(0,_react.useCallback)(()=>{l&&i()},[l,i]),V=(0,_SquircleFill.useSquircle)("bottom"!==a&&"fullScreen"!==a,v.radius.xl),E=(0,_react.useMemo)(()=>"fullScreen"===a?[w.fullScreenContent,{backgroundColor:v.colors.background.elevated}]:"bottom"===a?[w.bottomContent,{backgroundColor:v.colors.background.elevated,borderTopLeftRadius:v.radius.xl,borderTopRightRadius:v.radius.xl,..._corners.smoothCorners,paddingTop:v.spacing.lg,paddingHorizontal:v.spacing.lg,paddingBottom:v.spacing.lg+b.bottom},v.shadows.xl]:[w.centeredContent,{backgroundColor:v.colors.background.elevated,borderRadius:V.active&&V.size?(0,_squircle.squircleHostRadius)(V.size.width,V.size.height,v.radius.xl):v.radius.xl,..._corners.smoothCorners,padding:v.spacing.xl},v.shadows.xl],[a,v,w,b.bottom,V.active,V.size]),W=(0,_react.useMemo)(()=>"bottom"===a?w.bottomWrapper:"fullScreen"===a?w.fullScreenWrapper:w.centeredWrapper,[a,w]),P=(0,_react.useMemo)(()=>"bottom"===a?{transform:[{translateY:M}]}:"fullScreen"===a?{opacity:R}:{opacity:R,transform:[{scale:N}]},[a,N,R,M]);return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:q,transparent:!0,statusBarTranslucent:!0,navigationBarTranslucent:!0,animationType:"none",onRequestClose:I,testID:g,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:e=>{j.current=e,"function"==typeof t?t(e):t&&(t.current=e)},style:w.root,accessible:!1,accessibilityViewIsModal:!0,accessibilityRole:"alert",accessibilityLabel:c,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{collapsable:!1,style:[_reactNative.StyleSheet.absoluteFill,W,{backgroundColor:D},m],children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:_reactNative.StyleSheet.absoluteFill,onPress:T,accessibilityRole:"button",accessibilityLabel:"Close modal",disabled:!n}),(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{style:[E,P,d],onLayout:V.onLayout,pointerEvents:"auto",children:[V.active&&V.size?(0,_jsxRuntime.jsx)(_SquircleFill.SquircleFill,{width:V.size.width,height:V.size.height,radius:v.radius.xl,fill:v.colors.background.elevated}):null,u]})]}),(0,_jsxRuntime.jsx)(_ToastProvider.ToastHost,{})]})})});Modal.displayName="Modal";const buildStyles=e=>_reactNative.StyleSheet.create({root:{flex:1},centeredWrapper:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:16},centeredContent:{maxWidth:"90%",width:"90%"},bottomWrapper:{flex:1,justifyContent:"flex-end"},bottomContent:{width:"100%"},fullScreenWrapper:{flex:1},fullScreenContent:{flex:1}});var _default=exports.default=Modal;

package/lib/commonjs/components/Modal/index.js

@@ -1,26 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "MODAL_DISMISS_GRACE_MS", {
-  enumerable: true,
-  get: function () {
-    return _Modal.MODAL_DISMISS_GRACE_MS;
-  }
-});
-Object.defineProperty(exports, "Modal", {
-  enumerable: true,
-  get: function () {
-    return _Modal.Modal;
-  }
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _Modal.default;
-  }
-});
-var _Modal = _interopRequireWildcard(require("./Modal.js"));
-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); }
-//# sourceMappingURL=index.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"MODAL_DISMISS_GRACE_MS",{enumerable:!0,get:function(){return _Modal.MODAL_DISMISS_GRACE_MS}}),Object.defineProperty(exports,"Modal",{enumerable:!0,get:function(){return _Modal.Modal}}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _Modal.default}});var _Modal=_interopRequireWildcard(require("./Modal.js"));function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var o,u,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(o=r?n:t){if(o.has(e))return o.get(e);o.set(e,a)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((u=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(u.get||u.set)?o(a,r,u):a[r]=e[r]);return a})(e,r)}

package/lib/commonjs/components/Notation/Notation.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.sym=exports.parseNotation=exports.default=exports.Notation=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_Text=require("../Text/Text.js"),_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 s,i,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(s=t?n:r){if(s.has(e))return s.get(e);s.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?s(o,t,i):o[t]=e[t]);return o})(e,t)}const SUBSCRIPTED=/(?<![A-Za-z0-9_])([A-Za-z])_([A-Za-z0-9]+)(?![A-Za-z0-9_])/g,parseNotation=e=>{const t=String(e??""),r=[];let n=0;for(const e of t.matchAll(SUBSCRIPTED)){const s=e.index??0;s>n&&r.push({text:t.slice(n,s)}),r.push({text:e[1],sub:e[2]}),n=s+e[0].length}return n<t.length&&r.push({text:t.slice(n)}),r};exports.parseNotation=parseNotation;const Notation=({text:e,base:t,sub:r,desc:n,testID:s})=>{const i=(0,_index.useTheme)(),o={fontSize:Math.round(.75*i.typography.fontSize.sm),lineHeight:Math.round(.9*i.typography.fontSize.sm)};return null!=t?(0,_jsxRuntime.jsxs)(_Text.Text,{testID:s,children:[t,r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:o,children:r}):null,n?` ${n}`:null]}):(0,_jsxRuntime.jsx)(_reactNative.Text,{testID:s,children:parseNotation(e).map((e,t)=>e.sub?(0,_jsxRuntime.jsxs)(_react.Fragment,{children:[e.text,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:o,children:e.sub})]},t):(0,_jsxRuntime.jsx)(_react.Fragment,{children:e.text},t))})};exports.Notation=Notation;const sym=(e,t,r)=>(0,_jsxRuntime.jsx)(Notation,{base:e,sub:t,desc:r});exports.sym=sym;var _default=exports.default=Notation;

package/lib/commonjs/components/Notation/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Notation",{enumerable:!0,get:function(){return _Notation.Notation}}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _Notation.default}}),Object.defineProperty(exports,"parseNotation",{enumerable:!0,get:function(){return _Notation.parseNotation}}),Object.defineProperty(exports,"sym",{enumerable:!0,get:function(){return _Notation.sym}});var _Notation=_interopRequireWildcard(require("./Notation.js"));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,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(a,t,i):a[t]=e[t]);return a})(e,t)}