@planningcenter/chat-react-native 3.42.2-qa-staging.1 → 3.42.2-qa-821.0

package/build/components/display/icon_button.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon_button.js","sourceRoot":"","sources":["../../../src/components/display/icon_button.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { Pressable, StyleSheet, type StyleProp } from 'react-native'\nimport type { PressableProps, ViewStyle } from 'react-native'\nimport { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks'\nimport { platformPressedOpacityStyle } from '../../utils'\nimport { Icon } from './icon'\nimport type { IconProps, IconString } from './icon'\nimport { Spinner } from './spinner'\nimport { getColorKey, useIconButtonColorOptionMap } from './utils/button_colors'\nimport type { IconButtonAppearanceUnion } from './utils/button_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst SIZES = {\n  xxxs: 'xxxs',\n  xxs: 'xxs',\n  xs: 'xs',\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n  xl: 'xl',\n  xxl: 'xxl',\n  xxxl: 'xxxl',\n} as const\n\ntype SizeUnion = (typeof SIZES)[keyof typeof SIZES]\ntype SizeStyle = Record<\n  SizeUnion,\n  {\n    fontSize: number\n    height: number\n  }\n>\ntype AndroidRadiusSize = Record<\n  SizeUnion,\n  {\n    radius: number\n  }\n>\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface IconButtonProps extends PressableProps {\n  /**\n   * Provides context to screen readers about what the button does.\n   * This is required as Icons don't inherently provide non-visual context like text does.\n   */\n  accessibilityLabel: string\n  /**\n   * Updates the icon's colors. Defaults to 'neutral'.\n   */\n  appearance?: IconButtonAppearanceUnion\n  /**\n   * Styles the icon itself.\n   * `fontSize` allows for a custom size that also responds to the device's text scale.\n   * `color` changes the color of the icon.\n   */\n  iconStyle?: IconProps['style']\n  /**\n   * Disables the button and replaces its content with a spinner\n   */\n  loading?: boolean\n  /**\n   * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n   */\n  maxFontSizeMultiplier?: number\n  /**\n   * Generates an icon from `@planningcenter/icons`\n   */\n  name: IconString\n  /**\n   * Changes the overall size of the button and its contents\n   */\n  size?: SizeUnion\n  /**\n   * Styles the `Pressable` wrapper\n   */\n  style?: StyleProp<ViewStyle>\n}\n\nexport function IconButton({\n  accessibilityLabel,\n  appearance = 'neutral',\n  disabled = false,\n  iconStyle,\n  loading,\n  maxFontSizeMultiplier,\n  name,\n  size = 'md',\n  style,\n  ...props\n}: IconButtonProps) {\n  const styles = useStyles({ appearance, disabled, loading, maxFontSizeMultiplier, size })\n  const colorOptionMap = useIconButtonColorOptionMap()\n  const colorKey = getColorKey({ disabled, loading, appearance })\n\n  const { color = colorOptionMap[colorKey] } = StyleSheet.flatten(iconStyle || {})\n  const androidRippleColor = useCreateAndroidRippleColor({ color: color })\n\n  const androidRadiusSizeMap: AndroidRadiusSize = {\n    [SIZES.xxxs]: {\n      radius: 8,\n    },\n    [SIZES.xxs]: {\n      radius: 10,\n    },\n    [SIZES.xs]: {\n      radius: 12,\n    },\n    [SIZES.sm]: {\n      radius: 14,\n    },\n    [SIZES.md]: {\n      radius: 16,\n    },\n    [SIZES.lg]: {\n      radius: 18,\n    },\n    [SIZES.xl]: {\n      radius: 20,\n    },\n    [SIZES.xxl]: {\n      radius: 26,\n    },\n    [SIZES.xxxl]: {\n      radius: 32,\n    },\n  }\n\n  return (\n    <Pressable\n      style={({ pressed }) => [styles.pressable, style, pressed && platformPressedOpacityStyle]}\n      accessibilityRole=\"button\"\n      disabled={disabled || loading}\n      accessibilityState={{ busy: loading }}\n      accessibilityLabel={accessibilityLabel}\n      hitSlop={10}\n      android_ripple={{\n        color: androidRippleColor,\n        borderless: true,\n        foreground: true,\n        radius: androidRadiusSizeMap[size].radius,\n      }}\n      {...props}\n    >\n      {loading ? (\n        <Spinner\n          size={styles.spinner.fontSize}\n          maxFontSizeMultiplier={maxFontSizeMultiplier || 0}\n        />\n      ) : (\n        <Icon\n          name={name}\n          style={[styles.icon, iconStyle, disabled && styles.iconDisabled]}\n          maxFontSizeMultiplier={maxFontSizeMultiplier}\n        />\n      )}\n    </Pressable>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n  appearance = 'neutral',\n  disabled = false,\n  loading = false,\n  maxFontSizeMultiplier,\n  size = 'md',\n}: Partial<IconButtonProps>) => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier })\n  const colorOptionMap = useIconButtonColorOptionMap()\n  const colorKey = getColorKey({ disabled, loading, appearance })\n\n  const sizeStyleMap: SizeStyle = {\n    [SIZES.xxxs]: {\n      fontSize: 8,\n      height: 8 * fontScale,\n    },\n    [SIZES.xxs]: {\n      fontSize: 10,\n      height: 10 * fontScale,\n    },\n    [SIZES.xs]: {\n      fontSize: 12,\n      height: 12 * fontScale,\n    },\n    [SIZES.sm]: {\n      fontSize: 14,\n      height: 14 * fontScale,\n    },\n    [SIZES.md]: {\n      fontSize: 16,\n      height: 16 * fontScale,\n    },\n    [SIZES.lg]: {\n      fontSize: 20,\n      height: 20 * fontScale,\n    },\n    [SIZES.xl]: {\n      fontSize: 24,\n      height: 24 * fontScale,\n    },\n    [SIZES.xxl]: {\n      fontSize: 32,\n      height: 32 * fontScale,\n    },\n    [SIZES.xxxl]: {\n      fontSize: 40,\n      height: 40 * fontScale,\n    },\n  }\n\n  return StyleSheet.create({\n    pressable: {\n      alignItems: 'center',\n      justifyContent: 'center',\n      height: sizeStyleMap[size].height,\n    },\n    icon: {\n      fontSize: sizeStyleMap[size].fontSize,\n      color: colorOptionMap[colorKey],\n    },\n    iconDisabled: {\n      color: colors.iconColorDefaultDisabled,\n    },\n    spinner: {\n      fontSize: sizeStyleMap[size].fontSize,\n    },\n  })\n}\n"]}
+{"version":3,"file":"icon_button.js","sourceRoot":"","sources":["../../../src/components/display/icon_button.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { Pressable, StyleSheet, type StyleProp } from 'react-native'\nimport type { PressableProps, ViewStyle } from 'react-native'\nimport { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks'\nimport { platformPressedOpacityStyle } from '../../utils'\nimport { Icon } from './icon'\nimport type { IconProps, IconString } from './icon'\nimport { Spinner } from './spinner'\nimport { getColorKey, useIconButtonColorOptionMap } from './utils/button_colors'\nimport type { IconButtonAppearanceUnion } from './utils/button_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst SIZES = {\n  xxxs: 'xxxs',\n  xxs: 'xxs',\n  xs: 'xs',\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n  xl: 'xl',\n  xxl: 'xxl',\n  xxxl: 'xxxl',\n} as const\n\ntype SizeUnion = (typeof SIZES)[keyof typeof SIZES]\ntype SizeStyle = Record<\n  SizeUnion,\n  {\n    fontSize: number\n    height: number\n  }\n>\ntype AndroidRadiusSize = Record<\n  SizeUnion,\n  {\n    radius: number\n  }\n>\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface IconButtonProps extends PressableProps {\n  /**\n   * Provides context to screen readers about what the button does.\n   * This is required as Icons don't inherently provide non-visual context like text does.\n   */\n  accessibilityLabel: string\n  /**\n   * Updates the icon's colors. Defaults to 'neutral'.\n   */\n  appearance?: IconButtonAppearanceUnion\n  /**\n   * Styles the icon itself.\n   * `fontSize` allows for a custom size that also responds to the device's text scale.\n   * `color` changes the color of the icon.\n   */\n  iconStyle?: IconProps['style']\n  /**\n   * Disables the button and replaces its content with a spinner\n   */\n  loading?: boolean\n  /**\n   * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n   */\n  maxFontSizeMultiplier?: number\n  /**\n   * Generates an icon from `@planningcenter/icons`\n   */\n  name: IconString\n  /**\n   * Changes the overall size of the button and its contents\n   */\n  size?: SizeUnion\n  /**\n   * Styles the `Pressable` wrapper\n   */\n  style?: StyleProp<ViewStyle>\n}\n\nexport function IconButton({\n  accessibilityLabel,\n  appearance = 'neutral',\n  disabled = false,\n  iconStyle,\n  loading,\n  maxFontSizeMultiplier,\n  name,\n  size = 'md',\n  style,\n  ...props\n}: IconButtonProps) {\n  const styles = useStyles({ appearance, disabled, loading, maxFontSizeMultiplier, size })\n  const colorOptionMap = useIconButtonColorOptionMap()\n  const colorKey = getColorKey({ disabled, loading, appearance })\n\n  const { color = colorOptionMap[colorKey] } = StyleSheet.flatten(iconStyle || {})\n  const androidRippleColor = useCreateAndroidRippleColor({ color: color })\n\n  const androidRadiusSizeMap: AndroidRadiusSize = {\n    [SIZES.xxxs]: {\n      radius: 8,\n    },\n    [SIZES.xxs]: {\n      radius: 10,\n    },\n    [SIZES.xs]: {\n      radius: 12,\n    },\n    [SIZES.sm]: {\n      radius: 14,\n    },\n    [SIZES.md]: {\n      radius: 16,\n    },\n    [SIZES.lg]: {\n      radius: 18,\n    },\n    [SIZES.xl]: {\n      radius: 20,\n    },\n    [SIZES.xxl]: {\n      radius: 26,\n    },\n    [SIZES.xxxl]: {\n      radius: 32,\n    },\n  }\n\n  return (\n    <Pressable\n      style={({ pressed }) => [styles.pressable, style, pressed && platformPressedOpacityStyle]}\n      accessibilityRole=\"button\"\n      disabled={disabled || loading}\n      accessibilityState={{ busy: loading }}\n      accessibilityLabel={accessibilityLabel}\n      hitSlop={10}\n      android_ripple={{\n        color: androidRippleColor,\n        borderless: true,\n        foreground: true,\n        radius: androidRadiusSizeMap[size].radius,\n      }}\n      {...props}\n    >\n      {loading ? (\n        <Spinner\n          size={styles.spinner.fontSize}\n          maxFontSizeMultiplier={maxFontSizeMultiplier || 0}\n        />\n      ) : (\n        <Icon\n          name={name}\n          style={[styles.icon, iconStyle, disabled && styles.iconDisabled]}\n          maxFontSizeMultiplier={maxFontSizeMultiplier}\n        />\n      )}\n    </Pressable>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n  appearance = 'neutral',\n  disabled = false,\n  loading = false,\n  maxFontSizeMultiplier,\n  size = 'md',\n}: Partial<IconButtonProps>) => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier })\n  const colorOptionMap = useIconButtonColorOptionMap()\n  const colorKey = getColorKey({ disabled, loading, appearance })\n\n  const sizeStyleMap: SizeStyle = {\n    [SIZES.xxxs]: {\n      fontSize: 8,\n      height: 8 * fontScale,\n    },\n    [SIZES.xxs]: {\n      fontSize: 10,\n      height: 10 * fontScale,\n    },\n    [SIZES.xs]: {\n      fontSize: 12,\n      height: 12 * fontScale,\n    },\n    [SIZES.sm]: {\n      fontSize: 14,\n      height: 14 * fontScale,\n    },\n    [SIZES.md]: {\n      fontSize: 16,\n      height: 16 * fontScale,\n    },\n    [SIZES.lg]: {\n      fontSize: 20,\n      height: 20 * fontScale,\n    },\n    [SIZES.xl]: {\n      fontSize: 24,\n      height: 24 * fontScale,\n    },\n    [SIZES.xxl]: {\n      fontSize: 32,\n      height: 32 * fontScale,\n    },\n    [SIZES.xxxl]: {\n      fontSize: 40,\n      height: 40 * fontScale,\n    },\n  }\n\n  return StyleSheet.create({\n    pressable: {\n      alignItems: 'center',\n      justifyContent: 'center',\n      height: sizeStyleMap[size].height,\n    },\n    icon: {\n      fontSize: sizeStyleMap[size].fontSize,\n      color: colorOptionMap[colorKey],\n    },\n    iconDisabled: {\n      color: colors.iconColorDefaultDisabled,\n    },\n    spinner: {\n      fontSize: sizeStyleMap[size].fontSize,\n    },\n  })\n}\n"]}

package/build/components/display/image.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { ImageStyle, ImageProps as ReactNativeImageProps, ViewStyle } from 'react-native';
 import { AnimatedStyle } from 'react-native-reanimated';
 export interface ImageProps extends ReactNativeImageProps {
@@ -36,5 +35,5 @@ export interface ImageProps extends ReactNativeImageProps {
      */
     animatedImageStyle?: AnimatedStyle<ImageStyle>;
 }
-export declare function Image({ source, onLoad, defaultLoading, loading, hideLoader, loaderSize, loadingBackgroundStyles, style, wrapperStyle, alt, animatedImageStyle, ...props }: ImageProps): React.JSX.Element;
+export declare function Image({ source, onLoad, defaultLoading, loading, hideLoader, loaderSize, loadingBackgroundStyles, style, wrapperStyle, alt, animatedImageStyle, ...props }: ImageProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=image.d.ts.map

package/build/components/display/image.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,EAGL,UAAU,EAEV,UAAU,IAAI,qBAAqB,EAGnC,SAAS,EACV,MAAM,cAAc,CAAA;AACrB,OAAiB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAQjE,MAAM,WAAW,UAAW,SAAQ,qBAAqB;IACvD;;;OAGG;IACH,GAAG,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,uBAAuB,CAAC,EAAE,SAAS,CAAA;IACnC;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB;;OAEG;IACH,kBAAkB,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;CAC/C;AAED,wBAAgB,KAAK,CAAC,EACpB,MAAM,EACN,MAAa,EACb,cAAqB,EACrB,OAAe,EACf,UAAkB,EAClB,UAAe,EACf,uBAAuB,EACvB,KAAU,EACV,YAAiB,EACjB,GAAG,EACH,kBAAuB,EACvB,GAAG,KAAK,EACT,EAAE,UAAU,qBA2CZ"}
+{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGL,UAAU,EAEV,UAAU,IAAI,qBAAqB,EAGnC,SAAS,EACV,MAAM,cAAc,CAAA;AACrB,OAAiB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AAQjE,MAAM,WAAW,UAAW,SAAQ,qBAAqB;IACvD;;;OAGG;IACH,GAAG,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,uBAAuB,CAAC,EAAE,SAAS,CAAA;IACnC;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB;;OAEG;IACH,kBAAkB,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;CAC/C;AAED,wBAAgB,KAAK,CAAC,EACpB,MAAM,EACN,MAAa,EACb,cAAqB,EACrB,OAAe,EACf,UAAkB,EAClB,UAAe,EACf,uBAAuB,EACvB,KAAU,EACV,YAAiB,EACjB,GAAG,EACH,kBAAuB,EACvB,GAAG,KAAK,EACT,EAAE,UAAU,2CA2CZ"}

package/build/components/display/image.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { noop } from 'lodash';
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { Image as ReactNativeImage, StyleSheet, View, } from 'react-native';
 import Animated from 'react-native-reanimated';
 import { useTheme } from '../../hooks';
@@ -18,12 +19,7 @@ export function Image({ source, onLoad = noop, defaultLoading = true, loading =
     };
     const isLoading = isImageLoading || loading;
     const ImageComponent = animatedImageStyle ? Animated.Image : ReactNativeImage;
-    return (<View style={wrapperStyle} accessible={Boolean(alt)} accessibilityRole="image" accessibilityState={{ busy: isLoading }} collapsable={false}>
-      <ImageComponent style={[styles.image, imageStyles, animatedImageStyle]} onLoad={handleOnLoad} onError={handleOnError} source={source} alt={isLoading ? '' : alt} {...props}/>
-      {!hideLoader && isLoading && (<View style={[styles.loadingBackground, loadingBackgroundStyles]}>
-          <Spinner size={loaderSize} style={styles.spinner}/>
-        </View>)}
-    </View>);
+    return (_jsxs(View, { style: wrapperStyle, accessible: Boolean(alt), accessibilityRole: "image", accessibilityState: { busy: isLoading }, collapsable: false, children: [_jsx(ImageComponent, { style: [styles.image, imageStyles, animatedImageStyle], onLoad: handleOnLoad, onError: handleOnError, source: source, alt: isLoading ? '' : alt, ...props }), !hideLoader && isLoading && (_jsx(View, { style: [styles.loadingBackground, loadingBackgroundStyles], children: _jsx(Spinner, { size: loaderSize, style: styles.spinner }) }))] }));
 }
 const useStyles = ({ width, height, borderRadius }) => {
     const { colors } = useTheme();

package/build/components/display/image.js.map

@@ -1 +1 @@
-{"version":3,"file":"image.js","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"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","sourcesContent":["import { noop } from 'lodash'\nimport React, { useState } from 'react'\nimport {\n  AnimatableNumericValue,\n  DimensionValue,\n  ImageStyle,\n  Image as ReactNativeImage,\n  ImageProps as ReactNativeImageProps,\n  StyleSheet,\n  View,\n  ViewStyle,\n} from 'react-native'\nimport Animated, { AnimatedStyle } from 'react-native-reanimated'\nimport { useTheme } from '../../hooks'\nimport { Spinner } from './spinner'\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport interface ImageProps extends ReactNativeImageProps {\n  /**\n   * Describes the image to screen-readers and marks the image as `accessible`.\n   * Passing an empty string will hide the image from screen-readers.\n   */\n  alt: string\n  /**\n   * Shows the image's loading spinner right away. Enabled by default.\n   */\n  defaultLoading?: boolean\n  /**\n   * Externally controls the loading state of the image.\n   */\n  loading?: boolean\n  /**\n   * Hide the loading spinner, regardless of the loading state.\n   */\n  hideLoader?: boolean\n  /**\n   * Size of the loading spinner.\n   */\n  loaderSize?: number\n  /**\n   * Style object for the preload background.\n   */\n  loadingBackgroundStyles?: ViewStyle\n  /**\n   * Style the outer View of the image.\n   */\n  wrapperStyle?: ViewStyle\n  /**\n   * Style the image if animated.\n   */\n  animatedImageStyle?: AnimatedStyle<ImageStyle>\n}\n\nexport function Image({\n  source,\n  onLoad = noop,\n  defaultLoading = true,\n  loading = false,\n  hideLoader = false,\n  loaderSize = 24,\n  loadingBackgroundStyles,\n  style = {},\n  wrapperStyle = {},\n  alt,\n  animatedImageStyle = {},\n  ...props\n}: ImageProps) {\n  const [isImageLoading, setIsImageLoading] = useState(defaultLoading)\n\n  const imageStyles = StyleSheet.flatten(style)\n  const { width = '100%', height = '100%', borderRadius = 0 } = imageStyles || {}\n  const styles = useStyles({ width, height, borderRadius })\n\n  const handleOnLoad = (event: any) => {\n    setIsImageLoading(false)\n    onLoad?.(event)\n  }\n\n  const handleOnError = () => {\n    setIsImageLoading(false)\n  }\n\n  const isLoading = isImageLoading || loading\n\n  const ImageComponent = animatedImageStyle ? Animated.Image : ReactNativeImage\n\n  return (\n    <View\n      style={wrapperStyle}\n      accessible={Boolean(alt)}\n      accessibilityRole=\"image\"\n      accessibilityState={{ busy: isLoading }}\n      collapsable={false}\n    >\n      <ImageComponent\n        style={[styles.image, imageStyles, animatedImageStyle]}\n        onLoad={handleOnLoad}\n        onError={handleOnError}\n        source={source}\n        alt={isLoading ? '' : alt}\n        {...props}\n      />\n      {!hideLoader && isLoading && (\n        <View style={[styles.loadingBackground, loadingBackgroundStyles]}>\n          <Spinner size={loaderSize} style={styles.spinner} />\n        </View>\n      )}\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\ninterface Styles {\n  width: DimensionValue\n  height: DimensionValue\n  borderRadius: AnimatableNumericValue | string\n}\n\nconst useStyles = ({ width, height, borderRadius }: Styles) => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    loadingBackground: {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      backgroundColor: colors.fillColorNeutral070,\n      borderRadius,\n      width,\n      height,\n    },\n    image: {\n      backgroundColor: colors.fillColorNeutral070,\n      width,\n      height,\n    },\n    spinner: {\n      width: '100%',\n      height: '100%',\n      justifyContent: 'center',\n      alignItems: 'center',\n      position: 'absolute',\n    },\n  })\n}\n"]}
+{"version":3,"file":"image.js","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"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","sourcesContent":["import { noop } from 'lodash'\nimport React, { useState } from 'react'\nimport {\n  AnimatableNumericValue,\n  DimensionValue,\n  ImageStyle,\n  Image as ReactNativeImage,\n  ImageProps as ReactNativeImageProps,\n  StyleSheet,\n  View,\n  ViewStyle,\n} from 'react-native'\nimport Animated, { AnimatedStyle } from 'react-native-reanimated'\nimport { useTheme } from '../../hooks'\nimport { Spinner } from './spinner'\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport interface ImageProps extends ReactNativeImageProps {\n  /**\n   * Describes the image to screen-readers and marks the image as `accessible`.\n   * Passing an empty string will hide the image from screen-readers.\n   */\n  alt: string\n  /**\n   * Shows the image's loading spinner right away. Enabled by default.\n   */\n  defaultLoading?: boolean\n  /**\n   * Externally controls the loading state of the image.\n   */\n  loading?: boolean\n  /**\n   * Hide the loading spinner, regardless of the loading state.\n   */\n  hideLoader?: boolean\n  /**\n   * Size of the loading spinner.\n   */\n  loaderSize?: number\n  /**\n   * Style object for the preload background.\n   */\n  loadingBackgroundStyles?: ViewStyle\n  /**\n   * Style the outer View of the image.\n   */\n  wrapperStyle?: ViewStyle\n  /**\n   * Style the image if animated.\n   */\n  animatedImageStyle?: AnimatedStyle<ImageStyle>\n}\n\nexport function Image({\n  source,\n  onLoad = noop,\n  defaultLoading = true,\n  loading = false,\n  hideLoader = false,\n  loaderSize = 24,\n  loadingBackgroundStyles,\n  style = {},\n  wrapperStyle = {},\n  alt,\n  animatedImageStyle = {},\n  ...props\n}: ImageProps) {\n  const [isImageLoading, setIsImageLoading] = useState(defaultLoading)\n\n  const imageStyles = StyleSheet.flatten(style)\n  const { width = '100%', height = '100%', borderRadius = 0 } = imageStyles || {}\n  const styles = useStyles({ width, height, borderRadius })\n\n  const handleOnLoad = (event: any) => {\n    setIsImageLoading(false)\n    onLoad?.(event)\n  }\n\n  const handleOnError = () => {\n    setIsImageLoading(false)\n  }\n\n  const isLoading = isImageLoading || loading\n\n  const ImageComponent = animatedImageStyle ? Animated.Image : ReactNativeImage\n\n  return (\n    <View\n      style={wrapperStyle}\n      accessible={Boolean(alt)}\n      accessibilityRole=\"image\"\n      accessibilityState={{ busy: isLoading }}\n      collapsable={false}\n    >\n      <ImageComponent\n        style={[styles.image, imageStyles, animatedImageStyle]}\n        onLoad={handleOnLoad}\n        onError={handleOnError}\n        source={source}\n        alt={isLoading ? '' : alt}\n        {...props}\n      />\n      {!hideLoader && isLoading && (\n        <View style={[styles.loadingBackground, loadingBackgroundStyles]}>\n          <Spinner size={loaderSize} style={styles.spinner} />\n        </View>\n      )}\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\ninterface Styles {\n  width: DimensionValue\n  height: DimensionValue\n  borderRadius: AnimatableNumericValue | string\n}\n\nconst useStyles = ({ width, height, borderRadius }: Styles) => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    loadingBackground: {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      backgroundColor: colors.fillColorNeutral070,\n      borderRadius,\n      width,\n      height,\n    },\n    image: {\n      backgroundColor: colors.fillColorNeutral070,\n      width,\n      height,\n    },\n    spinner: {\n      width: '100%',\n      height: '100%',\n      justifyContent: 'center',\n      alignItems: 'center',\n      position: 'absolute',\n    },\n  })\n}\n"]}

package/build/components/display/image_attachment_preview.d.ts

@@ -8,6 +8,6 @@ interface ImageAttachmentPreviewProps {
     hideRemoveButton?: boolean;
     error?: boolean;
 }
-export declare const ImageAttachmentPreview: ({ uri, fileName, size, onRemovePress, loading, hideRemoveButton, error, }: ImageAttachmentPreviewProps) => import("react").JSX.Element;
+export declare const ImageAttachmentPreview: ({ uri, fileName, size, onRemovePress, loading, hideRemoveButton, error, }: ImageAttachmentPreviewProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=image_attachment_preview.d.ts.map

package/build/components/display/image_attachment_preview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image_attachment_preview.d.ts","sourceRoot":"","sources":["../../../src/components/display/image_attachment_preview.tsx"],"names":[],"mappings":"AAOA,KAAK,cAAc,GAAG,IAAI,GAAG,IAAI,CAAA;AAEjC,UAAU,2BAA2B;IACnC,QAAQ,EAAE,MAAM,CAAA;IAChB,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,aAAa,EAAE,MAAM,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,eAAO,MAAM,sBAAsB,GAAI,2EAQpC,2BAA2B,gCA8B7B,CAAA"}
+{"version":3,"file":"image_attachment_preview.d.ts","sourceRoot":"","sources":["../../../src/components/display/image_attachment_preview.tsx"],"names":[],"mappings":"AAOA,KAAK,cAAc,GAAG,IAAI,GAAG,IAAI,CAAA;AAEjC,UAAU,2BAA2B;IACnC,QAAQ,EAAE,MAAM,CAAA;IAChB,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,aAAa,EAAE,MAAM,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,eAAO,MAAM,sBAAsB,GAAI,2EAQpC,2BAA2B,4CA8B7B,CAAA"}

package/build/components/display/image_attachment_preview.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { View, StyleSheet } from 'react-native';
 import { useTheme } from '../../hooks';
 import { tokens } from '../../vendor/tapestry/tokens';
@@ -6,13 +7,7 @@ import { IconButton } from './icon_button';
 import { Image } from './image';
 export const ImageAttachmentPreview = ({ uri, fileName, size = 'md', onRemovePress, loading = false, hideRemoveButton = false, error = false, }) => {
     const styles = useStyles({ size, error });
-    return (<View style={styles.container}>
-      {!hideRemoveButton && (<IconButton name="general.x" onPress={onRemovePress} size="xxs" appearance="neutral" style={styles.closeButton} accessibilityLabel="Remove image attachment"/>)}
-      <Image source={{ uri }} style={styles.image} alt={`Attached ${fileName}`} resizeMode="cover" loading={loading} loaderSize={size === 'sm' ? 20 : 24}/>
-      {error && (<View style={styles.errorBadge}>
-          <Icon name="general.exclamationTriangle" size={12} style={styles.errorIcon}/>
-        </View>)}
-    </View>);
+    return (_jsxs(View, { style: styles.container, children: [!hideRemoveButton && (_jsx(IconButton, { name: "general.x", onPress: onRemovePress, size: "xxs", appearance: "neutral", style: styles.closeButton, accessibilityLabel: "Remove image attachment" })), _jsx(Image, { source: { uri }, style: styles.image, alt: `Attached ${fileName}`, resizeMode: "cover", loading: loading, loaderSize: size === 'sm' ? 20 : 24 }), error && (_jsx(View, { style: styles.errorBadge, children: _jsx(Icon, { name: "general.exclamationTriangle", size: 12, style: styles.errorIcon }) }))] }));
 };
 const useStyles = ({ size = 'md', error = false }) => {
     const { colors } = useTheme();

package/build/components/display/image_attachment_preview.js.map

@@ -1 +1 @@
-{"version":3,"file":"image_attachment_preview.js","sourceRoot":"","sources":["../../../src/components/display/image_attachment_preview.tsx"],"names":[],"mappings":"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","sourcesContent":["import { View, StyleSheet } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { Icon } from './icon'\nimport { IconButton } from './icon_button'\nimport { Image } from './image'\n\ntype ImageSizeUnion = 'sm' | 'md'\n\ninterface ImageAttachmentPreviewProps {\n  fileName: string\n  uri: string\n  size?: ImageSizeUnion\n  onRemovePress: () => void\n  loading?: boolean\n  hideRemoveButton?: boolean\n  error?: boolean\n}\n\nexport const ImageAttachmentPreview = ({\n  uri,\n  fileName,\n  size = 'md',\n  onRemovePress,\n  loading = false,\n  hideRemoveButton = false,\n  error = false,\n}: ImageAttachmentPreviewProps) => {\n  const styles = useStyles({ size, error })\n\n  return (\n    <View style={styles.container}>\n      {!hideRemoveButton && (\n        <IconButton\n          name=\"general.x\"\n          onPress={onRemovePress}\n          size=\"xxs\"\n          appearance=\"neutral\"\n          style={styles.closeButton}\n          accessibilityLabel=\"Remove image attachment\"\n        />\n      )}\n      <Image\n        source={{ uri }}\n        style={styles.image}\n        alt={`Attached ${fileName}`}\n        resizeMode=\"cover\"\n        loading={loading}\n        loaderSize={size === 'sm' ? 20 : 24}\n      />\n      {error && (\n        <View style={styles.errorBadge}>\n          <Icon name=\"general.exclamationTriangle\" size={12} style={styles.errorIcon} />\n        </View>\n      )}\n    </View>\n  )\n}\n\nconst useStyles = ({ size = 'md', error = false }: Partial<ImageAttachmentPreviewProps>) => {\n  const { colors } = useTheme()\n  const borderRadius = 8\n\n  const imageSizeMap = {\n    sm: 60,\n    md: 80,\n  }\n  const errorIconSizeMap = {\n    sm: 10,\n    md: 12,\n  }\n\n  return StyleSheet.create({\n    container: {\n      width: imageSizeMap[size],\n      height: imageSizeMap[size],\n      overflow: 'hidden',\n      borderRadius: borderRadius,\n      borderWidth: error ? 2 : 1,\n      borderColor: error ? colors.statusErrorBorder : colors.borderColorDefaultBase,\n    },\n    image: {\n      opacity: error ? 0.5 : 1,\n    },\n    closeButton: {\n      position: 'absolute',\n      top: 4,\n      right: 4,\n      zIndex: 2,\n      backgroundColor: colors.fillColorNeutral050Base,\n      borderRadius: 16,\n      height: 20,\n      width: 20,\n    },\n    errorBadge: {\n      backgroundColor: colors.statusErrorBorder,\n      position: 'absolute',\n      bottom: 0,\n      right: 0,\n      zIndex: 2,\n      borderStartStartRadius: borderRadius,\n      padding: 4,\n    },\n    errorIcon: {\n      color: tokens.colorNeutral100White,\n      transform: [{ translateX: 1 }],\n      fontSize: errorIconSizeMap[size],\n    },\n  })\n}\n"]}
+{"version":3,"file":"image_attachment_preview.js","sourceRoot":"","sources":["../../../src/components/display/image_attachment_preview.tsx"],"names":[],"mappings":"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","sourcesContent":["import { View, StyleSheet } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { Icon } from './icon'\nimport { IconButton } from './icon_button'\nimport { Image } from './image'\n\ntype ImageSizeUnion = 'sm' | 'md'\n\ninterface ImageAttachmentPreviewProps {\n  fileName: string\n  uri: string\n  size?: ImageSizeUnion\n  onRemovePress: () => void\n  loading?: boolean\n  hideRemoveButton?: boolean\n  error?: boolean\n}\n\nexport const ImageAttachmentPreview = ({\n  uri,\n  fileName,\n  size = 'md',\n  onRemovePress,\n  loading = false,\n  hideRemoveButton = false,\n  error = false,\n}: ImageAttachmentPreviewProps) => {\n  const styles = useStyles({ size, error })\n\n  return (\n    <View style={styles.container}>\n      {!hideRemoveButton && (\n        <IconButton\n          name=\"general.x\"\n          onPress={onRemovePress}\n          size=\"xxs\"\n          appearance=\"neutral\"\n          style={styles.closeButton}\n          accessibilityLabel=\"Remove image attachment\"\n        />\n      )}\n      <Image\n        source={{ uri }}\n        style={styles.image}\n        alt={`Attached ${fileName}`}\n        resizeMode=\"cover\"\n        loading={loading}\n        loaderSize={size === 'sm' ? 20 : 24}\n      />\n      {error && (\n        <View style={styles.errorBadge}>\n          <Icon name=\"general.exclamationTriangle\" size={12} style={styles.errorIcon} />\n        </View>\n      )}\n    </View>\n  )\n}\n\nconst useStyles = ({ size = 'md', error = false }: Partial<ImageAttachmentPreviewProps>) => {\n  const { colors } = useTheme()\n  const borderRadius = 8\n\n  const imageSizeMap = {\n    sm: 60,\n    md: 80,\n  }\n  const errorIconSizeMap = {\n    sm: 10,\n    md: 12,\n  }\n\n  return StyleSheet.create({\n    container: {\n      width: imageSizeMap[size],\n      height: imageSizeMap[size],\n      overflow: 'hidden',\n      borderRadius: borderRadius,\n      borderWidth: error ? 2 : 1,\n      borderColor: error ? colors.statusErrorBorder : colors.borderColorDefaultBase,\n    },\n    image: {\n      opacity: error ? 0.5 : 1,\n    },\n    closeButton: {\n      position: 'absolute',\n      top: 4,\n      right: 4,\n      zIndex: 2,\n      backgroundColor: colors.fillColorNeutral050Base,\n      borderRadius: 16,\n      height: 20,\n      width: 20,\n    },\n    errorBadge: {\n      backgroundColor: colors.statusErrorBorder,\n      position: 'absolute',\n      bottom: 0,\n      right: 0,\n      zIndex: 2,\n      borderStartStartRadius: borderRadius,\n      padding: 4,\n    },\n    errorIcon: {\n      color: tokens.colorNeutral100White,\n      transform: [{ translateX: 1 }],\n      fontSize: errorIconSizeMap[size],\n    },\n  })\n}\n"]}

package/build/components/display/keyboard_view.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
 import { ViewProps } from 'react-native';
 export declare const useKeyboardViewReady: () => boolean;
-export declare function KeyboardView({ children }: Pick<ViewProps, 'children'>): React.JSX.Element;
+export declare function KeyboardView({ children }: Pick<ViewProps, 'children'>): import("react/jsx-runtime").JSX.Element;
 export declare const useKeyboardOpen: () => boolean;
 //# sourceMappingURL=keyboard_view.d.ts.map

package/build/components/display/keyboard_view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard_view.d.ts","sourceRoot":"","sources":["../../../src/components/display/keyboard_view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyD,MAAM,OAAO,CAAA;AAC7E,OAAO,EAOL,SAAS,EACV,MAAM,cAAc,CAAA;AAOrB,eAAO,MAAM,oBAAoB,eAA6C,CAAA;AAE9E,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,qBAkCrE;AAiBD,eAAO,MAAM,eAAe,eAgB3B,CAAA"}
+{"version":3,"file":"keyboard_view.d.ts","sourceRoot":"","sources":["../../../src/components/display/keyboard_view.tsx"],"names":[],"mappings":"AAGA,OAAO,EAOL,SAAS,EACV,MAAM,cAAc,CAAA;AAOrB,eAAO,MAAM,oBAAoB,eAA6C,CAAA;AAE9E,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,2CAkCrE;AAiBD,eAAO,MAAM,eAAe,eAgB3B,CAAA"}

package/build/components/display/keyboard_view.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useNavigation } from '@react-navigation/native';
-import React, { createContext, useContext, useEffect, useState } from 'react';
+import { createContext, useContext, useEffect, useState } from 'react';
 import { Dimensions, Keyboard, KeyboardAvoidingView, Platform, StyleSheet, View, } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useChatContext } from '../../contexts/chat_context';
@@ -18,16 +19,10 @@ export function KeyboardView({ children }) {
         android: edgeToEdge ? 'padding' : undefined,
         ios: 'padding',
     });
-    return (<View style={styles.pageGapView} onLayout={event => {
+    return (_jsx(View, { style: styles.pageGapView, onLayout: event => {
             const { height: viewHeight } = event.nativeEvent.layout;
             setPageSheetGap(screenHeight - viewHeight);
-        }}>
-      <KeyboardViewReadyContext.Provider value={hasTransitionedIn}>
-        <KeyboardAvoidingView keyboardVerticalOffset={pageSheetGap - bottom} behavior={behavior} style={styles.keyboardView} enabled={Platform.select({ android: isKeyboardOpen, ios: true })}>
-          {children}
-        </KeyboardAvoidingView>
-      </KeyboardViewReadyContext.Provider>
-    </View>);
+        }, children: _jsx(KeyboardViewReadyContext.Provider, { value: hasTransitionedIn, children: _jsx(KeyboardAvoidingView, { keyboardVerticalOffset: pageSheetGap - bottom, behavior: behavior, style: styles.keyboardView, enabled: Platform.select({ android: isKeyboardOpen, ios: true }), children: children }) }) }));
 }
 const useHasTransitionedIn = () => {
     const navigation = useNavigation();

package/build/components/display/keyboard_view.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard_view.js","sourceRoot":"","sources":["../../../src/components/display/keyboard_view.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ParamListBase, useNavigation } from '@react-navigation/native'\nimport type { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { createContext, useContext, useEffect, useState } from 'react'\nimport {\n  Dimensions,\n  Keyboard,\n  KeyboardAvoidingView,\n  Platform,\n  StyleSheet,\n  View,\n  ViewProps,\n} from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { useChatContext } from '../../contexts/chat_context'\n\n// Default true: outside a KeyboardView there's no measurement to wait for.\nconst KeyboardViewReadyContext = createContext(true)\n\nexport const useKeyboardViewReady = () => useContext(KeyboardViewReadyContext)\n\nexport function KeyboardView({ children }: Pick<ViewProps, 'children'>) {\n  const styles = useStyles()\n  const isKeyboardOpen = useKeyboardOpen()\n  const screenHeight = Dimensions.get('screen').height\n  const [pageSheetGap, setPageSheetGap] = useState<number>(0)\n  const hasTransitionedIn = useHasTransitionedIn()\n  const { bottom } = useSafeAreaInsets()\n  const { edgeToEdge } = useChatContext()\n\n  const behavior: 'padding' | 'height' | 'position' | undefined = Platform.select({\n    android: edgeToEdge ? 'padding' : undefined,\n    ios: 'padding',\n  })\n\n  return (\n    <View\n      style={styles.pageGapView}\n      onLayout={event => {\n        const { height: viewHeight } = event.nativeEvent.layout\n        setPageSheetGap(screenHeight - viewHeight)\n      }}\n    >\n      <KeyboardViewReadyContext.Provider value={hasTransitionedIn}>\n        <KeyboardAvoidingView\n          keyboardVerticalOffset={pageSheetGap - bottom}\n          behavior={behavior}\n          style={styles.keyboardView}\n          enabled={Platform.select({ android: isKeyboardOpen, ios: true })}\n        >\n          {children}\n        </KeyboardAvoidingView>\n      </KeyboardViewReadyContext.Provider>\n    </View>\n  )\n}\n\nconst useHasTransitionedIn = () => {\n  const navigation = useNavigation<NativeStackNavigationProp<ParamListBase>>()\n  const [hasTransitionedIn, setHasTransitionedIn] = useState<boolean>(false)\n\n  useEffect(() => {\n    return navigation.addListener('transitionEnd', event => {\n      if (event.data.closing) return\n\n      setHasTransitionedIn(true)\n    })\n  }, [navigation])\n\n  return hasTransitionedIn\n}\n\nexport const useKeyboardOpen = () => {\n  const [open, setOpen] = useState(false)\n\n  useEffect(() => {\n    return Keyboard.addListener('keyboardDidShow', () => {\n      setOpen(true)\n    }).remove\n  }, [])\n\n  useEffect(() => {\n    return Keyboard.addListener('keyboardDidHide', () => {\n      setOpen(false)\n    }).remove\n  }, [])\n\n  return open\n}\n\nconst useStyles = () => {\n  return StyleSheet.create({\n    pageGapView: {\n      flex: 1,\n    },\n    keyboardView: {\n      flex: 1,\n    },\n  })\n}\n"]}
+{"version":3,"file":"keyboard_view.js","sourceRoot":"","sources":["../../../src/components/display/keyboard_view.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ParamListBase, useNavigation } from '@react-navigation/native'\nimport type { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { createContext, useContext, useEffect, useState } from 'react'\nimport {\n  Dimensions,\n  Keyboard,\n  KeyboardAvoidingView,\n  Platform,\n  StyleSheet,\n  View,\n  ViewProps,\n} from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { useChatContext } from '../../contexts/chat_context'\n\n// Default true: outside a KeyboardView there's no measurement to wait for.\nconst KeyboardViewReadyContext = createContext(true)\n\nexport const useKeyboardViewReady = () => useContext(KeyboardViewReadyContext)\n\nexport function KeyboardView({ children }: Pick<ViewProps, 'children'>) {\n  const styles = useStyles()\n  const isKeyboardOpen = useKeyboardOpen()\n  const screenHeight = Dimensions.get('screen').height\n  const [pageSheetGap, setPageSheetGap] = useState<number>(0)\n  const hasTransitionedIn = useHasTransitionedIn()\n  const { bottom } = useSafeAreaInsets()\n  const { edgeToEdge } = useChatContext()\n\n  const behavior: 'padding' | 'height' | 'position' | undefined = Platform.select({\n    android: edgeToEdge ? 'padding' : undefined,\n    ios: 'padding',\n  })\n\n  return (\n    <View\n      style={styles.pageGapView}\n      onLayout={event => {\n        const { height: viewHeight } = event.nativeEvent.layout\n        setPageSheetGap(screenHeight - viewHeight)\n      }}\n    >\n      <KeyboardViewReadyContext.Provider value={hasTransitionedIn}>\n        <KeyboardAvoidingView\n          keyboardVerticalOffset={pageSheetGap - bottom}\n          behavior={behavior}\n          style={styles.keyboardView}\n          enabled={Platform.select({ android: isKeyboardOpen, ios: true })}\n        >\n          {children}\n        </KeyboardAvoidingView>\n      </KeyboardViewReadyContext.Provider>\n    </View>\n  )\n}\n\nconst useHasTransitionedIn = () => {\n  const navigation = useNavigation<NativeStackNavigationProp<ParamListBase>>()\n  const [hasTransitionedIn, setHasTransitionedIn] = useState<boolean>(false)\n\n  useEffect(() => {\n    return navigation.addListener('transitionEnd', event => {\n      if (event.data.closing) return\n\n      setHasTransitionedIn(true)\n    })\n  }, [navigation])\n\n  return hasTransitionedIn\n}\n\nexport const useKeyboardOpen = () => {\n  const [open, setOpen] = useState(false)\n\n  useEffect(() => {\n    return Keyboard.addListener('keyboardDidShow', () => {\n      setOpen(true)\n    }).remove\n  }, [])\n\n  useEffect(() => {\n    return Keyboard.addListener('keyboardDidHide', () => {\n      setOpen(false)\n    }).remove\n  }, [])\n\n  return open\n}\n\nconst useStyles = () => {\n  return StyleSheet.create({\n    pageGapView: {\n      flex: 1,\n    },\n    keyboardView: {\n      flex: 1,\n    },\n  })\n}\n"]}

package/build/components/display/person.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
 import { type ViewStyle } from 'react-native';
 import { MemberResource } from '../../types';
 interface PersonProps {
     person: MemberResource;
     style?: ViewStyle;
 }
-export declare function Person({ person, style }: PersonProps): React.JSX.Element;
+export declare function Person({ person, style }: PersonProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=person.d.ts.map

package/build/components/display/person.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"person.d.ts","sourceRoot":"","sources":["../../../src/components/display/person.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAU5C,UAAU,WAAW;IACnB,MAAM,EAAE,cAAc,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,WAAW,qBAgBpD"}
+{"version":3,"file":"person.d.ts","sourceRoot":"","sources":["../../../src/components/display/person.tsx"],"names":[],"mappings":"AACA,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAU5C,UAAU,WAAW;IACnB,MAAM,EAAE,cAAc,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,WAAW,2CAgBpD"}

package/build/components/display/person.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { StyleSheet, View } from 'react-native';
 import { platformFontWeightMedium } from '../../utils/styles';
 import { Avatar } from './avatar';
@@ -6,17 +6,7 @@ import { Badge } from './badge';
 import { Text } from './text';
 export function Person({ person, style }) {
     const styles = useStyles();
-    return (<View style={[styles.wrapper, style]}>
-      <Avatar sourceUri={person.avatar}/>
-      <View style={styles.content}>
-        <Text style={styles.name} numberOfLines={2}>
-          {person.name}
-        </Text>
-        <View style={styles.badges}>
-          {person.badges?.map((badge, index) => <Badge key={index} label={badge.title}/>)}
-        </View>
-      </View>
-    </View>);
+    return (_jsxs(View, { style: [styles.wrapper, style], children: [_jsx(Avatar, { sourceUri: person.avatar }), _jsxs(View, { style: styles.content, children: [_jsx(Text, { style: styles.name, numberOfLines: 2, children: person.name }), _jsx(View, { style: styles.badges, children: person.badges?.map((badge, index) => _jsx(Badge, { label: badge.title }, index)) })] })] }));
 }
 // =================================
 // ====== Styles ===================

package/build/components/display/person.js.map

@@ -1 +1 @@
-{"version":3,"file":"person.js","sourceRoot":"","sources":["../../../src/components/display/person.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAA;AAE/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAA;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAW7B,MAAM,UAAU,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,EAAe;IACnD,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CACnC;MAAA,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EACjC;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAC1B;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CACzC;UAAA,CAAC,MAAM,CAAC,IAAI,CACd;QAAA,EAAE,IAAI,CACN;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CACzB;UAAA,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,EAAG,CAAC,CAClF;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC;AAED,oCAAoC;AACpC,oCAAoC;AACpC,oCAAoC;AAEpC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,OAAO,EAAE;YACP,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,CAAC;SACP;QACD,OAAO,EAAE;YACP,GAAG,EAAE,CAAC;YACN,UAAU,EAAE,CAAC;SACd;QACD,IAAI,EAAE;YACJ,UAAU,EAAE,wBAAwB;SACrC;QACD,MAAM,EAAE;YACN,aAAa,EAAE,KAAK;YACpB,GAAG,EAAE,CAAC;SACP;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { StyleSheet, View, type ViewStyle } from 'react-native'\nimport { MemberResource } from '../../types'\nimport { platformFontWeightMedium } from '../../utils/styles'\nimport { Avatar } from './avatar'\nimport { Badge } from './badge'\nimport { Text } from './text'\n\n// =================================\n// ====== Components ===============\n// =================================\n\ninterface PersonProps {\n  person: MemberResource\n  style?: ViewStyle\n}\n\nexport function Person({ person, style }: PersonProps) {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.wrapper, style]}>\n      <Avatar sourceUri={person.avatar} />\n      <View style={styles.content}>\n        <Text style={styles.name} numberOfLines={2}>\n          {person.name}\n        </Text>\n        <View style={styles.badges}>\n          {person.badges?.map((badge, index) => <Badge key={index} label={badge.title} />)}\n        </View>\n      </View>\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = () => {\n  return StyleSheet.create({\n    wrapper: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n    },\n    content: {\n      gap: 2,\n      flexShrink: 1,\n    },\n    name: {\n      fontWeight: platformFontWeightMedium,\n    },\n    badges: {\n      flexDirection: 'row',\n      gap: 4,\n    },\n  })\n}\n"]}
+{"version":3,"file":"person.js","sourceRoot":"","sources":["../../../src/components/display/person.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAA;AAE/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAA;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAW7B,MAAM,UAAU,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,EAAe;IACnD,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,aAClC,KAAC,MAAM,IAAC,SAAS,EAAE,MAAM,CAAC,MAAM,GAAI,EACpC,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,aACzB,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,IAAI,EAAE,aAAa,EAAE,CAAC,YACvC,MAAM,CAAC,IAAI,GACP,EACP,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,YACvB,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,KAAC,KAAK,IAAa,KAAK,EAAE,KAAK,CAAC,KAAK,IAAzB,KAAK,CAAwB,CAAC,GAC3E,IACF,IACF,CACR,CAAA;AACH,CAAC;AAED,oCAAoC;AACpC,oCAAoC;AACpC,oCAAoC;AAEpC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,OAAO,EAAE;YACP,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,CAAC;SACP;QACD,OAAO,EAAE;YACP,GAAG,EAAE,CAAC;YACN,UAAU,EAAE,CAAC;SACd;QACD,IAAI,EAAE;YACJ,UAAU,EAAE,wBAAwB;SACrC;QACD,MAAM,EAAE;YACN,aAAa,EAAE,KAAK;YACpB,GAAG,EAAE,CAAC;SACP;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { StyleSheet, View, type ViewStyle } from 'react-native'\nimport { MemberResource } from '../../types'\nimport { platformFontWeightMedium } from '../../utils/styles'\nimport { Avatar } from './avatar'\nimport { Badge } from './badge'\nimport { Text } from './text'\n\n// =================================\n// ====== Components ===============\n// =================================\n\ninterface PersonProps {\n  person: MemberResource\n  style?: ViewStyle\n}\n\nexport function Person({ person, style }: PersonProps) {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.wrapper, style]}>\n      <Avatar sourceUri={person.avatar} />\n      <View style={styles.content}>\n        <Text style={styles.name} numberOfLines={2}>\n          {person.name}\n        </Text>\n        <View style={styles.badges}>\n          {person.badges?.map((badge, index) => <Badge key={index} label={badge.title} />)}\n        </View>\n      </View>\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = () => {\n  return StyleSheet.create({\n    wrapper: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n    },\n    content: {\n      gap: 2,\n      flexShrink: 1,\n    },\n    name: {\n      fontWeight: platformFontWeightMedium,\n    },\n    badges: {\n      flexDirection: 'row',\n      gap: 4,\n    },\n  })\n}\n"]}

package/build/components/display/platform_modal_header_buttons.d.ts

@@ -5,19 +5,19 @@ interface HeaderTextButtonProps {
     title?: string;
     disabled?: boolean;
 }
-export declare const HeaderTextButton: ({ onPress, title, ...props }: HeaderTextButtonProps) => import("react").JSX.Element;
+export declare const HeaderTextButton: ({ onPress, title, ...props }: HeaderTextButtonProps) => import("react/jsx-runtime").JSX.Element;
 interface HeaderDismissButtonProps {
     onPress: () => void;
     title?: string;
     tintColor?: ColorValue;
 }
-export declare const HeaderDismissButton: ({ onPress, title, tintColor, ...props }: HeaderDismissButtonProps) => import("react").JSX.Element;
+export declare const HeaderDismissButton: ({ onPress, title, tintColor, ...props }: HeaderDismissButtonProps) => import("react/jsx-runtime").JSX.Element;
 interface HeaderDoneButtonProps extends NativeStackHeaderRightProps {
     navigation: {
         goBack: () => void;
         getState: () => any;
     };
 }
-export declare const HeaderDoneButton: ({ navigation, ...props }: HeaderDoneButtonProps) => import("react").JSX.Element | null;
+export declare const HeaderDoneButton: ({ navigation, ...props }: HeaderDoneButtonProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};
 //# sourceMappingURL=platform_modal_header_buttons.d.ts.map

package/build/components/display/platform_modal_header_buttons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"platform_modal_header_buttons.d.ts","sourceRoot":"","sources":["../../../src/components/display/platform_modal_header_buttons.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAA;AACjF,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAA;AAK/D,UAAU,qBAAqB;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,gBAAgB,GAAI,8BAI9B,qBAAqB,gCAavB,CAAA;AAED,UAAU,wBAAwB;IAChC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,UAAU,CAAA;CACvB;AAED,eAAO,MAAM,mBAAmB,GAAI,yCAKjC,wBAAwB,gCAoB1B,CAAA;AAED,UAAU,qBAAsB,SAAQ,2BAA2B;IACjE,UAAU,EAAE;QAAE,MAAM,EAAE,MAAM,IAAI,CAAC;QAAC,QAAQ,EAAE,MAAM,GAAG,CAAA;KAAE,CAAA;CACxD;AAED,eAAO,MAAM,gBAAgB,GAAI,0BAA0B,qBAAqB,uCAS/E,CAAA"}
+{"version":3,"file":"platform_modal_header_buttons.d.ts","sourceRoot":"","sources":["../../../src/components/display/platform_modal_header_buttons.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAA;AACjF,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAA;AAK/D,UAAU,qBAAqB;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,gBAAgB,GAAI,8BAI9B,qBAAqB,4CAavB,CAAA;AAED,UAAU,wBAAwB;IAChC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,UAAU,CAAA;CACvB;AAED,eAAO,MAAM,mBAAmB,GAAI,yCAKjC,wBAAwB,4CAoB1B,CAAA;AAED,UAAU,qBAAsB,SAAQ,2BAA2B;IACjE,UAAU,EAAE;QAAE,MAAM,EAAE,MAAM,IAAI,CAAC;QAAC,QAAQ,EAAE,MAAM,GAAG,CAAA;KAAE,CAAA;CACxD;AAED,eAAO,MAAM,gBAAgB,GAAI,0BAA0B,qBAAqB,mDAS/E,CAAA"}

package/build/components/display/platform_modal_header_buttons.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { HeaderButton } from '@react-navigation/elements';
 import { Platform, StyleSheet } from 'react-native';
 import { useTheme } from '../../hooks';
@@ -5,19 +6,13 @@ import { Icon } from './icon';
 import { TextButton } from './text_button';
 export const HeaderTextButton = ({ onPress, title = 'Submit', ...props }) => {
     const styles = useStyles();
-    return (<TextButton maxFontSizeMultiplier={1} onPress={onPress} textStyle={[styles.interactionColor, props.disabled && styles.disabledColor]} {...props}>
-      {title}
-    </TextButton>);
+    return (_jsx(TextButton, { maxFontSizeMultiplier: 1, onPress: onPress, textStyle: [styles.interactionColor, props.disabled && styles.disabledColor], ...props, children: title }));
 };
 export const HeaderDismissButton = ({ onPress, title = 'Cancel', tintColor, ...props }) => {
     const styles = useStyles();
     return Platform.select({
-        ios: (<TextButton maxFontSizeMultiplier={1} onPress={onPress} textStyle={[styles.interactionColor, styles.iosCancelButton]} {...props}>
-        {title}
-      </TextButton>),
-        default: (<HeaderButton onPress={onPress} style={[styles.androidCancelButton]} {...props}>
-        <Icon name="general.x" size={16} color={tintColor}/>
-      </HeaderButton>),
+        ios: (_jsx(TextButton, { maxFontSizeMultiplier: 1, onPress: onPress, textStyle: [styles.interactionColor, styles.iosCancelButton], ...props, children: title })),
+        default: (_jsx(HeaderButton, { onPress: onPress, style: [styles.androidCancelButton], ...props, children: _jsx(Icon, { name: "general.x", size: 16, color: tintColor }) })),
     });
 };
 export const HeaderDoneButton = ({ navigation, ...props }) => {
@@ -26,7 +21,7 @@ export const HeaderDoneButton = ({ navigation, ...props }) => {
     if (!isFirstScreen) {
         return null;
     }
-    return <HeaderTextButton {...props} onPress={navigation.goBack} title="Done"/>;
+    return _jsx(HeaderTextButton, { ...props, onPress: navigation.goBack, title: "Done" });
 };
 const useStyles = () => {
     const { colors } = useTheme();

package/build/components/display/platform_modal_header_buttons.js.map

@@ -1 +1 @@
-{"version":3,"file":"platform_modal_header_buttons.js","sourceRoot":"","sources":["../../../src/components/display/platform_modal_header_buttons.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AAEzD,OAAO,EAAc,QAAQ,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAQ1C,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,OAAO,EACP,KAAK,GAAG,QAAQ,EAChB,GAAG,KAAK,EACc,EAAE,EAAE;IAC1B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,UAAU,CACT,qBAAqB,CAAC,CAAC,CAAC,CAAC,CACzB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,gBAAgB,EAAE,KAAK,CAAC,QAAQ,IAAI,MAAM,CAAC,aAAa,CAAC,CAAC,CAC7E,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,KAAK,CACR;IAAA,EAAE,UAAU,CAAC,CACd,CAAA;AACH,CAAC,CAAA;AAQD,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAClC,OAAO,EACP,KAAK,GAAG,QAAQ,EAChB,SAAS,EACT,GAAG,KAAK,EACiB,EAAE,EAAE;IAC7B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,QAAQ,CAAC,MAAM,CAAC;QACrB,GAAG,EAAE,CACH,CAAC,UAAU,CACT,qBAAqB,CAAC,CAAC,CAAC,CAAC,CACzB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,gBAAgB,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,CAC7D,IAAI,KAAK,CAAC,CAEV;QAAA,CAAC,KAAK,CACR;MAAA,EAAE,UAAU,CAAC,CACd;QACD,OAAO,EAAE,CACP,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAC7E;QAAA,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,EACpD;MAAA,EAAE,YAAY,CAAC,CAChB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA;AAMD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,UAAU,EAAE,GAAG,KAAK,EAAyB,EAAE,EAAE;IAClF,MAAM,KAAK,GAAG,UAAU,CAAC,QAAQ,EAAE,CAAA;IACnC,MAAM,aAAa,GAAG,KAAK,CAAC,KAAK,KAAK,CAAC,CAAA;IAEvC,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CAAC,gBAAgB,CAAC,IAAI,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,EAAG,CAAA;AACjF,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,gBAAgB,EAAE;YAChB,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC;gBACrB,GAAG,EAAE,MAAM,CAAC,6BAA6B;gBACzC,OAAO,EAAE,MAAM,CAAC,iCAAiC;aAClD,CAAC;SACH;QACD,mBAAmB,EAAE;YACnB,WAAW,EAAE,EAAE;SAChB;QACD,eAAe,EAAE;YACf,UAAU,EAAE,QAAQ;SACrB;QACD,aAAa,EAAE;YACb,KAAK,EAAE,MAAM,CAAC,wBAAwB;SACvC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { HeaderButton } from '@react-navigation/elements'\nimport type { NativeStackHeaderRightProps } from '@react-navigation/native-stack'\nimport { ColorValue, Platform, StyleSheet } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { Icon } from './icon'\nimport { TextButton } from './text_button'\n\ninterface HeaderTextButtonProps {\n  onPress: () => void\n  title?: string\n  disabled?: boolean\n}\n\nexport const HeaderTextButton = ({\n  onPress,\n  title = 'Submit',\n  ...props\n}: HeaderTextButtonProps) => {\n  const styles = useStyles()\n\n  return (\n    <TextButton\n      maxFontSizeMultiplier={1}\n      onPress={onPress}\n      textStyle={[styles.interactionColor, props.disabled && styles.disabledColor]}\n      {...props}\n    >\n      {title}\n    </TextButton>\n  )\n}\n\ninterface HeaderDismissButtonProps {\n  onPress: () => void\n  title?: string\n  tintColor?: ColorValue\n}\n\nexport const HeaderDismissButton = ({\n  onPress,\n  title = 'Cancel',\n  tintColor,\n  ...props\n}: HeaderDismissButtonProps) => {\n  const styles = useStyles()\n\n  return Platform.select({\n    ios: (\n      <TextButton\n        maxFontSizeMultiplier={1}\n        onPress={onPress}\n        textStyle={[styles.interactionColor, styles.iosCancelButton]}\n        {...props}\n      >\n        {title}\n      </TextButton>\n    ),\n    default: (\n      <HeaderButton onPress={onPress} style={[styles.androidCancelButton]} {...props}>\n        <Icon name=\"general.x\" size={16} color={tintColor} />\n      </HeaderButton>\n    ),\n  })\n}\n\ninterface HeaderDoneButtonProps extends NativeStackHeaderRightProps {\n  navigation: { goBack: () => void; getState: () => any }\n}\n\nexport const HeaderDoneButton = ({ navigation, ...props }: HeaderDoneButtonProps) => {\n  const state = navigation.getState()\n  const isFirstScreen = state.index === 0\n\n  if (!isFirstScreen) {\n    return null\n  }\n\n  return <HeaderTextButton {...props} onPress={navigation.goBack} title=\"Done\" />\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    interactionColor: {\n      color: Platform.select({\n        ios: colors.iOSModalHeaderButtonTextColor,\n        android: colors.androidModalHeaderButtonTextColor,\n      }),\n    },\n    androidCancelButton: {\n      marginRight: 16,\n    },\n    iosCancelButton: {\n      fontWeight: 'normal',\n    },\n    disabledColor: {\n      color: colors.textColorDefaultDisabled,\n    },\n  })\n}\n"]}
+{"version":3,"file":"platform_modal_header_buttons.js","sourceRoot":"","sources":["../../../src/components/display/platform_modal_header_buttons.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AAEzD,OAAO,EAAc,QAAQ,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAQ1C,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,OAAO,EACP,KAAK,GAAG,QAAQ,EAChB,GAAG,KAAK,EACc,EAAE,EAAE;IAC1B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,KAAC,UAAU,IACT,qBAAqB,EAAE,CAAC,EACxB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,MAAM,CAAC,gBAAgB,EAAE,KAAK,CAAC,QAAQ,IAAI,MAAM,CAAC,aAAa,CAAC,KACxE,KAAK,YAER,KAAK,GACK,CACd,CAAA;AACH,CAAC,CAAA;AAQD,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAClC,OAAO,EACP,KAAK,GAAG,QAAQ,EAChB,SAAS,EACT,GAAG,KAAK,EACiB,EAAE,EAAE;IAC7B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,QAAQ,CAAC,MAAM,CAAC;QACrB,GAAG,EAAE,CACH,KAAC,UAAU,IACT,qBAAqB,EAAE,CAAC,EACxB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,MAAM,CAAC,gBAAgB,EAAE,MAAM,CAAC,eAAe,CAAC,KACxD,KAAK,YAER,KAAK,GACK,CACd;QACD,OAAO,EAAE,CACP,KAAC,YAAY,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,KAAM,KAAK,YAC5E,KAAC,IAAI,IAAC,IAAI,EAAC,WAAW,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,GAAI,GACxC,CAChB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA;AAMD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,UAAU,EAAE,GAAG,KAAK,EAAyB,EAAE,EAAE;IAClF,MAAM,KAAK,GAAG,UAAU,CAAC,QAAQ,EAAE,CAAA;IACnC,MAAM,aAAa,GAAG,KAAK,CAAC,KAAK,KAAK,CAAC,CAAA;IAEvC,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,KAAC,gBAAgB,OAAK,KAAK,EAAE,OAAO,EAAE,UAAU,CAAC,MAAM,EAAE,KAAK,EAAC,MAAM,GAAG,CAAA;AACjF,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,gBAAgB,EAAE;YAChB,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC;gBACrB,GAAG,EAAE,MAAM,CAAC,6BAA6B;gBACzC,OAAO,EAAE,MAAM,CAAC,iCAAiC;aAClD,CAAC;SACH;QACD,mBAAmB,EAAE;YACnB,WAAW,EAAE,EAAE;SAChB;QACD,eAAe,EAAE;YACf,UAAU,EAAE,QAAQ;SACrB;QACD,aAAa,EAAE;YACb,KAAK,EAAE,MAAM,CAAC,wBAAwB;SACvC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { HeaderButton } from '@react-navigation/elements'\nimport type { NativeStackHeaderRightProps } from '@react-navigation/native-stack'\nimport { ColorValue, Platform, StyleSheet } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { Icon } from './icon'\nimport { TextButton } from './text_button'\n\ninterface HeaderTextButtonProps {\n  onPress: () => void\n  title?: string\n  disabled?: boolean\n}\n\nexport const HeaderTextButton = ({\n  onPress,\n  title = 'Submit',\n  ...props\n}: HeaderTextButtonProps) => {\n  const styles = useStyles()\n\n  return (\n    <TextButton\n      maxFontSizeMultiplier={1}\n      onPress={onPress}\n      textStyle={[styles.interactionColor, props.disabled && styles.disabledColor]}\n      {...props}\n    >\n      {title}\n    </TextButton>\n  )\n}\n\ninterface HeaderDismissButtonProps {\n  onPress: () => void\n  title?: string\n  tintColor?: ColorValue\n}\n\nexport const HeaderDismissButton = ({\n  onPress,\n  title = 'Cancel',\n  tintColor,\n  ...props\n}: HeaderDismissButtonProps) => {\n  const styles = useStyles()\n\n  return Platform.select({\n    ios: (\n      <TextButton\n        maxFontSizeMultiplier={1}\n        onPress={onPress}\n        textStyle={[styles.interactionColor, styles.iosCancelButton]}\n        {...props}\n      >\n        {title}\n      </TextButton>\n    ),\n    default: (\n      <HeaderButton onPress={onPress} style={[styles.androidCancelButton]} {...props}>\n        <Icon name=\"general.x\" size={16} color={tintColor} />\n      </HeaderButton>\n    ),\n  })\n}\n\ninterface HeaderDoneButtonProps extends NativeStackHeaderRightProps {\n  navigation: { goBack: () => void; getState: () => any }\n}\n\nexport const HeaderDoneButton = ({ navigation, ...props }: HeaderDoneButtonProps) => {\n  const state = navigation.getState()\n  const isFirstScreen = state.index === 0\n\n  if (!isFirstScreen) {\n    return null\n  }\n\n  return <HeaderTextButton {...props} onPress={navigation.goBack} title=\"Done\" />\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    interactionColor: {\n      color: Platform.select({\n        ios: colors.iOSModalHeaderButtonTextColor,\n        android: colors.androidModalHeaderButtonTextColor,\n      }),\n    },\n    androidCancelButton: {\n      marginRight: 16,\n    },\n    iosCancelButton: {\n      fontWeight: 'normal',\n    },\n    disabledColor: {\n      color: colors.textColorDefaultDisabled,\n    },\n  })\n}\n"]}

package/build/components/display/pressable_row.d.ts

@@ -10,5 +10,5 @@ export interface PressableRowProps extends PropsWithChildren {
     iconPath?: IconProps['name'];
     iconColor?: string;
 }
-export declare const PressableRow: ({ children, isActive, onPress, style, text, textStyle, iconPath, iconColor, }: PressableRowProps) => import("react").JSX.Element;
+export declare const PressableRow: ({ children, isActive, onPress, style, text, textStyle, iconPath, iconColor, }: PressableRowProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=pressable_row.d.ts.map

package/build/components/display/pressable_row.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pressable_row.d.ts","sourceRoot":"","sources":["../../../src/components/display/pressable_row.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAE1D,OAAO,EAAQ,SAAS,EAAE,MAAM,QAAQ,CAAA;AAGxC,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,GAAG,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,YAAY,GAAI,+EAS1B,iBAAiB,gCAsBnB,CAAA"}
+{"version":3,"file":"pressable_row.d.ts","sourceRoot":"","sources":["../../../src/components/display/pressable_row.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAE1D,OAAO,EAAQ,SAAS,EAAE,MAAM,QAAQ,CAAA;AAGxC,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,GAAG,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,YAAY,GAAI,+EAS1B,iBAAiB,4CAsBnB,CAAA"}

package/build/components/display/pressable_row.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PlatformPressable } from '@react-navigation/elements';
 import { StyleSheet, View } from 'react-native';
 import { useTheme } from '../../hooks';
@@ -5,13 +6,7 @@ import { Icon } from './icon';
 import { Text } from './text';
 export const PressableRow = ({ children, isActive, onPress, style, text, textStyle, iconPath, iconColor, }) => {
     const styles = useRowStyles({ isActive, iconColor });
-    return (<PlatformPressable style={styles.container} onPress={onPress} accessibilityRole="radio" accessibilityState={{ selected: isActive }}>
-      <View style={[styles.innerContainer, style]}>
-        {children}
-        <Text style={textStyle}>{text}</Text>
-        <Icon name={iconPath || 'general.check'} size={16} style={styles.rowIconRight} accessibilityElementsHidden/>
-      </View>
-    </PlatformPressable>);
+    return (_jsx(PlatformPressable, { style: styles.container, onPress: onPress, accessibilityRole: "radio", accessibilityState: { selected: isActive }, children: _jsxs(View, { style: [styles.innerContainer, style], children: [children, _jsx(Text, { style: textStyle, children: text }), _jsx(Icon, { name: iconPath || 'general.check', size: 16, style: styles.rowIconRight, accessibilityElementsHidden: true })] }) }));
 };
 const ASPECT_RATIO = 16 / 9;
 const THUMBNAIL_WIDTH = 80;

package/build/components/display/pressable_row.js.map

@@ -1 +1 @@
-{"version":3,"file":"pressable_row.js","sourceRoot":"","sources":["../../../src/components/display/pressable_row.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport { PropsWithChildren } from 'react'\nimport { StyleSheet, View, ViewStyle } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { Icon, IconProps } from './icon'\nimport { Text } from './text'\n\nexport interface PressableRowProps extends PropsWithChildren {\n  isActive?: boolean\n  onPress: () => void\n  style?: ViewStyle\n  textStyle?: any\n  text: string\n  iconPath?: IconProps['name']\n  iconColor?: string\n}\n\nexport const PressableRow = ({\n  children,\n  isActive,\n  onPress,\n  style,\n  text,\n  textStyle,\n  iconPath,\n  iconColor,\n}: PressableRowProps) => {\n  const styles = useRowStyles({ isActive, iconColor })\n\n  return (\n    <PlatformPressable\n      style={styles.container}\n      onPress={onPress}\n      accessibilityRole=\"radio\"\n      accessibilityState={{ selected: isActive }}\n    >\n      <View style={[styles.innerContainer, style]}>\n        {children}\n        <Text style={textStyle}>{text}</Text>\n        <Icon\n          name={iconPath || 'general.check'}\n          size={16}\n          style={styles.rowIconRight}\n          accessibilityElementsHidden\n        />\n      </View>\n    </PlatformPressable>\n  )\n}\n\nconst ASPECT_RATIO = 16 / 9\nconst THUMBNAIL_WIDTH = 80\nconst THUMBNAIL_HEIGHT = THUMBNAIL_WIDTH / ASPECT_RATIO\n\nconst useRowStyles = ({\n  isActive = false,\n  iconColor,\n}: { isActive?: boolean; iconColor?: string } = {}) => {\n  const theme = useTheme()\n  return StyleSheet.create({\n    container: {\n      paddingLeft: 16,\n    },\n    innerContainer: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n      borderBottomWidth: 1,\n      borderBottomColor: theme.colors.fillColorNeutral050Base,\n      paddingVertical: 12,\n      paddingRight: 16,\n    },\n    borderLessRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n      paddingVertical: 12,\n      paddingRight: 16,\n      paddingLeft: 16,\n    },\n    viewMoreButton: {\n      flex: 1,\n    },\n    row: {},\n    rowImage: {\n      width: THUMBNAIL_WIDTH,\n      height: THUMBNAIL_HEIGHT,\n      borderRadius: 4,\n    },\n    rowContent: {\n      flexShrink: 1,\n    },\n    rowIconRight: {\n      marginLeft: 'auto',\n      color: iconColor || theme.colors.iconColorDefaultDim,\n      opacity: isActive ? 1 : 0,\n    },\n    rowTitle: {\n      fontSize: 16,\n      flexShrink: 1,\n    },\n  })\n}\n"]}
+{"version":3,"file":"pressable_row.js","sourceRoot":"","sources":["../../../src/components/display/pressable_row.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAE9D,OAAO,EAAE,UAAU,EAAE,IAAI,EAAa,MAAM,cAAc,CAAA;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAY7B,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,SAAS,GACS,EAAE,EAAE;IACtB,MAAM,MAAM,GAAG,YAAY,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAA;IAEpD,OAAO,CACL,KAAC,iBAAiB,IAChB,KAAK,EAAE,MAAM,CAAC,SAAS,EACvB,OAAO,EAAE,OAAO,EAChB,iBAAiB,EAAC,OAAO,EACzB,kBAAkB,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAE1C,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,cAAc,EAAE,KAAK,CAAC,aACxC,QAAQ,EACT,KAAC,IAAI,IAAC,KAAK,EAAE,SAAS,YAAG,IAAI,GAAQ,EACrC,KAAC,IAAI,IACH,IAAI,EAAE,QAAQ,IAAI,eAAe,EACjC,IAAI,EAAE,EAAE,EACR,KAAK,EAAE,MAAM,CAAC,YAAY,EAC1B,2BAA2B,SAC3B,IACG,GACW,CACrB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,YAAY,GAAG,EAAE,GAAG,CAAC,CAAA;AAC3B,MAAM,eAAe,GAAG,EAAE,CAAA;AAC1B,MAAM,gBAAgB,GAAG,eAAe,GAAG,YAAY,CAAA;AAEvD,MAAM,YAAY,GAAG,CAAC,EACpB,QAAQ,GAAG,KAAK,EAChB,SAAS,MACqC,EAAE,EAAE,EAAE;IACpD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,WAAW,EAAE,EAAE;SAChB;QACD,cAAc,EAAE;YACd,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,EAAE;YACP,iBAAiB,EAAE,CAAC;YACpB,iBAAiB,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB;YACvD,eAAe,EAAE,EAAE;YACnB,YAAY,EAAE,EAAE;SACjB;QACD,aAAa,EAAE;YACb,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,EAAE;YACP,eAAe,EAAE,EAAE;YACnB,YAAY,EAAE,EAAE;YAChB,WAAW,EAAE,EAAE;SAChB;QACD,cAAc,EAAE;YACd,IAAI,EAAE,CAAC;SACR;QACD,GAAG,EAAE,EAAE;QACP,QAAQ,EAAE;YACR,KAAK,EAAE,eAAe;YACtB,MAAM,EAAE,gBAAgB;YACxB,YAAY,EAAE,CAAC;SAChB;QACD,UAAU,EAAE;YACV,UAAU,EAAE,CAAC;SACd;QACD,YAAY,EAAE;YACZ,UAAU,EAAE,MAAM;YAClB,KAAK,EAAE,SAAS,IAAI,KAAK,CAAC,MAAM,CAAC,mBAAmB;YACpD,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC1B;QACD,QAAQ,EAAE;YACR,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,CAAC;SACd;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport { PropsWithChildren } from 'react'\nimport { StyleSheet, View, ViewStyle } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { Icon, IconProps } from './icon'\nimport { Text } from './text'\n\nexport interface PressableRowProps extends PropsWithChildren {\n  isActive?: boolean\n  onPress: () => void\n  style?: ViewStyle\n  textStyle?: any\n  text: string\n  iconPath?: IconProps['name']\n  iconColor?: string\n}\n\nexport const PressableRow = ({\n  children,\n  isActive,\n  onPress,\n  style,\n  text,\n  textStyle,\n  iconPath,\n  iconColor,\n}: PressableRowProps) => {\n  const styles = useRowStyles({ isActive, iconColor })\n\n  return (\n    <PlatformPressable\n      style={styles.container}\n      onPress={onPress}\n      accessibilityRole=\"radio\"\n      accessibilityState={{ selected: isActive }}\n    >\n      <View style={[styles.innerContainer, style]}>\n        {children}\n        <Text style={textStyle}>{text}</Text>\n        <Icon\n          name={iconPath || 'general.check'}\n          size={16}\n          style={styles.rowIconRight}\n          accessibilityElementsHidden\n        />\n      </View>\n    </PlatformPressable>\n  )\n}\n\nconst ASPECT_RATIO = 16 / 9\nconst THUMBNAIL_WIDTH = 80\nconst THUMBNAIL_HEIGHT = THUMBNAIL_WIDTH / ASPECT_RATIO\n\nconst useRowStyles = ({\n  isActive = false,\n  iconColor,\n}: { isActive?: boolean; iconColor?: string } = {}) => {\n  const theme = useTheme()\n  return StyleSheet.create({\n    container: {\n      paddingLeft: 16,\n    },\n    innerContainer: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n      borderBottomWidth: 1,\n      borderBottomColor: theme.colors.fillColorNeutral050Base,\n      paddingVertical: 12,\n      paddingRight: 16,\n    },\n    borderLessRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n      paddingVertical: 12,\n      paddingRight: 16,\n      paddingLeft: 16,\n    },\n    viewMoreButton: {\n      flex: 1,\n    },\n    row: {},\n    rowImage: {\n      width: THUMBNAIL_WIDTH,\n      height: THUMBNAIL_HEIGHT,\n      borderRadius: 4,\n    },\n    rowContent: {\n      flexShrink: 1,\n    },\n    rowIconRight: {\n      marginLeft: 'auto',\n      color: iconColor || theme.colors.iconColorDefaultDim,\n      opacity: isActive ? 1 : 0,\n    },\n    rowTitle: {\n      fontSize: 16,\n      flexShrink: 1,\n    },\n  })\n}\n"]}

package/build/components/display/spinner.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 interface SpinnerProps {
     /**
@@ -18,6 +17,6 @@ interface SpinnerProps {
      */
     style?: StyleProp<ViewStyle>;
 }
-export declare function Spinner({ size, maxFontSizeMultiplier, minFontSizeMultiplier, style, }: SpinnerProps): React.JSX.Element;
+export declare function Spinner({ size, maxFontSizeMultiplier, minFontSizeMultiplier, style, }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=spinner.d.ts.map

package/build/components/display/spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../src/components/display/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,EAAE,SAAS,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAoBrE,UAAU,YAAY;IACpB;;SAEK;IACL,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC7B;AAED,wBAAgB,OAAO,CAAC,EACtB,IAAS,EACT,qBAA+C,EAC/C,qBAA+C,EAC/C,KAAK,GACN,EAAE,YAAY,qBAkCd"}
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../src/components/display/spinner.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAA;AAoBrE,UAAU,YAAY;IACpB;;SAEK;IACL,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC7B;AAED,wBAAgB,OAAO,CAAC,EACtB,IAAS,EACT,qBAA+C,EAC/C,qBAA+C,EAC/C,KAAK,GACN,EAAE,YAAY,2CAkCd"}

package/build/components/display/spinner.js

@@ -1,4 +1,5 @@
-import React, { useEffect } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
 import { StyleSheet, View } from 'react-native';
 import Animated, { useSharedValue, useAnimatedStyle, withRepeat, withTiming, Easing, } from 'react-native-reanimated';
 import { useFontScale, useTheme } from '../../hooks';
@@ -24,14 +25,7 @@ export function Spinner({ size = 20, maxFontSizeMultiplier = PREVENT_SCALING_DEF
             rotation.value = 0; // Reset rotation when Spinner unmounts
         };
     }, [rotation]);
-    return (<View style={style}>
-      <Animated.View style={[styles.animatedContainer, animatedStyle]}>
-        <View style={styles.clipping}>
-          <View style={[styles.circle, styles.spinner]}/>
-        </View>
-        <View style={[styles.circle, styles.track]}/>
-      </Animated.View>
-    </View>);
+    return (_jsx(View, { style: style, children: _jsxs(Animated.View, { style: [styles.animatedContainer, animatedStyle], children: [_jsx(View, { style: styles.clipping, children: _jsx(View, { style: [styles.circle, styles.spinner] }) }), _jsx(View, { style: [styles.circle, styles.track] })] }) }));
 }
 const useStyles = ({ maxFontSizeMultiplier, minFontSizeMultiplier, size }) => {
     const { colors } = useTheme();

package/build/components/display/spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../src/components/display/spinner.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react'\nimport { StyleProp, StyleSheet, View, ViewStyle } from 'react-native'\nimport Animated, {\n  useSharedValue,\n  useAnimatedStyle,\n  withRepeat,\n  withTiming,\n  Easing,\n} from 'react-native-reanimated'\nimport { useFontScale, useTheme } from '../../hooks'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst PREVENT_SCALING_DEFAULT = 1\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface SpinnerProps {\n  /**\n   *  Size of the spinner in px\n   * */\n  size?: number\n  /**\n   * Specifies the maximum size spinner can scale to if the device's font-size is increased.\n   */\n  maxFontSizeMultiplier?: number\n  /**\n   * Specifies the minimum size spinner can scale to if the device's font-size is decreased.\n   */\n  minFontSizeMultiplier?: number\n  /**\n   * Style to apply to the spinner\n   */\n  style?: StyleProp<ViewStyle>\n}\n\nexport function Spinner({\n  size = 20,\n  maxFontSizeMultiplier = PREVENT_SCALING_DEFAULT,\n  minFontSizeMultiplier = PREVENT_SCALING_DEFAULT,\n  style,\n}: SpinnerProps) {\n  const styles = useStyles({ maxFontSizeMultiplier, minFontSizeMultiplier, size })\n\n  const rotation = useSharedValue(0)\n  const animatedStyle = useAnimatedStyle(() => {\n    return {\n      transform: [{ rotate: `${rotation.value}deg` }],\n    }\n  })\n\n  useEffect(() => {\n    rotation.value = withRepeat(\n      withTiming(360, {\n        duration: 1000,\n        easing: Easing.linear,\n      }),\n      -1 // loops animation infinitely\n    )\n\n    return () => {\n      rotation.value = 0 // Reset rotation when Spinner unmounts\n    }\n  }, [rotation])\n\n  return (\n    <View style={style}>\n      <Animated.View style={[styles.animatedContainer, animatedStyle]}>\n        <View style={styles.clipping}>\n          <View style={[styles.circle, styles.spinner]} />\n        </View>\n        <View style={[styles.circle, styles.track]} />\n      </Animated.View>\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\ninterface Styles {\n  maxFontSizeMultiplier: number | undefined\n  minFontSizeMultiplier: number | undefined\n  size: number\n}\n\nconst useStyles = ({ maxFontSizeMultiplier, minFontSizeMultiplier, size }: Styles) => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier, minFontSizeMultiplier })\n  const scalableSize = size * fontScale\n\n  return StyleSheet.create({\n    animatedContainer: {\n      width: scalableSize,\n      height: scalableSize,\n      borderRadius: scalableSize / 2,\n    },\n    circle: {\n      width: scalableSize,\n      height: scalableSize,\n      borderRadius: scalableSize / 2,\n      borderStyle: 'solid',\n      borderWidth: 3,\n    },\n    spinner: {\n      borderColor: colors.borderColorDefaultDarkest,\n    },\n    track: {\n      borderColor: colors.fillColorNeutral050Base,\n    },\n    clipping: {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      width: scalableSize / 2,\n      height: scalableSize / 2,\n      overflow: 'hidden',\n      zIndex: 200,\n    },\n  })\n}\n"]}
+{"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../src/components/display/spinner.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect } from 'react'\nimport { StyleProp, StyleSheet, View, ViewStyle } from 'react-native'\nimport Animated, {\n  useSharedValue,\n  useAnimatedStyle,\n  withRepeat,\n  withTiming,\n  Easing,\n} from 'react-native-reanimated'\nimport { useFontScale, useTheme } from '../../hooks'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst PREVENT_SCALING_DEFAULT = 1\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface SpinnerProps {\n  /**\n   *  Size of the spinner in px\n   * */\n  size?: number\n  /**\n   * Specifies the maximum size spinner can scale to if the device's font-size is increased.\n   */\n  maxFontSizeMultiplier?: number\n  /**\n   * Specifies the minimum size spinner can scale to if the device's font-size is decreased.\n   */\n  minFontSizeMultiplier?: number\n  /**\n   * Style to apply to the spinner\n   */\n  style?: StyleProp<ViewStyle>\n}\n\nexport function Spinner({\n  size = 20,\n  maxFontSizeMultiplier = PREVENT_SCALING_DEFAULT,\n  minFontSizeMultiplier = PREVENT_SCALING_DEFAULT,\n  style,\n}: SpinnerProps) {\n  const styles = useStyles({ maxFontSizeMultiplier, minFontSizeMultiplier, size })\n\n  const rotation = useSharedValue(0)\n  const animatedStyle = useAnimatedStyle(() => {\n    return {\n      transform: [{ rotate: `${rotation.value}deg` }],\n    }\n  })\n\n  useEffect(() => {\n    rotation.value = withRepeat(\n      withTiming(360, {\n        duration: 1000,\n        easing: Easing.linear,\n      }),\n      -1 // loops animation infinitely\n    )\n\n    return () => {\n      rotation.value = 0 // Reset rotation when Spinner unmounts\n    }\n  }, [rotation])\n\n  return (\n    <View style={style}>\n      <Animated.View style={[styles.animatedContainer, animatedStyle]}>\n        <View style={styles.clipping}>\n          <View style={[styles.circle, styles.spinner]} />\n        </View>\n        <View style={[styles.circle, styles.track]} />\n      </Animated.View>\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\ninterface Styles {\n  maxFontSizeMultiplier: number | undefined\n  minFontSizeMultiplier: number | undefined\n  size: number\n}\n\nconst useStyles = ({ maxFontSizeMultiplier, minFontSizeMultiplier, size }: Styles) => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier, minFontSizeMultiplier })\n  const scalableSize = size * fontScale\n\n  return StyleSheet.create({\n    animatedContainer: {\n      width: scalableSize,\n      height: scalableSize,\n      borderRadius: scalableSize / 2,\n    },\n    circle: {\n      width: scalableSize,\n      height: scalableSize,\n      borderRadius: scalableSize / 2,\n      borderStyle: 'solid',\n      borderWidth: 3,\n    },\n    spinner: {\n      borderColor: colors.borderColorDefaultDarkest,\n    },\n    track: {\n      borderColor: colors.fillColorNeutral050Base,\n    },\n    clipping: {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      width: scalableSize / 2,\n      height: scalableSize / 2,\n      overflow: 'hidden',\n      zIndex: 200,\n    },\n  })\n}\n"]}