@planningcenter/chat-react-native 3.9.3-rc.0 → 3.9.3-rc.2

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

@@ -1 +1 @@
-{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/display/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAO/C,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBA4BhE"}
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/display/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAO/C,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBAwBhE"}

package/build/components/display/switch.js

@@ -6,11 +6,8 @@ import { useTheme } from '../../hooks';
 // =================================
 export function Switch({ disabled, value, ...props }) {
     const { colors } = useTheme();
-    // `switchThumbColor` is deprecated. Use `androidSwitchThumbColor` instead.
-    // TODO: Remove `switchThumbColor` once CCA is updated to use `androidSwitchThumbColor`.
-    const androidSwitchThumbColor = colors.androidSwitchThumbColor ?? colors.switchThumbColor;
     const platformThumbColor = Platform.select({
-        android: value && !disabled ? androidSwitchThumbColor : colors.fillColorNeutral050Base,
+        android: value && !disabled ? colors.androidSwitchThumbColor : colors.fillColorNeutral050Base,
         ios: undefined,
     });
     const platformTrackColor = Platform.select({

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

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/components/display/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,IAAI,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAEpE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,oCAAoC;AACpC,oCAAoC;AACpC,oCAAoC;AAEpC,MAAM,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAe;IAC/D,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,2EAA2E;IAC3E,wFAAwF;IACxF,MAAM,uBAAuB,GAAG,MAAM,CAAC,uBAAuB,IAAI,MAAM,CAAC,gBAAgB,CAAA;IAEzF,MAAM,kBAAkB,GAAG,QAAQ,CAAC,MAAM,CAAC;QACzC,OAAO,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,uBAAuB;QACtF,GAAG,EAAE,SAAS;KACf,CAAC,CAAA;IACF,MAAM,kBAAkB,GAAG,QAAQ,CAAC,MAAM,CAAC;QACzC,OAAO,EAAE;YACP,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS;YACvD,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB;SAC1E;QACD,GAAG,EAAE,SAAS;KACf,CAAC,CAAA;IAEF,OAAO,CACL,CAAC,iBAAiB,CAChB,IAAI,KAAK,CAAC,CACV,UAAU,CAAC,CAAC,kBAAkB,CAAC,CAC/B,UAAU,CAAC,CAAC,kBAAkB,CAAC,CAC/B,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,CAAC,EACnB,CACH,CAAA;AACH,CAAC","sourcesContent":["import React from 'react'\nimport { Platform, Switch as ReactNativeSwitch } from 'react-native'\nimport type { SwitchProps } from 'react-native'\nimport { useTheme } from '../../hooks'\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport function Switch({ disabled, value, ...props }: SwitchProps) {\n  const { colors } = useTheme()\n\n  // `switchThumbColor` is deprecated. Use `androidSwitchThumbColor` instead.\n  // TODO: Remove `switchThumbColor` once CCA is updated to use `androidSwitchThumbColor`.\n  const androidSwitchThumbColor = colors.androidSwitchThumbColor ?? colors.switchThumbColor\n\n  const platformThumbColor = Platform.select({\n    android: value && !disabled ? androidSwitchThumbColor : colors.fillColorNeutral050Base,\n    ios: undefined,\n  })\n  const platformTrackColor = Platform.select({\n    android: {\n      true: disabled ? colors.fillColorNeutral060 : undefined,\n      false: disabled ? colors.fillColorNeutral060 : colors.fillColorNeutral030,\n    },\n    ios: undefined,\n  })\n\n  return (\n    <ReactNativeSwitch\n      {...props}\n      thumbColor={platformThumbColor}\n      trackColor={platformTrackColor}\n      value={value}\n      disabled={disabled}\n    />\n  )\n}\n"]}
+{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/components/display/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,IAAI,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAEpE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,oCAAoC;AACpC,oCAAoC;AACpC,oCAAoC;AAEpC,MAAM,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAe;IAC/D,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,MAAM,kBAAkB,GAAG,QAAQ,CAAC,MAAM,CAAC;QACzC,OAAO,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,uBAAuB;QAC7F,GAAG,EAAE,SAAS;KACf,CAAC,CAAA;IACF,MAAM,kBAAkB,GAAG,QAAQ,CAAC,MAAM,CAAC;QACzC,OAAO,EAAE;YACP,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS;YACvD,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB;SAC1E;QACD,GAAG,EAAE,SAAS;KACf,CAAC,CAAA;IAEF,OAAO,CACL,CAAC,iBAAiB,CAChB,IAAI,KAAK,CAAC,CACV,UAAU,CAAC,CAAC,kBAAkB,CAAC,CAC/B,UAAU,CAAC,CAAC,kBAAkB,CAAC,CAC/B,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,CAAC,EACnB,CACH,CAAA;AACH,CAAC","sourcesContent":["import React from 'react'\nimport { Platform, Switch as ReactNativeSwitch } from 'react-native'\nimport type { SwitchProps } from 'react-native'\nimport { useTheme } from '../../hooks'\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport function Switch({ disabled, value, ...props }: SwitchProps) {\n  const { colors } = useTheme()\n\n  const platformThumbColor = Platform.select({\n    android: value && !disabled ? colors.androidSwitchThumbColor : colors.fillColorNeutral050Base,\n    ios: undefined,\n  })\n  const platformTrackColor = Platform.select({\n    android: {\n      true: disabled ? colors.fillColorNeutral060 : undefined,\n      false: disabled ? colors.fillColorNeutral060 : colors.fillColorNeutral030,\n    },\n    ios: undefined,\n  })\n\n  return (\n    <ReactNativeSwitch\n      {...props}\n      thumbColor={platformThumbColor}\n      trackColor={platformTrackColor}\n      value={value}\n      disabled={disabled}\n    />\n  )\n}\n"]}

package/build/components/primitive/form_sheet.d.ts

@@ -1,8 +1,8 @@
 import { NativeStackNavigationOptions } from '@react-navigation/native-stack';
 import React, { ReactNode } from 'react';
 import { type AccessibilityRole, type StyleProp, type ViewStyle } from 'react-native';
-import { IconString } from '../display';
 import type { ButtonProps, TextButtonProps } from '../display';
+import { IconString } from '../display';
 /**
  * Screen options for the formsheet's NativeStackNavigation route
  * @param {string} options.headerTitle - Doesn't show in UI but good to have for semantic reasons.
@@ -22,7 +22,7 @@ type FormSheetComponents = {
 };
 declare const _default: FormSheetComponents;
 export default _default;
-export type { FormSheetRootProps, FormSheetActionProps, FormSheetHeaderProps, FormSheetHeaderTitleProps, FormSheetHeaderActionsProps, FormSheetHeaderSecondaryButtonProps, FormSheetHeaderPrimaryButtonProps, };
+export type { FormSheetActionProps, FormSheetHeaderActionsProps, FormSheetHeaderPrimaryButtonProps, FormSheetHeaderProps, FormSheetHeaderSecondaryButtonProps, FormSheetHeaderTitleProps, FormSheetRootProps, };
 interface FormSheetRootProps {
     children: ReactNode;
     style?: StyleProp<ViewStyle>;

package/build/components/primitive/form_sheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form_sheet.d.ts","sourceRoot":"","sources":["../../../src/components/primitive/form_sheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAA;AAC7E,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EAKL,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAA;AAIrB,OAAO,EAAiB,UAAU,EAA4B,MAAM,YAAY,CAAA;AAChF,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAM9D;;;;;;GAMG;AACH,eAAO,MAAM,yBAAyB,mDAInC,4BAA4B,KAAQ,4BAQrC,CAAA;AAYF,KAAK,mBAAmB,GAAG;IACzB,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAA;IAClC,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAA;IACtC,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAA;IACtC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAAC,CAAA;IAChD,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAAC,CAAA;IACpD,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,mCAAmC,CAAC,CAAA;IACpE,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,iCAAiC,CAAC,CAAA;CACjE,CAAA;wBAE2B,mBAAmB;AAA/C,wBAA+C;AAC/C,YAAY,EACV,kBAAkB,EAClB,oBAAoB,EACpB,oBAAoB,EACpB,yBAAyB,EACzB,2BAA2B,EAC3B,mCAAmC,EACnC,iCAAiC,GAClC,CAAA;AAMD,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAC5B,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CACpC;AAED,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,kBAAkB,qBASlF;yBATe,aAAa;;;AA8B7B,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAA;CACpB;AAcD,UAAU,yBAAyB;IACjC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAkBD,UAAU,2BAA2B;IACnC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAcD,UAAU,mCACR,SAAQ,IAAI,CAAC,eAAe,EAAE,uBAAuB,CAAC;CAAG;AAY3D,UAAU,iCAAkC,SAAQ,IAAI,CAAC,WAAW,EAAE,uBAAuB,CAAC;CAAG;AAYjG,QAAA,MAAM,6BAA6B;;;CAGzB,CAAA;AAEV,KAAK,8BAA8B,GACjC,CAAC,OAAO,6BAA6B,CAAC,CAAC,MAAM,OAAO,6BAA6B,CAAC,CAAA;AAEpF,UAAU,oBAAoB;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,UAAU,CAAA;IACpB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IACrC,UAAU,CAAC,EAAE,8BAA8B,CAAA;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB"}
+{"version":3,"file":"form_sheet.d.ts","sourceRoot":"","sources":["../../../src/components/primitive/form_sheet.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAA;AAC7E,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EAKL,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAA;AAGrB,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAyB,UAAU,EAAoB,MAAM,YAAY,CAAA;AAMhF;;;;;;GAMG;AACH,eAAO,MAAM,yBAAyB,mDAInC,4BAA4B,KAAQ,4BAQrC,CAAA;AAYF,KAAK,mBAAmB,GAAG;IACzB,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAA;IAClC,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAA;IACtC,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAA;IACtC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAAC,CAAA;IAChD,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAAC,CAAA;IACpD,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,mCAAmC,CAAC,CAAA;IACpE,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,iCAAiC,CAAC,CAAA;CACjE,CAAA;wBAE2B,mBAAmB;AAA/C,wBAA+C;AAC/C,YAAY,EACV,oBAAoB,EACpB,2BAA2B,EAC3B,iCAAiC,EACjC,oBAAoB,EACpB,mCAAmC,EACnC,yBAAyB,EACzB,kBAAkB,GACnB,CAAA;AAMD,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAC5B,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CACpC;AAED,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,kBAAkB,qBASlF;yBATe,aAAa;;;AA8B7B,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAA;CACpB;AAkBD,UAAU,yBAAyB;IACjC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAkBD,UAAU,2BAA2B;IACnC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAcD,UAAU,mCACR,SAAQ,IAAI,CAAC,eAAe,EAAE,uBAAuB,CAAC;CAAG;AAY3D,UAAU,iCAAkC,SAAQ,IAAI,CAAC,WAAW,EAAE,uBAAuB,CAAC;CAAG;AAYjG,QAAA,MAAM,6BAA6B;;;CAGzB,CAAA;AAEV,KAAK,8BAA8B,GACjC,CAAC,OAAO,6BAA6B,CAAC,CAAC,MAAM,OAAO,6BAA6B,CAAC,CAAA;AAEpF,UAAU,oBAAoB;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,UAAU,CAAA;IACpB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IACrC,UAAU,CAAC,EAAE,8BAA8B,CAAA;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB"}

package/build/components/primitive/form_sheet.js

@@ -1,9 +1,9 @@
+import { PlatformPressable, useHeaderHeight } from '@react-navigation/elements';
 import React from 'react';
 import { Platform, StyleSheet, View, useWindowDimensions, } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useTheme } from '../../hooks';
-import { PlatformPressable, useHeaderHeight } from '@react-navigation/elements';
-import { Heading, Icon, Text, Button, TextButton } from '../display';
+import { Button, Heading, Icon, Text, TextButton } from '../display';
 // =================================
 // ====== Exports ==================
 // =================================
@@ -36,8 +36,8 @@ export default FormSheet;
 export function FormSheetRoot({ children, style, contentStyle }) {
     const styles = useStyles();
     return (<View style={[styles.container, style]} collapsable={false}>
-      <AndroidSheetGrabber />
       <View style={[styles.content, contentStyle]}>{children}</View>
+      <AndroidSheetGrabber />
     </View>);
 }
 FormSheetRoot.displayName = 'FormSheet.Root';
@@ -53,7 +53,9 @@ function AndroidSheetGrabber() {
 }
 function FormSheetHeader({ children }) {
     const styles = useStyles();
-    return <View style={styles.header}>{children}</View>;
+    return (<View style={styles.header}>
+      <View style={styles.headerContent}>{children}</View>
+    </View>);
 }
 FormSheetHeader.displayName = 'FormSheet.Header';
 function FormSheetHeaderTitle({ children }) {
@@ -127,7 +129,8 @@ const useStyles = ({ appearance = 'neutral' } = {}) => {
             }),
         },
         androidSheetGrabber: {
-            marginTop: 5,
+            position: 'absolute',
+            top: 5,
             width: 34,
             height: 5,
             backgroundColor: colors.fillColorNeutral040,
@@ -135,7 +138,6 @@ const useStyles = ({ appearance = 'neutral' } = {}) => {
             alignSelf: 'center',
         },
         content: {
-            paddingTop: Platform.select({ android: 16, ios: 20 }),
             ...Platform.select({
                 android: {
                     maxHeight: '100%', // Ensures content above a list (e.g. FormSheet.Header) don't subtract from the FormSheet's height
@@ -143,12 +145,15 @@ const useStyles = ({ appearance = 'neutral' } = {}) => {
             }),
         },
         header: {
-            backgroundColor: colors.fillColorNeutral100Inverted,
             paddingHorizontal: 16,
+            paddingTop: 20,
             paddingBottom: 16,
+            backgroundColor: colors.fillColorNeutral100Inverted,
             gap: 16,
             borderBottomWidth: 1,
             borderBottomColor: colors.borderColorDefaultBase,
+        },
+        headerContent: {
             flexDirection: 'row',
             alignItems: 'center',
             justifyContent: 'space-between',

package/build/components/primitive/form_sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"form_sheet.js","sourceRoot":"","sources":["../../../src/components/primitive/form_sheet.tsx"],"names":[],"mappings":"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","sourcesContent":["import { NativeStackNavigationOptions } from '@react-navigation/native-stack'\nimport React, { ReactNode } from 'react'\nimport {\n  Platform,\n  StyleSheet,\n  View,\n  useWindowDimensions,\n  type AccessibilityRole,\n  type StyleProp,\n  type ViewStyle,\n} from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { useTheme } from '../../hooks'\nimport { PlatformPressable, useHeaderHeight } from '@react-navigation/elements'\nimport { Heading, Icon, IconString, Text, Button, TextButton } from '../display'\nimport type { ButtonProps, TextButtonProps } from '../display'\n\n// =================================\n// ====== Exports ==================\n// =================================\n\n/**\n * Screen options for the formsheet's NativeStackNavigation route\n * @param {string} options.headerTitle - Doesn't show in UI but good to have for semantic reasons.\n * @param {number[]} [options.sheetAllowedDetents] - Controls the height increments the sheet grows to. To prevent bugs in Android, do not specify more then two values and use [0.94] instead of [1] to go full screen.\n * @param {NativeStackNavigationOptions} [options.rest] - Adds or overrides any valid NativeStackNavigationOptions\n * @returns {NativeStackNavigationOptions} Merged NativeStackNavigationOptions\n */\nexport const getFormSheetScreenOptions = ({\n  headerTitle,\n  sheetAllowedDetents = [0.25],\n  ...rest\n}: NativeStackNavigationOptions = {}): NativeStackNavigationOptions => ({\n  presentation: 'formSheet',\n  headerShown: false,\n  sheetAllowedDetents,\n  sheetCornerRadius: 16,\n  sheetGrabberVisible: true,\n  headerTitle,\n  ...rest,\n})\n\nconst FormSheet = {\n  Root: FormSheetRoot,\n  Action: FormSheetAction,\n  Header: FormSheetHeader,\n  HeaderTitle: FormSheetHeaderTitle,\n  HeaderActions: FormSheetHeaderActions,\n  HeaderSecondaryButton: FormSheetHeaderSecondaryButton,\n  HeaderPrimaryButton: FormSheetHeaderPrimaryButton,\n} as const\n\ntype FormSheetComponents = {\n  Root: React.FC<FormSheetRootProps>\n  Action: React.FC<FormSheetActionProps>\n  Header: React.FC<FormSheetHeaderProps>\n  HeaderTitle: React.FC<FormSheetHeaderTitleProps>\n  HeaderActions: React.FC<FormSheetHeaderActionsProps>\n  HeaderSecondaryButton: React.FC<FormSheetHeaderSecondaryButtonProps>\n  HeaderPrimaryButton: React.FC<FormSheetHeaderPrimaryButtonProps>\n}\n\nexport default FormSheet as FormSheetComponents\nexport type {\n  FormSheetRootProps,\n  FormSheetActionProps,\n  FormSheetHeaderProps,\n  FormSheetHeaderTitleProps,\n  FormSheetHeaderActionsProps,\n  FormSheetHeaderSecondaryButtonProps,\n  FormSheetHeaderPrimaryButtonProps,\n}\n\n// ====================================\n// ====== ActionsFormSheetRoot ========\n// ====================================\n\ninterface FormSheetRootProps {\n  children: ReactNode\n  style?: StyleProp<ViewStyle>\n  contentStyle?: StyleProp<ViewStyle>\n}\n\nexport function FormSheetRoot({ children, style, contentStyle }: FormSheetRootProps) {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.container, style]} collapsable={false}>\n      <AndroidSheetGrabber />\n      <View style={[styles.content, contentStyle]}>{children}</View>\n    </View>\n  )\n}\n\nFormSheetRoot.displayName = 'FormSheet.Root'\n\n// ====================================\n// ====== AndroidSheetGrabber =========\n// ====================================\n\nfunction AndroidSheetGrabber() {\n  const styles = useStyles()\n\n  return Platform.select({\n    android: <View style={styles.androidSheetGrabber} />,\n    ios: null,\n  })\n}\n\n// ====================================\n// ====== FormSheetHeader =============\n// ====================================\n\ninterface FormSheetHeaderProps {\n  children: ReactNode\n}\n\nfunction FormSheetHeader({ children }: FormSheetHeaderProps) {\n  const styles = useStyles()\n\n  return <View style={styles.header}>{children}</View>\n}\n\nFormSheetHeader.displayName = 'FormSheet.Header'\n\n// ====================================\n// ====== FormSheetHeaderTitle ========\n// ====================================\n\ninterface FormSheetHeaderTitleProps {\n  children: ReactNode\n}\n\nfunction FormSheetHeaderTitle({ children }: FormSheetHeaderTitleProps) {\n  const styles = useStyles()\n\n  return (\n    <Heading variant=\"h3\" style={styles.headerTitle} maxFontSizeMultiplier={1}>\n      {children}\n    </Heading>\n  )\n}\n\nFormSheetHeaderTitle.displayName = 'FormSheet.HeaderTitle'\n\n// ====================================\n// ====== FormSheetHeaderActions ======\n// ====================================\n\ninterface FormSheetHeaderActionsProps {\n  children: ReactNode\n}\n\nfunction FormSheetHeaderActions({ children }: FormSheetHeaderActionsProps) {\n  const styles = useStyles()\n\n  return <View style={styles.headerActions}>{children}</View>\n}\n\nFormSheetHeaderActions.displayName = 'FormSheet.HeaderActions'\n\n// ===========================================\n// ====== FormSheetHeaderSecondaryButton ====\n// ===========================================\n\ninterface FormSheetHeaderSecondaryButtonProps\n  extends Omit<TextButtonProps, 'maxFontSizeMultiplier'> {}\n\nfunction FormSheetHeaderSecondaryButton(props: FormSheetHeaderSecondaryButtonProps) {\n  return <TextButton {...props} maxFontSizeMultiplier={1} />\n}\n\nFormSheetHeaderSecondaryButton.displayName = 'FormSheet.HeaderSecondaryButton'\n\n// =========================================\n// ====== FormSheetHeaderPrimaryButton ====\n// =========================================\n\ninterface FormSheetHeaderPrimaryButtonProps extends Omit<ButtonProps, 'maxFontSizeMultiplier'> {}\n\nfunction FormSheetHeaderPrimaryButton(props: FormSheetHeaderPrimaryButtonProps) {\n  return <Button {...props} maxFontSizeMultiplier={1} />\n}\n\nFormSheetHeaderPrimaryButton.displayName = 'FormSheet.HeaderPrimaryButton'\n\n// ====================================\n// ====== ActionsFormSheetAction ======\n// ====================================\n\nconst FORM_SHEET_ACTION_APPEARANCES = {\n  neutral: 'neutral',\n  danger: 'danger',\n} as const\n\ntype FormSheetActionAppearanceUnion =\n  (typeof FORM_SHEET_ACTION_APPEARANCES)[keyof typeof FORM_SHEET_ACTION_APPEARANCES]\n\ninterface FormSheetActionProps {\n  title: string\n  iconName: IconString\n  onPress: () => void\n  accessibilityLabel?: string\n  accessibilityHint?: string\n  accessibilityRole?: AccessibilityRole\n  appearance?: FormSheetActionAppearanceUnion\n  disabled?: boolean\n}\n\nfunction FormSheetAction({\n  title,\n  iconName,\n  onPress,\n  accessibilityLabel,\n  accessibilityHint,\n  accessibilityRole = 'button',\n  appearance = 'neutral',\n  disabled = false,\n}: FormSheetActionProps) {\n  const styles = useStyles({ appearance })\n\n  return (\n    <PlatformPressable\n      onPress={onPress}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityHint={accessibilityHint}\n      accessibilityRole={accessibilityRole}\n      style={styles.actionPressable}\n      disabled={disabled}\n    >\n      <Icon name={iconName} size={16} accessibilityElementsHidden style={styles.actionIcon} />\n      <Text style={styles.actionTitle}>{title}</Text>\n    </PlatformPressable>\n  )\n}\n\nFormSheetAction.displayName = 'FormSheet.Action'\n\n// ==================================\n// ====== Styles ====================\n// ==================================\n\ninterface Styles {\n  appearance?: FormSheetActionAppearanceUnion\n}\n\nconst useStyles = ({ appearance = 'neutral' }: Styles = {}) => {\n  const { colors } = useTheme()\n  const { height } = useWindowDimensions()\n  const { bottom, top } = useSafeAreaInsets()\n  const headerHeight = useHeaderHeight()\n\n  const containerHeight = Platform.select({\n    ios: height - top - headerHeight,\n    default: null,\n  })\n\n  const appearanceColorsMap = {\n    neutral: {\n      iconColor: colors.iconColorDefaultPrimary,\n      textColor: colors.textColorDefaultPrimary,\n    },\n    danger: {\n      iconColor: colors.fillColorStatusErrorMedium,\n      textColor: colors.fillColorStatusErrorMedium,\n    },\n  }\n\n  return StyleSheet.create({\n    container: {\n      justifyContent: 'flex-start',\n      paddingBottom: bottom,\n      width: '100%',\n      backgroundColor: colors.fillColorNeutral100Inverted,\n      height: containerHeight,\n      ...Platform.select({\n        ios: {\n          flexGrow: 1, // Ensures the FormSheet children respond to the formsheet height changing on iOS\n        },\n        android: {\n          maxHeight: '100%', // Ensures lists to scroll on Android\n        },\n      }),\n    },\n    androidSheetGrabber: {\n      marginTop: 5,\n      width: 34,\n      height: 5,\n      backgroundColor: colors.fillColorNeutral040,\n      borderRadius: 100,\n      alignSelf: 'center',\n    },\n    content: {\n      paddingTop: Platform.select({ android: 16, ios: 20 }),\n      ...Platform.select({\n        android: {\n          maxHeight: '100%', // Ensures content above a list (e.g. FormSheet.Header) don't subtract from the FormSheet's height\n        },\n      }),\n    },\n    header: {\n      backgroundColor: colors.fillColorNeutral100Inverted,\n      paddingHorizontal: 16,\n      paddingBottom: 16,\n      gap: 16,\n      borderBottomWidth: 1,\n      borderBottomColor: colors.borderColorDefaultBase,\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n    },\n    headerTitle: {\n      textAlign: 'left',\n    },\n    headerActions: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 16,\n    },\n    actionPressable: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      paddingVertical: 12,\n      paddingHorizontal: 16,\n      gap: 8,\n    },\n    actionIcon: {\n      color: appearanceColorsMap[appearance].iconColor,\n    },\n    actionTitle: {\n      color: appearanceColorsMap[appearance].textColor,\n    },\n  })\n}\n"]}
+{"version":3,"file":"form_sheet.js","sourceRoot":"","sources":["../../../src/components/primitive/form_sheet.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable, useHeaderHeight } from '@react-navigation/elements'\nimport { NativeStackNavigationOptions } from '@react-navigation/native-stack'\nimport React, { ReactNode } from 'react'\nimport {\n  Platform,\n  StyleSheet,\n  View,\n  useWindowDimensions,\n  type AccessibilityRole,\n  type StyleProp,\n  type ViewStyle,\n} from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { useTheme } from '../../hooks'\nimport type { ButtonProps, TextButtonProps } from '../display'\nimport { Button, Heading, Icon, IconString, Text, TextButton } from '../display'\n\n// =================================\n// ====== Exports ==================\n// =================================\n\n/**\n * Screen options for the formsheet's NativeStackNavigation route\n * @param {string} options.headerTitle - Doesn't show in UI but good to have for semantic reasons.\n * @param {number[]} [options.sheetAllowedDetents] - Controls the height increments the sheet grows to. To prevent bugs in Android, do not specify more then two values and use [0.94] instead of [1] to go full screen.\n * @param {NativeStackNavigationOptions} [options.rest] - Adds or overrides any valid NativeStackNavigationOptions\n * @returns {NativeStackNavigationOptions} Merged NativeStackNavigationOptions\n */\nexport const getFormSheetScreenOptions = ({\n  headerTitle,\n  sheetAllowedDetents = [0.25],\n  ...rest\n}: NativeStackNavigationOptions = {}): NativeStackNavigationOptions => ({\n  presentation: 'formSheet',\n  headerShown: false,\n  sheetAllowedDetents,\n  sheetCornerRadius: 16,\n  sheetGrabberVisible: true,\n  headerTitle,\n  ...rest,\n})\n\nconst FormSheet = {\n  Root: FormSheetRoot,\n  Action: FormSheetAction,\n  Header: FormSheetHeader,\n  HeaderTitle: FormSheetHeaderTitle,\n  HeaderActions: FormSheetHeaderActions,\n  HeaderSecondaryButton: FormSheetHeaderSecondaryButton,\n  HeaderPrimaryButton: FormSheetHeaderPrimaryButton,\n} as const\n\ntype FormSheetComponents = {\n  Root: React.FC<FormSheetRootProps>\n  Action: React.FC<FormSheetActionProps>\n  Header: React.FC<FormSheetHeaderProps>\n  HeaderTitle: React.FC<FormSheetHeaderTitleProps>\n  HeaderActions: React.FC<FormSheetHeaderActionsProps>\n  HeaderSecondaryButton: React.FC<FormSheetHeaderSecondaryButtonProps>\n  HeaderPrimaryButton: React.FC<FormSheetHeaderPrimaryButtonProps>\n}\n\nexport default FormSheet as FormSheetComponents\nexport type {\n  FormSheetActionProps,\n  FormSheetHeaderActionsProps,\n  FormSheetHeaderPrimaryButtonProps,\n  FormSheetHeaderProps,\n  FormSheetHeaderSecondaryButtonProps,\n  FormSheetHeaderTitleProps,\n  FormSheetRootProps,\n}\n\n// ====================================\n// ====== ActionsFormSheetRoot ========\n// ====================================\n\ninterface FormSheetRootProps {\n  children: ReactNode\n  style?: StyleProp<ViewStyle>\n  contentStyle?: StyleProp<ViewStyle>\n}\n\nexport function FormSheetRoot({ children, style, contentStyle }: FormSheetRootProps) {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.container, style]} collapsable={false}>\n      <View style={[styles.content, contentStyle]}>{children}</View>\n      <AndroidSheetGrabber />\n    </View>\n  )\n}\n\nFormSheetRoot.displayName = 'FormSheet.Root'\n\n// ====================================\n// ====== AndroidSheetGrabber =========\n// ====================================\n\nfunction AndroidSheetGrabber() {\n  const styles = useStyles()\n\n  return Platform.select({\n    android: <View style={styles.androidSheetGrabber} />,\n    ios: null,\n  })\n}\n\n// ====================================\n// ====== FormSheetHeader =============\n// ====================================\n\ninterface FormSheetHeaderProps {\n  children: ReactNode\n}\n\nfunction FormSheetHeader({ children }: FormSheetHeaderProps) {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.header}>\n      <View style={styles.headerContent}>{children}</View>\n    </View>\n  )\n}\n\nFormSheetHeader.displayName = 'FormSheet.Header'\n\n// ====================================\n// ====== FormSheetHeaderTitle ========\n// ====================================\n\ninterface FormSheetHeaderTitleProps {\n  children: ReactNode\n}\n\nfunction FormSheetHeaderTitle({ children }: FormSheetHeaderTitleProps) {\n  const styles = useStyles()\n\n  return (\n    <Heading variant=\"h3\" style={styles.headerTitle} maxFontSizeMultiplier={1}>\n      {children}\n    </Heading>\n  )\n}\n\nFormSheetHeaderTitle.displayName = 'FormSheet.HeaderTitle'\n\n// ====================================\n// ====== FormSheetHeaderActions ======\n// ====================================\n\ninterface FormSheetHeaderActionsProps {\n  children: ReactNode\n}\n\nfunction FormSheetHeaderActions({ children }: FormSheetHeaderActionsProps) {\n  const styles = useStyles()\n\n  return <View style={styles.headerActions}>{children}</View>\n}\n\nFormSheetHeaderActions.displayName = 'FormSheet.HeaderActions'\n\n// ===========================================\n// ====== FormSheetHeaderSecondaryButton ====\n// ===========================================\n\ninterface FormSheetHeaderSecondaryButtonProps\n  extends Omit<TextButtonProps, 'maxFontSizeMultiplier'> {}\n\nfunction FormSheetHeaderSecondaryButton(props: FormSheetHeaderSecondaryButtonProps) {\n  return <TextButton {...props} maxFontSizeMultiplier={1} />\n}\n\nFormSheetHeaderSecondaryButton.displayName = 'FormSheet.HeaderSecondaryButton'\n\n// =========================================\n// ====== FormSheetHeaderPrimaryButton ====\n// =========================================\n\ninterface FormSheetHeaderPrimaryButtonProps extends Omit<ButtonProps, 'maxFontSizeMultiplier'> {}\n\nfunction FormSheetHeaderPrimaryButton(props: FormSheetHeaderPrimaryButtonProps) {\n  return <Button {...props} maxFontSizeMultiplier={1} />\n}\n\nFormSheetHeaderPrimaryButton.displayName = 'FormSheet.HeaderPrimaryButton'\n\n// ====================================\n// ====== ActionsFormSheetAction ======\n// ====================================\n\nconst FORM_SHEET_ACTION_APPEARANCES = {\n  neutral: 'neutral',\n  danger: 'danger',\n} as const\n\ntype FormSheetActionAppearanceUnion =\n  (typeof FORM_SHEET_ACTION_APPEARANCES)[keyof typeof FORM_SHEET_ACTION_APPEARANCES]\n\ninterface FormSheetActionProps {\n  title: string\n  iconName: IconString\n  onPress: () => void\n  accessibilityLabel?: string\n  accessibilityHint?: string\n  accessibilityRole?: AccessibilityRole\n  appearance?: FormSheetActionAppearanceUnion\n  disabled?: boolean\n}\n\nfunction FormSheetAction({\n  title,\n  iconName,\n  onPress,\n  accessibilityLabel,\n  accessibilityHint,\n  accessibilityRole = 'button',\n  appearance = 'neutral',\n  disabled = false,\n}: FormSheetActionProps) {\n  const styles = useStyles({ appearance })\n\n  return (\n    <PlatformPressable\n      onPress={onPress}\n      accessibilityLabel={accessibilityLabel}\n      accessibilityHint={accessibilityHint}\n      accessibilityRole={accessibilityRole}\n      style={styles.actionPressable}\n      disabled={disabled}\n    >\n      <Icon name={iconName} size={16} accessibilityElementsHidden style={styles.actionIcon} />\n      <Text style={styles.actionTitle}>{title}</Text>\n    </PlatformPressable>\n  )\n}\n\nFormSheetAction.displayName = 'FormSheet.Action'\n\n// ==================================\n// ====== Styles ====================\n// ==================================\n\ninterface Styles {\n  appearance?: FormSheetActionAppearanceUnion\n}\n\nconst useStyles = ({ appearance = 'neutral' }: Styles = {}) => {\n  const { colors } = useTheme()\n  const { height } = useWindowDimensions()\n  const { bottom, top } = useSafeAreaInsets()\n  const headerHeight = useHeaderHeight()\n\n  const containerHeight = Platform.select({\n    ios: height - top - headerHeight,\n    default: null,\n  })\n\n  const appearanceColorsMap = {\n    neutral: {\n      iconColor: colors.iconColorDefaultPrimary,\n      textColor: colors.textColorDefaultPrimary,\n    },\n    danger: {\n      iconColor: colors.fillColorStatusErrorMedium,\n      textColor: colors.fillColorStatusErrorMedium,\n    },\n  }\n\n  return StyleSheet.create({\n    container: {\n      justifyContent: 'flex-start',\n      paddingBottom: bottom,\n      width: '100%',\n      backgroundColor: colors.fillColorNeutral100Inverted,\n      height: containerHeight,\n      ...Platform.select({\n        ios: {\n          flexGrow: 1, // Ensures the FormSheet children respond to the formsheet height changing on iOS\n        },\n        android: {\n          maxHeight: '100%', // Ensures lists to scroll on Android\n        },\n      }),\n    },\n    androidSheetGrabber: {\n      position: 'absolute',\n      top: 5,\n      width: 34,\n      height: 5,\n      backgroundColor: colors.fillColorNeutral040,\n      borderRadius: 100,\n      alignSelf: 'center',\n    },\n    content: {\n      ...Platform.select({\n        android: {\n          maxHeight: '100%', // Ensures content above a list (e.g. FormSheet.Header) don't subtract from the FormSheet's height\n        },\n      }),\n    },\n    header: {\n      paddingHorizontal: 16,\n      paddingTop: 20,\n      paddingBottom: 16,\n      backgroundColor: colors.fillColorNeutral100Inverted,\n      gap: 16,\n      borderBottomWidth: 1,\n      borderBottomColor: colors.borderColorDefaultBase,\n    },\n    headerContent: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n    },\n    headerTitle: {\n      textAlign: 'left',\n    },\n    headerActions: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 16,\n    },\n    actionPressable: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      paddingVertical: 12,\n      paddingHorizontal: 16,\n      gap: 8,\n    },\n    actionIcon: {\n      color: appearanceColorsMap[appearance].iconColor,\n    },\n    actionTitle: {\n      color: appearanceColorsMap[appearance].textColor,\n    },\n  })\n}\n"]}

package/build/screens/attachment_actions/attachment_actions_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"attachment_actions_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/attachment_actions/attachment_actions_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAC3E,OAAO,KAAsB,MAAM,OAAO,CAAA;AAK1C,eAAO,MAAM,8BAA8B,uEAEzC,CAAA;AAEF,MAAM,MAAM,4BAA4B,GAAG,iBAAiB,CAAC;IAC3D,YAAY,EAAE,MAAM,CAAA;IACpB,qBAAqB,EAAE,MAAM,CAAA;IAC7B,aAAa,EAAE,MAAM,CAAA;IACrB,eAAe,EAAE,MAAM,CAAA;IACvB,4BAA4B,EAAE,OAAO,CAAA;IACrC,SAAS,EAAE,OAAO,CAAA;CACnB,CAAC,CAAA;AAEF,wBAAgB,uBAAuB,CAAC,EAAE,KAAK,EAAE,EAAE,4BAA4B,qBAwD9E"}
+{"version":3,"file":"attachment_actions_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/attachment_actions/attachment_actions_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAC3E,OAAO,KAAsB,MAAM,OAAO,CAAA;AAK1C,eAAO,MAAM,8BAA8B,uEAEzC,CAAA;AAEF,MAAM,MAAM,4BAA4B,GAAG,iBAAiB,CAAC;IAC3D,YAAY,EAAE,MAAM,CAAA;IACpB,qBAAqB,EAAE,MAAM,CAAA;IAC7B,aAAa,EAAE,MAAM,CAAA;IACrB,eAAe,EAAE,MAAM,CAAA;IACvB,4BAA4B,EAAE,OAAO,CAAA;IACrC,SAAS,EAAE,OAAO,CAAA;CACnB,CAAC,CAAA;AAEF,wBAAgB,uBAAuB,CAAC,EAAE,KAAK,EAAE,EAAE,4BAA4B,qBAyD9E"}

package/build/screens/attachment_actions/attachment_actions_screen.js

@@ -1,6 +1,6 @@
 import { useNavigation } from '@react-navigation/native';
 import React, { useCallback } from 'react';
-import { Alert, Linking } from 'react-native';
+import { Alert, Linking, StyleSheet } from 'react-native';
 import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet';
 import { useDeleteAttachment } from './hooks/useDeleteAttachment';
 export const AttachmentActionsScreenOptions = getFormSheetScreenOptions({
@@ -11,6 +11,7 @@ export function AttachmentActionsScreen({ route }) {
     const { attachmentId, attachmentContentType, attachmentUrl, conversation_id, canDeleteNonAuthoredMessages, myMessage, } = route.params;
     const attachmentName = getAttachmentLabelName(attachmentContentType);
     const canDelete = myMessage || canDeleteNonAuthoredMessages;
+    const styles = useStyles();
     const { handleDeleteAttachment } = useDeleteAttachment({
         conversation_id,
         attachmentId,
@@ -26,11 +27,18 @@ export function AttachmentActionsScreen({ route }) {
         Linking.openURL(attachmentUrl);
         navigation.goBack();
     };
-    return (<FormSheet.Root>
+    return (<FormSheet.Root contentStyle={styles.formSheetContent}>
       <FormSheet.Action iconName="general.newWindow" title="Open in browser" accessibilityRole="link" accessibilityLabel={`Open ${attachmentName} in browser`} accessibilityHint={`${attachmentName} can be downloaded and shared through the browser.`} onPress={handleOpenInBrowser}/>
       {canDelete && (<FormSheet.Action appearance="danger" iconName="publishing.trash" title={`Delete ${attachmentName}`} onPress={handleDeleteConfirm}/>)}
     </FormSheet.Root>);
 }
+const useStyles = () => {
+    return StyleSheet.create({
+        formSheetContent: {
+            paddingTop: 16,
+        },
+    });
+};
 function getAttachmentLabelName(contentType) {
     if (contentType.startsWith('image/'))
         return 'image';

package/build/screens/attachment_actions/attachment_actions_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"attachment_actions_screen.js","sourceRoot":"","sources":["../../../src/screens/attachment_actions/attachment_actions_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,aAAa,EAAE,MAAM,0BAA0B,CAAA;AAC3E,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAC7C,OAAO,SAAS,EAAE,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAA;AAC5F,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjE,MAAM,CAAC,MAAM,8BAA8B,GAAG,yBAAyB,CAAC;IACtE,WAAW,EAAE,oBAAoB;CAClC,CAAC,CAAA;AAWF,MAAM,UAAU,uBAAuB,CAAC,EAAE,KAAK,EAAgC;IAC7E,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,EACJ,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,eAAe,EACf,4BAA4B,EAC5B,SAAS,GACV,GAAG,KAAK,CAAC,MAAM,CAAA;IAEhB,MAAM,cAAc,GAAG,sBAAsB,CAAC,qBAAqB,CAAC,CAAA;IACpE,MAAM,SAAS,GAAG,SAAS,IAAI,4BAA4B,CAAA;IAE3D,MAAM,EAAE,sBAAsB,EAAE,GAAG,mBAAmB,CAAC;QACrD,eAAe;QACf,YAAY;QACZ,cAAc;KACf,CAAC,CAAA;IAEF,MAAM,mBAAmB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC3C,KAAK,CAAC,KAAK,CACT,UAAU,cAAc,EAAE,EAC1B,8DAA8D,EAC9D;YACE,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;YACnC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,sBAAsB,EAAE,EAAE;SAClF,CACF,CAAA;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,sBAAsB,CAAC,CAAC,CAAA;IAE5C,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAA;QAC9B,UAAU,CAAC,MAAM,EAAE,CAAA;IACrB,CAAC,CAAA;IAED,OAAO,CACL,CAAC,SAAS,CAAC,IAAI,CACb;MAAA,CAAC,SAAS,CAAC,MAAM,CACf,QAAQ,CAAC,mBAAmB,CAC5B,KAAK,CAAC,iBAAiB,CACvB,iBAAiB,CAAC,MAAM,CACxB,kBAAkB,CAAC,CAAC,QAAQ,cAAc,aAAa,CAAC,CACxD,iBAAiB,CAAC,CAAC,GAAG,cAAc,oDAAoD,CAAC,CACzF,OAAO,CAAC,CAAC,mBAAmB,CAAC,EAE/B;MAAA,CAAC,SAAS,IAAI,CACZ,CAAC,SAAS,CAAC,MAAM,CACf,UAAU,CAAC,QAAQ,CACnB,QAAQ,CAAC,kBAAkB,CAC3B,KAAK,CAAC,CAAC,UAAU,cAAc,EAAE,CAAC,CAClC,OAAO,CAAC,CAAC,mBAAmB,CAAC,EAC7B,CACH,CACH;IAAA,EAAE,SAAS,CAAC,IAAI,CAAC,CAClB,CAAA;AACH,CAAC;AAED,SAAS,sBAAsB,CAAC,WAAmB;IACjD,IAAI,WAAW,CAAC,UAAU,CAAC,QAAQ,CAAC;QAAE,OAAO,OAAO,CAAA;IACpD,IAAI,WAAW,CAAC,UAAU,CAAC,QAAQ,CAAC;QAAE,OAAO,OAAO,CAAA;IACpD,IAAI,WAAW,CAAC,UAAU,CAAC,QAAQ,CAAC;QAAE,OAAO,OAAO,CAAA;IACpD,IAAI,WAAW,KAAK,iBAAiB;QAAE,OAAO,KAAK,CAAA;IACnD,IAAI,WAAW,CAAC,UAAU,CAAC,cAAc,CAAC;QAAE,OAAO,MAAM,CAAA;IAEzD,OAAO,EAAE,CAAA;AACX,CAAC","sourcesContent":["import { StaticScreenProps, useNavigation } from '@react-navigation/native'\nimport React, { useCallback } from 'react'\nimport { Alert, Linking } from 'react-native'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useDeleteAttachment } from './hooks/useDeleteAttachment'\n\nexport const AttachmentActionsScreenOptions = getFormSheetScreenOptions({\n  headerTitle: 'Attachment actions',\n})\n\nexport type AttachmentActionsScreenProps = StaticScreenProps<{\n  attachmentId: string\n  attachmentContentType: string\n  attachmentUrl: string\n  conversation_id: number\n  canDeleteNonAuthoredMessages: boolean\n  myMessage: boolean\n}>\n\nexport function AttachmentActionsScreen({ route }: AttachmentActionsScreenProps) {\n  const navigation = useNavigation()\n  const {\n    attachmentId,\n    attachmentContentType,\n    attachmentUrl,\n    conversation_id,\n    canDeleteNonAuthoredMessages,\n    myMessage,\n  } = route.params\n\n  const attachmentName = getAttachmentLabelName(attachmentContentType)\n  const canDelete = myMessage || canDeleteNonAuthoredMessages\n\n  const { handleDeleteAttachment } = useDeleteAttachment({\n    conversation_id,\n    attachmentId,\n    attachmentName,\n  })\n\n  const handleDeleteConfirm = useCallback(() => {\n    Alert.alert(\n      `Delete ${attachmentName}`,\n      'Are you sure you want to permanently delete this attachment?',\n      [\n        { text: 'Cancel', style: 'cancel' },\n        { text: 'Delete', style: 'destructive', onPress: () => handleDeleteAttachment() },\n      ]\n    )\n  }, [attachmentName, handleDeleteAttachment])\n\n  const handleOpenInBrowser = () => {\n    Linking.openURL(attachmentUrl)\n    navigation.goBack()\n  }\n\n  return (\n    <FormSheet.Root>\n      <FormSheet.Action\n        iconName=\"general.newWindow\"\n        title=\"Open in browser\"\n        accessibilityRole=\"link\"\n        accessibilityLabel={`Open ${attachmentName} in browser`}\n        accessibilityHint={`${attachmentName} can be downloaded and shared through the browser.`}\n        onPress={handleOpenInBrowser}\n      />\n      {canDelete && (\n        <FormSheet.Action\n          appearance=\"danger\"\n          iconName=\"publishing.trash\"\n          title={`Delete ${attachmentName}`}\n          onPress={handleDeleteConfirm}\n        />\n      )}\n    </FormSheet.Root>\n  )\n}\n\nfunction getAttachmentLabelName(contentType: string) {\n  if (contentType.startsWith('image/')) return 'image'\n  if (contentType.startsWith('video/')) return 'video'\n  if (contentType.startsWith('audio/')) return 'audio'\n  if (contentType === 'application/pdf') return 'PDF'\n  if (contentType.startsWith('application/')) return 'file'\n\n  return ''\n}\n"]}
+{"version":3,"file":"attachment_actions_screen.js","sourceRoot":"","sources":["../../../src/screens/attachment_actions/attachment_actions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps, useNavigation } from '@react-navigation/native'\nimport React, { useCallback } from 'react'\nimport { Alert, Linking, StyleSheet } from 'react-native'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useDeleteAttachment } from './hooks/useDeleteAttachment'\n\nexport const AttachmentActionsScreenOptions = getFormSheetScreenOptions({\n  headerTitle: 'Attachment actions',\n})\n\nexport type AttachmentActionsScreenProps = StaticScreenProps<{\n  attachmentId: string\n  attachmentContentType: string\n  attachmentUrl: string\n  conversation_id: number\n  canDeleteNonAuthoredMessages: boolean\n  myMessage: boolean\n}>\n\nexport function AttachmentActionsScreen({ route }: AttachmentActionsScreenProps) {\n  const navigation = useNavigation()\n  const {\n    attachmentId,\n    attachmentContentType,\n    attachmentUrl,\n    conversation_id,\n    canDeleteNonAuthoredMessages,\n    myMessage,\n  } = route.params\n\n  const attachmentName = getAttachmentLabelName(attachmentContentType)\n  const canDelete = myMessage || canDeleteNonAuthoredMessages\n  const styles = useStyles()\n\n  const { handleDeleteAttachment } = useDeleteAttachment({\n    conversation_id,\n    attachmentId,\n    attachmentName,\n  })\n\n  const handleDeleteConfirm = useCallback(() => {\n    Alert.alert(\n      `Delete ${attachmentName}`,\n      'Are you sure you want to permanently delete this attachment?',\n      [\n        { text: 'Cancel', style: 'cancel' },\n        { text: 'Delete', style: 'destructive', onPress: () => handleDeleteAttachment() },\n      ]\n    )\n  }, [attachmentName, handleDeleteAttachment])\n\n  const handleOpenInBrowser = () => {\n    Linking.openURL(attachmentUrl)\n    navigation.goBack()\n  }\n\n  return (\n    <FormSheet.Root contentStyle={styles.formSheetContent}>\n      <FormSheet.Action\n        iconName=\"general.newWindow\"\n        title=\"Open in browser\"\n        accessibilityRole=\"link\"\n        accessibilityLabel={`Open ${attachmentName} in browser`}\n        accessibilityHint={`${attachmentName} can be downloaded and shared through the browser.`}\n        onPress={handleOpenInBrowser}\n      />\n      {canDelete && (\n        <FormSheet.Action\n          appearance=\"danger\"\n          iconName=\"publishing.trash\"\n          title={`Delete ${attachmentName}`}\n          onPress={handleDeleteConfirm}\n        />\n      )}\n    </FormSheet.Root>\n  )\n}\n\nconst useStyles = () => {\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n  })\n}\n\nfunction getAttachmentLabelName(contentType: string) {\n  if (contentType.startsWith('image/')) return 'image'\n  if (contentType.startsWith('video/')) return 'video'\n  if (contentType.startsWith('audio/')) return 'audio'\n  if (contentType === 'application/pdf') return 'PDF'\n  if (contentType.startsWith('application/')) return 'file'\n\n  return ''\n}\n"]}

package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filter_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,OAAO,EAAE,uCAAuC,EAAgB,MAAM,SAAS,CAAA;AAU/E,eAAO,MAAM,0CAA0C,uEAMrD,CAAA;AAEF,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBA6FzC,CAAA"}
+{"version":3,"file":"conversation_filter_recipients_screen.d.ts","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAY1C,OAAO,EAAE,uCAAuC,EAAgB,MAAM,SAAS,CAAA;AAI/E,eAAO,MAAM,0CAA0C,uEAMrD,CAAA;AAEF,eAAO,MAAM,kCAAkC,eAE5C,uCAAuC,sBAiGzC,CAAA"}

package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js

@@ -1,17 +1,17 @@
+import { StackActions, useNavigation } from '@react-navigation/native';
 import React, { useCallback } from 'react';
 import { Platform, StyleSheet } from 'react-native';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { FlatList } from 'react-native-gesture-handler';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { Heading } from '../../components';
+import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet';
 import { useTheme } from '../../hooks';
-import { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams';
-import { SectionTypes } from './types';
-import { HeaderRow } from './components/header_row';
 import { tokens } from '../../vendor/tapestry/tokens';
 import { CheckboxRow } from './components/checkbox_row';
+import { HeaderRow } from './components/header_row';
+import { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams';
 import { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams';
-import { StackActions, useNavigation } from '@react-navigation/native';
-import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet';
+import { SectionTypes } from './types';
 const SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-';
 export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({
     sheetAllowedDetents: Platform.select({
@@ -23,6 +23,7 @@ export const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOpti
 export const ConversationFilterRecipientsScreen = ({ route, }) => {
     const styles = useStyles();
     const navigation = useNavigation();
+    const { team_ids: teamIds } = route.params;
     const { serviceTypes } = useServiceTypesWithTeams();
     const data = useFlattenedArrayOfServiceTypesWithTeams({
         data: serviceTypes,
@@ -45,9 +46,11 @@ export const ConversationFilterRecipientsScreen = ({ route, }) => {
     const applyTeamFilters = useCallback(() => {
         navigation.dispatch(StackActions.popTo('ConversationNew', params));
     }, [navigation, params]);
-    return (<FormSheet.Root>
+    const teamIdCount = Number(teamIds?.length);
+    const count = teamIdCount > 1 ? ` (${teamIdCount})` : '';
+    return (<FormSheet.Root style={styles.root}>
       <FormSheet.Header>
-        <FormSheet.HeaderTitle>Teams I lead</FormSheet.HeaderTitle>
+        <FormSheet.HeaderTitle>Teams I lead{count}</FormSheet.HeaderTitle>
         <FormSheet.HeaderActions>
           <FormSheet.HeaderSecondaryButton onPress={resetTeamFilters} accessibilityHint="Cancels any selected teams and closes this modal.">
             Cancel
@@ -74,8 +77,10 @@ const useStyles = () => {
     const { colors } = useTheme();
     const { bottom } = useSafeAreaInsets();
     return StyleSheet.create({
-        listContentContainer: {
+        root: {
             backgroundColor: colors.surfaceColor080,
+        },
+        listContentContainer: {
             padding: 16,
             paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),
         },

package/build/screens/conversation_filter_recipients/conversation_filter_recipients_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation_filter_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { useCallback } from 'react'\nimport { Platform, StyleSheet } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { Heading } from '../../components'\nimport { useTheme } from '../../hooks'\nimport { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams'\nimport { ConversationFilterRecipientsScreenProps, SectionTypes } from './types'\nimport { HeaderRow } from './components/header_row'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { CheckboxRow } from './components/checkbox_row'\nimport { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams'\nimport { StackActions, useNavigation } from '@react-navigation/native'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\n\nconst SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-'\n\nexport const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.75, 0.94],\n    default: [0.75, 1],\n  }),\n  headerTitle: 'Teams I lead',\n})\n\nexport const ConversationFilterRecipientsScreen = ({\n  route,\n}: ConversationFilterRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation =\n    useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n\n  const { serviceTypes } = useServiceTypesWithTeams()\n  const data = useFlattenedArrayOfServiceTypesWithTeams({\n    data: serviceTypes,\n    firstRowStyle: styles.firstRow,\n    lastRowStyle: styles.lastRow,\n  })\n\n  const { params } = route\n  const noTeamsSelected = params.team_ids?.length === 0 || !params.team_ids\n  const applyButtonAccessibilityHint = noTeamsSelected\n    ? 'Select at least one team to navigate to the final step in creating your conversation.'\n    : 'Saves selected teams and navigates to the final step to create your conversation.'\n\n  const setTeamFilters = useCallback(\n    ({ team_ids }: { team_ids: number[] }) => {\n      navigation.setParams({\n        team_ids,\n      })\n    },\n    [navigation]\n  )\n\n  const resetTeamFilters = useCallback(() => {\n    navigation.goBack()\n  }, [navigation])\n\n  const applyTeamFilters = useCallback(() => {\n    navigation.dispatch(StackActions.popTo('ConversationNew', params))\n  }, [navigation, params])\n\n  return (\n    <FormSheet.Root>\n      <FormSheet.Header>\n        <FormSheet.HeaderTitle>Teams I lead</FormSheet.HeaderTitle>\n        <FormSheet.HeaderActions>\n          <FormSheet.HeaderSecondaryButton\n            onPress={resetTeamFilters}\n            accessibilityHint=\"Cancels any selected teams and closes this modal.\"\n          >\n            Cancel\n          </FormSheet.HeaderSecondaryButton>\n          <FormSheet.HeaderPrimaryButton\n            title=\"Apply\"\n            accessibilityHint={applyButtonAccessibilityHint}\n            onPress={applyTeamFilters}\n            disabled={noTeamsSelected}\n          />\n        </FormSheet.HeaderActions>\n      </FormSheet.Header>\n\n      <FlatList\n        data={data}\n        ListHeaderComponent={\n          <Heading variant=\"h3\" style={styles.listHeader}>\n            Service Types\n          </Heading>\n        }\n        contentContainerStyle={styles.listContentContainer}\n        keyExtractor={item =>\n          `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`\n        }\n        renderItem={({ item }) => {\n          switch (item.type) {\n            case SectionTypes.header:\n              return (\n                <HeaderRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            case SectionTypes.team:\n              return (\n                <CheckboxRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            default:\n              return null\n          }\n        }}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    listContentContainer: {\n      backgroundColor: colors.surfaceColor080,\n      padding: 16,\n      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),\n    },\n    listHeader: {\n      paddingBottom: 16,\n    },\n    firstRow: {\n      borderTopStartRadius: tokens.borderRadiusLg,\n      borderTopEndRadius: tokens.borderRadiusLg,\n    },\n    lastRow: {\n      borderBottomStartRadius: tokens.borderRadiusLg,\n      borderBottomEndRadius: tokens.borderRadiusLg,\n      marginBottom: 16,\n    },\n  })\n}\n"]}
+{"version":3,"file":"conversation_filter_recipients_screen.js","sourceRoot":"","sources":["../../../src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StackActions, useNavigation } from '@react-navigation/native'\nimport { NativeStackNavigationProp } from '@react-navigation/native-stack'\nimport React, { useCallback } from 'react'\nimport { Platform, StyleSheet } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Heading } from '../../components'\nimport FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'\nimport { useTheme } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { CheckboxRow } from './components/checkbox_row'\nimport { HeaderRow } from './components/header_row'\nimport { useFlattenedArrayOfServiceTypesWithTeams } from './hooks/use_flattened_array_of_service_types_with_teams'\nimport { useServiceTypesWithTeams } from './hooks/use_service_types_with_teams'\nimport { ConversationFilterRecipientsScreenProps, SectionTypes } from './types'\n\nconst SERVICE_TYPE_LABELLED_BY_PREFIX = 'header-'\n\nexport const ConversationFilterReceipientsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.75, 0.94],\n    default: [0.75, 1],\n  }),\n  headerTitle: 'Teams I lead',\n})\n\nexport const ConversationFilterRecipientsScreen = ({\n  route,\n}: ConversationFilterRecipientsScreenProps) => {\n  const styles = useStyles()\n  const navigation =\n    useNavigation<NativeStackNavigationProp<ConversationFilterRecipientsScreenProps>>()\n  const { team_ids: teamIds } = route.params\n\n  const { serviceTypes } = useServiceTypesWithTeams()\n  const data = useFlattenedArrayOfServiceTypesWithTeams({\n    data: serviceTypes,\n    firstRowStyle: styles.firstRow,\n    lastRowStyle: styles.lastRow,\n  })\n\n  const { params } = route\n  const noTeamsSelected = params.team_ids?.length === 0 || !params.team_ids\n  const applyButtonAccessibilityHint = noTeamsSelected\n    ? 'Select at least one team to navigate to the final step in creating your conversation.'\n    : 'Saves selected teams and navigates to the final step to create your conversation.'\n\n  const setTeamFilters = useCallback(\n    ({ team_ids }: { team_ids: number[] }) => {\n      navigation.setParams({\n        team_ids,\n      })\n    },\n    [navigation]\n  )\n\n  const resetTeamFilters = useCallback(() => {\n    navigation.goBack()\n  }, [navigation])\n\n  const applyTeamFilters = useCallback(() => {\n    navigation.dispatch(StackActions.popTo('ConversationNew', params))\n  }, [navigation, params])\n\n  const teamIdCount = Number(teamIds?.length)\n  const count = teamIdCount > 1 ? ` (${teamIdCount})` : ''\n\n  return (\n    <FormSheet.Root style={styles.root}>\n      <FormSheet.Header>\n        <FormSheet.HeaderTitle>Teams I lead{count}</FormSheet.HeaderTitle>\n        <FormSheet.HeaderActions>\n          <FormSheet.HeaderSecondaryButton\n            onPress={resetTeamFilters}\n            accessibilityHint=\"Cancels any selected teams and closes this modal.\"\n          >\n            Cancel\n          </FormSheet.HeaderSecondaryButton>\n          <FormSheet.HeaderPrimaryButton\n            title=\"Apply\"\n            accessibilityHint={applyButtonAccessibilityHint}\n            onPress={applyTeamFilters}\n            disabled={noTeamsSelected}\n          />\n        </FormSheet.HeaderActions>\n      </FormSheet.Header>\n\n      <FlatList\n        data={data}\n        ListHeaderComponent={\n          <Heading variant=\"h3\" style={styles.listHeader}>\n            Service Types\n          </Heading>\n        }\n        contentContainerStyle={styles.listContentContainer}\n        keyExtractor={item =>\n          `${item.type === SectionTypes.header ? item.data.serviceTypeId : item.data.teamId}`\n        }\n        renderItem={({ item }) => {\n          switch (item.type) {\n            case SectionTypes.header:\n              return (\n                <HeaderRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  nativeID={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            case SectionTypes.team:\n              return (\n                <CheckboxRow\n                  data={item.data}\n                  style={item.sectionStyle}\n                  accessibilityLabelledBy={`${SERVICE_TYPE_LABELLED_BY_PREFIX}${item.data.serviceTypeId}`}\n                  setTeamFilters={setTeamFilters}\n                />\n              )\n            default:\n              return null\n          }\n        }}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    root: {\n      backgroundColor: colors.surfaceColor080,\n    },\n    listContentContainer: {\n      padding: 16,\n      paddingBottom: bottom + Platform.select({ android: 24, default: 16 }),\n    },\n    listHeader: {\n      paddingBottom: 16,\n    },\n    firstRow: {\n      borderTopStartRadius: tokens.borderRadiusLg,\n      borderTopEndRadius: tokens.borderRadiusLg,\n    },\n    lastRow: {\n      borderBottomStartRadius: tokens.borderRadiusLg,\n      borderBottomEndRadius: tokens.borderRadiusLg,\n      marginBottom: 16,\n    },\n  })\n}\n"]}

package/build/screens/conversations/components/chat_group_badge.d.ts

@@ -1,3 +1,5 @@
 import React from 'react';
-export declare const ChatGroupBadge: () => React.JSX.Element | null;
+export declare const ChatGroupBadge: ({ rowPaddingHorizontal }: {
+    rowPaddingHorizontal: number;
+}) => React.JSX.Element | null;
 //# sourceMappingURL=chat_group_badge.d.ts.map

package/build/screens/conversations/components/chat_group_badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat_group_badge.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversations/components/chat_group_badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,eAAO,MAAM,cAAc,gCA8B1B,CAAA"}
+{"version":3,"file":"chat_group_badge.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversations/components/chat_group_badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,eAAO,MAAM,cAAc,6BAA8B;IAAE,oBAAoB,EAAE,MAAM,CAAA;CAAE,6BA8BxF,CAAA"}

package/build/screens/conversations/components/chat_group_badge.js

@@ -3,8 +3,8 @@ import React, { useCallback } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { Badge } from '../../../components';
 import { useApiGet } from '../../../hooks/use_api';
-export const ChatGroupBadge = () => {
-    const styles = useStyles();
+export const ChatGroupBadge = ({ rowPaddingHorizontal }) => {
+    const styles = useStyles({ rowPaddingHorizontal });
     const navigation = useNavigation();
     const route = useRoute();
     const { chat_group_graph_id } = route.params || {};
@@ -30,10 +30,11 @@ export const ChatGroupBadge = () => {
       <Badge iconNameRight="general.x" label={group?.name || ''} onPress={handleBadgePress}/>
     </View>);
 };
-const useStyles = () => {
+const useStyles = ({ rowPaddingHorizontal }) => {
     return StyleSheet.create({
         row: {
             flexDirection: 'row',
+            paddingHorizontal: rowPaddingHorizontal,
         },
     });
 };

package/build/screens/conversations/components/chat_group_badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"chat_group_badge.js","sourceRoot":"","sources":["../../../../src/screens/conversations/components/chat_group_badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,aAAa,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAC7E,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAIlD,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,KAAK,GAAG,QAAQ,EAA+C,CAAA;IACrE,MAAM,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC,MAAM,IAAI,EAAE,CAAA;IAClD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,SAAS,CAAgB;QAC/C,GAAG,EAAE,cAAc,mBAAmB,EAAE;QACxC,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,KAAK,EAAE,EAAE;aACV;SACF;QACD,OAAO,EAAE,CAAC,CAAC,mBAAmB;QAC9B,GAAG,EAAE,MAAM;KACZ,CAAC,CAAA;IAEF,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,UAAU,CAAC,SAAS,CAAC;YACnB,mBAAmB,EAAE,SAAS;YAC9B,qBAAqB,EAAE,SAAS;SACjC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAA;IAEvB,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CACtB;MAAA,CAAC,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,IAAI,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,EACvF;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,GAAG,EAAE;YACH,aAAa,EAAE,KAAK;SACrB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { RouteProp, useNavigation, useRoute } from '@react-navigation/native'\nimport React, { useCallback } from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { Badge } from '../../../components'\nimport { useApiGet } from '../../../hooks/use_api'\nimport { GroupResource } from '../../../types/resources/group_resource'\nimport { ConversationScreenProps } from '../conversations_screen'\n\nexport const ChatGroupBadge = () => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const route = useRoute<RouteProp<ConversationScreenProps['route']>>()\n  const { chat_group_graph_id } = route.params || {}\n  const { data: group } = useApiGet<GroupResource>({\n    url: `/me/groups/${chat_group_graph_id}`,\n    data: {\n      fields: {\n        Group: [],\n      },\n    },\n    enabled: !!chat_group_graph_id,\n    app: 'chat',\n  })\n\n  const handleBadgePress = useCallback(() => {\n    navigation.setParams({\n      chat_group_graph_id: undefined,\n      group_source_app_name: undefined,\n    })\n  }, [navigation])\n\n  if (!group) return null\n\n  return (\n    <View style={styles.row}>\n      <Badge iconNameRight=\"general.x\" label={group?.name || ''} onPress={handleBadgePress} />\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  return StyleSheet.create({\n    row: {\n      flexDirection: 'row',\n    },\n  })\n}\n"]}
+{"version":3,"file":"chat_group_badge.js","sourceRoot":"","sources":["../../../../src/screens/conversations/components/chat_group_badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,aAAa,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAC7E,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAIlD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,oBAAoB,EAAoC,EAAE,EAAE;IAC3F,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,oBAAoB,EAAE,CAAC,CAAA;IAClD,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,KAAK,GAAG,QAAQ,EAA+C,CAAA;IACrE,MAAM,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC,MAAM,IAAI,EAAE,CAAA;IAClD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,SAAS,CAAgB;QAC/C,GAAG,EAAE,cAAc,mBAAmB,EAAE;QACxC,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,KAAK,EAAE,EAAE;aACV;SACF;QACD,OAAO,EAAE,CAAC,CAAC,mBAAmB;QAC9B,GAAG,EAAE,MAAM;KACZ,CAAC,CAAA;IAEF,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,UAAU,CAAC,SAAS,CAAC;YACnB,mBAAmB,EAAE,SAAS;YAC9B,qBAAqB,EAAE,SAAS;SACjC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAA;IAEvB,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CACtB;MAAA,CAAC,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,IAAI,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,EACvF;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,CAAC,EAAE,oBAAoB,EAAoC,EAAE,EAAE;IAC/E,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,GAAG,EAAE;YACH,aAAa,EAAE,KAAK;YACpB,iBAAiB,EAAE,oBAAoB;SACxC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { RouteProp, useNavigation, useRoute } from '@react-navigation/native'\nimport React, { useCallback } from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { Badge } from '../../../components'\nimport { useApiGet } from '../../../hooks/use_api'\nimport { GroupResource } from '../../../types/resources/group_resource'\nimport { ConversationScreenProps } from '../conversations_screen'\n\nexport const ChatGroupBadge = ({ rowPaddingHorizontal }: { rowPaddingHorizontal: number }) => {\n  const styles = useStyles({ rowPaddingHorizontal })\n  const navigation = useNavigation()\n  const route = useRoute<RouteProp<ConversationScreenProps['route']>>()\n  const { chat_group_graph_id } = route.params || {}\n  const { data: group } = useApiGet<GroupResource>({\n    url: `/me/groups/${chat_group_graph_id}`,\n    data: {\n      fields: {\n        Group: [],\n      },\n    },\n    enabled: !!chat_group_graph_id,\n    app: 'chat',\n  })\n\n  const handleBadgePress = useCallback(() => {\n    navigation.setParams({\n      chat_group_graph_id: undefined,\n      group_source_app_name: undefined,\n    })\n  }, [navigation])\n\n  if (!group) return null\n\n  return (\n    <View style={styles.row}>\n      <Badge iconNameRight=\"general.x\" label={group?.name || ''} onPress={handleBadgePress} />\n    </View>\n  )\n}\n\nconst useStyles = ({ rowPaddingHorizontal }: { rowPaddingHorizontal: number }) => {\n  return StyleSheet.create({\n    row: {\n      flexDirection: 'row',\n      paddingHorizontal: rowPaddingHorizontal,\n    },\n  })\n}\n"]}

package/build/screens/conversations/components/list_header_component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list_header_component.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversations/components/list_header_component.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+B,MAAM,OAAO,CAAA;AAgBnD,eAAO,MAAM,mBAAmB,yBAgH/B,CAAA"}
+{"version":3,"file":"list_header_component.d.ts","sourceRoot":"","sources":["../../../../src/screens/conversations/components/list_header_component.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+B,MAAM,OAAO,CAAA;AAkBnD,eAAO,MAAM,mBAAmB,yBA8G/B,CAAA"}

package/build/screens/conversations/components/list_header_component.js

@@ -6,6 +6,7 @@ import { useCurrentPerson, useCurrentPersonCache, useTheme } from '../../../hook
 import { useMarkAllRead } from '../../../hooks/use_conversations_actions';
 import { useCanDisplayGroups } from '../../../hooks/use_groups';
 import { ChatGroupBadge } from './chat_group_badge';
+const ROW_PADDING_HORIZONTAL = 16;
 var FilterTypes;
 (function (FilterTypes) {
     FilterTypes["All"] = "All";
@@ -78,9 +79,7 @@ export const ListHeaderComponent = () => {
             group_source_app_name,
         })} active={active === FilterTypes.More} iconNameRight="general.threeReducingHorizontalBars" accessibilityLabel={showAppFilters ? 'View all filters' : 'View more filters'}/>
       </ScrollView>
-      <View style={styles.chatGroupBadgeRow}>
-        <ChatGroupBadge />
-      </View>
+      <ChatGroupBadge rowPaddingHorizontal={ROW_PADDING_HORIZONTAL}/>
     </View>);
 };
 const useStyles = () => {
@@ -96,16 +95,13 @@ const useStyles = () => {
             flexDirection: 'row',
             justifyContent: 'space-between',
             paddingTop: 8,
-            paddingHorizontal: 16,
+            paddingHorizontal: ROW_PADDING_HORIZONTAL,
         },
         filterRow: {
             flexDirection: 'row',
             justifyContent: 'flex-start',
             gap: 8,
-            paddingHorizontal: 16,
-        },
-        chatGroupBadgeRow: {
-            paddingHorizontal: 16,
+            paddingHorizontal: ROW_PADDING_HORIZONTAL,
         },
     });
 };

package/build/screens/conversations/components/list_header_component.js.map

@@ -1 +1 @@
-{"version":3,"file":"list_header_component.js","sourceRoot":"","sources":["../../../../src/screens/conversations/components/list_header_component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RouteProp, useNavigation, useRoute } from '@react-navigation/native'\nimport React, { useCallback, useMemo } from 'react'\nimport { Alert, ScrollView, StyleSheet, View } from 'react-native'\nimport { Heading, TextButton, ToggleButton } from '../../../components'\nimport { useCurrentPerson, useCurrentPersonCache, useTheme } from '../../../hooks'\nimport { useMarkAllRead } from '../../../hooks/use_conversations_actions'\nimport { useCanDisplayGroups } from '../../../hooks/use_groups'\nimport { ConversationScreenProps } from '../conversations_screen'\nimport { ChatGroupBadge } from './chat_group_badge'\n\nenum FilterTypes {\n  All = 'All',\n  Groups = 'Groups',\n  Teams = 'Teams',\n  More = 'More',\n}\n\nexport const ListHeaderComponent = () => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const canFilterByTeams = useCanDisplayGroups({ source_app_name: 'Services', source_type: 'Team' })\n  const canFilterByGroups = useCanDisplayGroups({ source_app_name: 'Groups', source_type: 'Group' })\n  const route = useRoute<RouteProp<ConversationScreenProps['route']>>()\n  const { chat_group_graph_id, group_source_app_name = '' } = route.params || {}\n\n  const { unreadCount } = useCurrentPerson()\n  const currentPersonCache = useCurrentPersonCache()\n  const { markAllRead, isPending } = useMarkAllRead()\n\n  const active: FilterTypes = useMemo(() => {\n    if (chat_group_graph_id) {\n      return FilterTypes.More\n    } else if (/groups/i.test(group_source_app_name)) {\n      return FilterTypes.Groups\n    } else if (/services/i.test(group_source_app_name)) {\n      return FilterTypes.Teams\n    }\n\n    return FilterTypes.All\n  }, [chat_group_graph_id, group_source_app_name])\n\n  const handleMarkAllRead = useCallback(() => {\n    currentPersonCache.update({ unreadCount: 0 })\n    markAllRead()\n  }, [currentPersonCache, markAllRead])\n\n  const alertMarkAllRead = useCallback(() => {\n    if (active === FilterTypes.All) return handleMarkAllRead()\n\n    Alert.alert('Mark all read', 'This includes conversations not shown by the current filter.', [\n      { text: 'Cancel' },\n      { text: 'OK', onPress: () => handleMarkAllRead() },\n    ])\n  }, [active, handleMarkAllRead])\n\n  const showAppFilters = canFilterByGroups && canFilterByTeams\n\n  return (\n    <View style={styles.listHeader}>\n      <View style={styles.titleRow}>\n        <Heading numberOfLines={1} variant=\"h2\">\n          Conversations\n        </Heading>\n        <TextButton onPress={alertMarkAllRead} disabled={isPending || !unreadCount}>\n          Mark all read\n        </TextButton>\n      </View>\n      <ScrollView\n        horizontal\n        showsHorizontalScrollIndicator={false}\n        contentContainerStyle={styles.filterRow}\n        accessibilityRole=\"toolbar\"\n      >\n        {showAppFilters && (\n          <>\n            <ToggleButton\n              title={FilterTypes.All}\n              active={active === FilterTypes.All}\n              onPress={() =>\n                navigation.setParams({\n                  chat_group_graph_id: undefined,\n                  group_source_app_name: undefined,\n                })\n              }\n              accessibilityLabel=\"Show all conversations\"\n            />\n            <ToggleButton\n              title={FilterTypes.Groups}\n              active={active === FilterTypes.Groups}\n              onPress={() =>\n                navigation.setParams({\n                  chat_group_graph_id: undefined,\n                  group_source_app_name: 'Groups',\n                })\n              }\n              accessibilityLabel=\"Filter to group conversations\"\n            />\n\n            <ToggleButton\n              title={FilterTypes.Teams}\n              active={active === FilterTypes.Teams}\n              onPress={() =>\n                navigation.setParams({\n                  chat_group_graph_id: undefined,\n                  group_source_app_name: 'Services',\n                })\n              }\n              accessibilityLabel=\"Filter to team conversations\"\n            />\n          </>\n        )}\n        <ToggleButton\n          title={showAppFilters ? FilterTypes.More : 'Filter'}\n          onPress={() =>\n            navigation.navigate('ConversationFilters', {\n              chat_group_graph_id,\n              group_source_app_name,\n            })\n          }\n          active={active === FilterTypes.More}\n          iconNameRight=\"general.threeReducingHorizontalBars\"\n          accessibilityLabel={showAppFilters ? 'View all filters' : 'View more filters'}\n        />\n      </ScrollView>\n      <View style={styles.chatGroupBadgeRow}>\n        <ChatGroupBadge />\n      </View>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const theme = useTheme()\n  return StyleSheet.create({\n    listHeader: {\n      borderBottomWidth: 1,\n      borderBottomColor: theme.colors.fillColorNeutral050Base,\n      paddingBottom: 16,\n      gap: 12,\n    },\n    titleRow: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      paddingTop: 8,\n      paddingHorizontal: 16,\n    },\n    filterRow: {\n      flexDirection: 'row',\n      justifyContent: 'flex-start',\n      gap: 8,\n      paddingHorizontal: 16,\n    },\n    chatGroupBadgeRow: {\n      paddingHorizontal: 16,\n    },\n  })\n}\n"]}
+{"version":3,"file":"list_header_component.js","sourceRoot":"","sources":["../../../../src/screens/conversations/components/list_header_component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RouteProp, useNavigation, useRoute } from '@react-navigation/native'\nimport React, { useCallback, useMemo } from 'react'\nimport { Alert, ScrollView, StyleSheet, View } from 'react-native'\nimport { Heading, TextButton, ToggleButton } from '../../../components'\nimport { useCurrentPerson, useCurrentPersonCache, useTheme } from '../../../hooks'\nimport { useMarkAllRead } from '../../../hooks/use_conversations_actions'\nimport { useCanDisplayGroups } from '../../../hooks/use_groups'\nimport { ConversationScreenProps } from '../conversations_screen'\nimport { ChatGroupBadge } from './chat_group_badge'\n\nconst ROW_PADDING_HORIZONTAL = 16\n\nenum FilterTypes {\n  All = 'All',\n  Groups = 'Groups',\n  Teams = 'Teams',\n  More = 'More',\n}\n\nexport const ListHeaderComponent = () => {\n  const styles = useStyles()\n  const navigation = useNavigation()\n  const canFilterByTeams = useCanDisplayGroups({ source_app_name: 'Services', source_type: 'Team' })\n  const canFilterByGroups = useCanDisplayGroups({ source_app_name: 'Groups', source_type: 'Group' })\n  const route = useRoute<RouteProp<ConversationScreenProps['route']>>()\n  const { chat_group_graph_id, group_source_app_name = '' } = route.params || {}\n\n  const { unreadCount } = useCurrentPerson()\n  const currentPersonCache = useCurrentPersonCache()\n  const { markAllRead, isPending } = useMarkAllRead()\n\n  const active: FilterTypes = useMemo(() => {\n    if (chat_group_graph_id) {\n      return FilterTypes.More\n    } else if (/groups/i.test(group_source_app_name)) {\n      return FilterTypes.Groups\n    } else if (/services/i.test(group_source_app_name)) {\n      return FilterTypes.Teams\n    }\n\n    return FilterTypes.All\n  }, [chat_group_graph_id, group_source_app_name])\n\n  const handleMarkAllRead = useCallback(() => {\n    currentPersonCache.update({ unreadCount: 0 })\n    markAllRead()\n  }, [currentPersonCache, markAllRead])\n\n  const alertMarkAllRead = useCallback(() => {\n    if (active === FilterTypes.All) return handleMarkAllRead()\n\n    Alert.alert('Mark all read', 'This includes conversations not shown by the current filter.', [\n      { text: 'Cancel' },\n      { text: 'OK', onPress: () => handleMarkAllRead() },\n    ])\n  }, [active, handleMarkAllRead])\n\n  const showAppFilters = canFilterByGroups && canFilterByTeams\n\n  return (\n    <View style={styles.listHeader}>\n      <View style={styles.titleRow}>\n        <Heading numberOfLines={1} variant=\"h2\">\n          Conversations\n        </Heading>\n        <TextButton onPress={alertMarkAllRead} disabled={isPending || !unreadCount}>\n          Mark all read\n        </TextButton>\n      </View>\n      <ScrollView\n        horizontal\n        showsHorizontalScrollIndicator={false}\n        contentContainerStyle={styles.filterRow}\n        accessibilityRole=\"toolbar\"\n      >\n        {showAppFilters && (\n          <>\n            <ToggleButton\n              title={FilterTypes.All}\n              active={active === FilterTypes.All}\n              onPress={() =>\n                navigation.setParams({\n                  chat_group_graph_id: undefined,\n                  group_source_app_name: undefined,\n                })\n              }\n              accessibilityLabel=\"Show all conversations\"\n            />\n            <ToggleButton\n              title={FilterTypes.Groups}\n              active={active === FilterTypes.Groups}\n              onPress={() =>\n                navigation.setParams({\n                  chat_group_graph_id: undefined,\n                  group_source_app_name: 'Groups',\n                })\n              }\n              accessibilityLabel=\"Filter to group conversations\"\n            />\n\n            <ToggleButton\n              title={FilterTypes.Teams}\n              active={active === FilterTypes.Teams}\n              onPress={() =>\n                navigation.setParams({\n                  chat_group_graph_id: undefined,\n                  group_source_app_name: 'Services',\n                })\n              }\n              accessibilityLabel=\"Filter to team conversations\"\n            />\n          </>\n        )}\n        <ToggleButton\n          title={showAppFilters ? FilterTypes.More : 'Filter'}\n          onPress={() =>\n            navigation.navigate('ConversationFilters', {\n              chat_group_graph_id,\n              group_source_app_name,\n            })\n          }\n          active={active === FilterTypes.More}\n          iconNameRight=\"general.threeReducingHorizontalBars\"\n          accessibilityLabel={showAppFilters ? 'View all filters' : 'View more filters'}\n        />\n      </ScrollView>\n      <ChatGroupBadge rowPaddingHorizontal={ROW_PADDING_HORIZONTAL} />\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const theme = useTheme()\n  return StyleSheet.create({\n    listHeader: {\n      borderBottomWidth: 1,\n      borderBottomColor: theme.colors.fillColorNeutral050Base,\n      paddingBottom: 16,\n      gap: 12,\n    },\n    titleRow: {\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      paddingTop: 8,\n      paddingHorizontal: ROW_PADDING_HORIZONTAL,\n    },\n    filterRow: {\n      flexDirection: 'row',\n      justifyContent: 'flex-start',\n      gap: 8,\n      paddingHorizontal: ROW_PADDING_HORIZONTAL,\n    },\n  })\n}\n"]}

package/build/screens/message_actions_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_actions_screen.d.ts","sourceRoot":"","sources":["../../src/screens/message_actions_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAEzF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAa1C,eAAO,MAAM,2BAA2B,uEAGtC,CAAA;AAEF,MAAM,MAAM,yBAAyB,GAAG,iBAAiB,CAAC;IACxD,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;IACvB,4BAA4B,CAAC,EAAE,OAAO,CAAA;CACvC,CAAC,CAAA;AAEF,wBAAgB,oBAAoB,CAAC,EAAE,KAAK,EAAE,EAAE,yBAAyB,qBAoJxE"}
+{"version":3,"file":"message_actions_screen.d.ts","sourceRoot":"","sources":["../../src/screens/message_actions_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAGzF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAY1C,eAAO,MAAM,2BAA2B,uEAGtC,CAAA;AAEF,MAAM,MAAM,yBAAyB,GAAG,iBAAiB,CAAC;IACxD,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;IACvB,4BAA4B,CAAC,EAAE,OAAO,CAAA;CACvC,CAAC,CAAA;AAEF,wBAAgB,oBAAoB,CAAC,EAAE,KAAK,EAAE,EAAE,yBAAyB,qBAoJxE"}

package/build/screens/message_actions_screen.js

@@ -1,17 +1,17 @@
 import { PlatformPressable } from '@react-navigation/elements';
 import { StackActions, useNavigation } from '@react-navigation/native';
 import { useMutation } from '@tanstack/react-query';
+import { isNil, omitBy } from 'lodash';
 import React, { useCallback } from 'react';
 import { Alert, Platform, StyleSheet, View } from 'react-native';
 import { Text } from '../components';
 import { REACTION_EMOJIS, useReactionStyles } from '../components/conversation/message_reaction';
+import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet';
 import { useCreateAndroidRippleColor, useFontScale, useTheme } from '../hooks';
 import { useApiClient } from '../hooks/use_api_client';
 import { useConversationMessages } from '../hooks/use_conversation_messages';
 import { useMessageReactionToggle } from '../hooks/use_message_reaction_toggle';
 import { Clipboard } from '../utils/native_adapters';
-import { isNil, omitBy } from 'lodash';
-import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet';
 export const MessageActionsScreenOptions = getFormSheetScreenOptions({
     sheetAllowedDetents: [0.5],
     headerTitle: 'Message actions',
@@ -87,7 +87,7 @@ export function MessageActionsScreen({ route }) {
         }, isNil);
         navigation.dispatch(StackActions.popTo('MessageReadReceipts', params));
     }, [navigation, conversation_id, message_id]);
-    return (<FormSheet.Root>
+    return (<FormSheet.Root style={styles.formSheetContent}>
       <View style={styles.reactionList}>
         {availableReactions.map((reaction, index) => (<Reaction key={index} reaction={reaction} onPress={() => handleReactionToggle({
                 value: reaction.value,
@@ -122,6 +122,9 @@ const useStyles = () => {
         android: baseSize + btnBorderWidth * 2,
     });
     return StyleSheet.create({
+        formSheetContent: {
+            paddingTop: 16,
+        },
         reactionList: {
             flexDirection: 'row',
             justifyContent: 'center',