@planningcenter/chat-react-native 3.14.0-rc.4 → 3.14.0

package/src/screens/bug_report_screen.tsx

@@ -11,17 +11,17 @@ import {
   Text,
   TextInlineButton,
   ImageAttachmentPreview,
-  BlankState,
   Icon,
   KeyboardView,
 } from '../components'
+import BlankState from '../components/primitive/blank_state_primitive'
 import { useTheme } from '../hooks'
 import { useUploadClient } from '../hooks/use_upload_client'
 import { ImagePicker, ImagePickerResult, platformFontWeightBold } from '../utils'
 import { useReportBugAction } from '../hooks/use_report_bug_action'
 import {
-  HeaderCancelButton,
-  HeaderSubmitButton,
+  HeaderDismissButton,
+  HeaderTextButton,
 } from '../components/display/platform_modal_header_buttons'
 import { DefaultLoading } from '../components/page/loading'
 import { startsWith } from 'lodash'
@@ -46,7 +46,7 @@ export const BugReportScreenOptions = ({
 }: NativeStackScreenProps<any>): NativeStackNavigationOptions => ({
   presentation: 'modal',
   title: 'Report a bug',
-  headerLeft: () => <HeaderCancelButton title="Cancel" onPress={() => navigation.goBack()} />,
+  headerLeft: () => <HeaderDismissButton title="Cancel" onPress={() => navigation.goBack()} />,
 })
 
 interface Attachment {
@@ -150,7 +150,7 @@ ${stepsToResolve}`
     navigation.setOptions({
       // eslint-disable-next-line react/no-unstable-nested-components
       headerRight: () => (
-        <HeaderSubmitButton title="Submit" onPress={handleSubmit} disabled={!formValid} />
+        <HeaderTextButton title="Submit" onPress={handleSubmit} disabled={!formValid} />
       ),
     })
   }, [formValid, handleSubmit, navigation])
@@ -165,20 +165,22 @@ ${stepsToResolve}`
 
   if (status === 'success') {
     return (
-      <BlankState
-        iconName="general.checkCircle"
-        iconStyle={styles.successIcon}
-        title="Thank you!"
-        titleStyle={styles.successTitle}
-        subtitle="We appreciate you taking the time to help improve chat! We'll take a look at the issue you reported."
-        subtitleStyle={styles.successSubtitle}
-        buttonProps={{
-          title: 'Return to chat',
-          onPress: navigation.goBack,
-          size: 'lg',
-          variant: 'fill',
-        }}
-      />
+      <BlankState.Root>
+        <BlankState.Imagery name="general.checkCircle" style={styles.successIcon} />
+        <BlankState.Content>
+          <BlankState.Heading style={styles.successTitle}>Thank you!</BlankState.Heading>
+          <BlankState.Text style={styles.successSubtitle}>
+            We appreciate you taking the time to help improve chat! We'll take a look at the issue
+            you reported.
+          </BlankState.Text>
+        </BlankState.Content>
+        <BlankState.Button
+          title="Return to chat"
+          onPress={navigation.goBack}
+          size="lg"
+          variant="fill"
+        />
+      </BlankState.Root>
     )
   }
 
@@ -235,7 +237,7 @@ ${stepsToResolve}`
         >
           <View style={styles.modalContainer}>
             <View style={styles.modalHeader}>
-              <HeaderCancelButton title="Cancel" onPress={() => setShowBugTypePicker(false)} />
+              <HeaderDismissButton title="Cancel" onPress={() => setShowBugTypePicker(false)} />
               <Text style={styles.modalTitle}>Select Bug Type</Text>
               <View style={styles.modalHeaderSpacer} />
             </View>

package/src/screens/conversation_details_screen.tsx

@@ -12,7 +12,6 @@ import {
   StyleSheet,
   TextInput,
   View,
-  type TextStyle,
   type ViewStyle,
   type ViewProps,
   Pressable,
@@ -20,7 +19,17 @@ import {
   Platform,
 } from 'react-native'
 import { HeaderTitle as ElementsHeaderTitle, HeaderTitleProps } from '@react-navigation/elements'
-import { Badge, ChildNotice, Heading, Icon, Person, Switch, Text, TextButton } from '../components'
+import {
+  Badge,
+  ChildNotice,
+  Heading,
+  Icon,
+  Person,
+  Switch,
+  Text,
+  TextButton,
+  type TextStyle,
+} from '../components'
 import { useSuspensePaginator, useTheme } from '../hooks'
 import {
   useConversation,
@@ -30,7 +39,7 @@ import {
   useConversationUpdate,
 } from '../hooks/use_conversation'
 import { MemberResource, isDefined } from '../types'
-import { HeaderSubmitButton } from '../components/display/platform_modal_header_buttons'
+import { HeaderTextButton } from '../components/display/platform_modal_header_buttons'
 import { FlashList } from '@shopify/flash-list'
 import { tokens } from '../vendor/tapestry/tokens'
 import { ButtonAppearanceUnion } from '../components/display/utils/button_colors'
@@ -192,7 +201,7 @@ export function ConversationDetailsScreen({ route }: ConversationDetailsScreenPr
 
   const HeaderRight = useCallback(() => {
     return (
-      <HeaderSubmitButton
+      <HeaderTextButton
         onPress={() => {
           saveTitle({ title: trimmedTitle || conversation.title })
           navigation.goBack()

package/src/screens/conversation_filter_recipients/conversation_filter_recipients_screen.tsx

@@ -4,7 +4,8 @@ import React, { useCallback, useMemo, useState } from 'react'
 import { LayoutChangeEvent, Platform, StyleSheet, View } from 'react-native'
 import { FlatList, TextInput } from 'react-native-gesture-handler'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
-import { BlankState, Heading, ToggleButton } from '../../components'
+import { Heading, ToggleButton } from '../../components'
+import BlankState from '../../components/primitive/blank_state_primitive'
 import FormSheet, { getFormSheetScreenOptions } from '../../components/primitive/form_sheet'
 import { useTheme } from '../../hooks'
 import { tokens } from '../../vendor/tapestry/tokens'
@@ -120,7 +121,7 @@ export const ConversationFilterRecipientsScreen = ({
             ? `service-type-${item.data.serviceTypeId}`
             : `team-${item.data.teamId}-${item.data.serviceTypeId}`
         }
-        ListEmptyComponent={isFetched ? <BlankState title="No teams found" /> : <DefaultLoading />}
+        ListEmptyComponent={isFetched ? <ListBlankState /> : <DefaultLoading />}
         renderItem={({ item }) => {
           switch (item.type) {
             case SectionTypes.header:
@@ -150,6 +151,14 @@ export const ConversationFilterRecipientsScreen = ({
   )
 }
 
+const ListBlankState = () => {
+  return (
+    <BlankState.Root>
+      <BlankState.Heading>No teams found</BlankState.Heading>
+    </BlankState.Root>
+  )
+}
+
 const TeamFilters = ({ onLayout }: { onLayout?: (event: LayoutChangeEvent) => void }) => {
   const styles = useStyles()
   const { colors } = useTheme()

package/src/screens/conversation_new/components/filter_by_plan.tsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react'
 import { StyleSheet, View, FlatList, Platform } from 'react-native'
 import { Header, PlatformPressable } from '@react-navigation/elements'
 import { Banner, Icon, Spinner, Text, Heading } from '../../../components'
-import { HeaderCancelButton } from '../../../components/display/platform_modal_header_buttons'
+import { HeaderDismissButton } from '../../../components/display/platform_modal_header_buttons'
 import { useTeamPlans } from '../../../hooks/services/use_team_plans'
 import { useTheme } from '../../../hooks'
 import { tokens } from '../../../vendor/tapestry/tokens'
@@ -192,7 +192,7 @@ export function FilterByPlanModal({
 // ==========================================
 
 const createStableHeaderRight = (onClose: () => void) => () => (
-  <HeaderCancelButton onPress={onClose} title="Cancel" />
+  <HeaderDismissButton onPress={onClose} title="Cancel" />
 )
 
 function OptionItem({ plan, isSelected, onPress }: OptionItemProps) {

package/src/screens/conversation_screen.tsx

@@ -18,7 +18,7 @@ import {
   MemberDisabledRepliesBanner,
 } from '../components/conversation/disabled_replies_banners'
 import { EmptyConversationBlankState } from '../components/conversation/empty_conversation_blank_state'
-import { BlankState } from '../components/display/blank_state'
+import BlankState from '../components/primitive/blank_state_primitive'
 import { Message } from '../components/conversation/message'
 import { MessageForm } from '../components/conversation/message_form'
 import { TypingIndicator } from '../components/conversation/typing_indicator'
@@ -94,16 +94,18 @@ export function ConversationScreen({ route }: ConversationScreenProps) {
   if (!conversation || conversation.deleted) {
     return (
       <View style={styles.container}>
-        <BlankState
-          iconName="general.outlinedTextMessage"
-          title="This conversation has been deleted"
-          buttonProps={{
-            onPress: navigation.goBack,
-            title: 'Back to conversations',
-            accessibilityHint: 'Navigates back to the conversations list',
-            accessibilityRole: 'link',
-          }}
-        />
+        <BlankState.Root>
+          <BlankState.Imagery name="general.outlinedTextMessage" />
+          <BlankState.Content>
+            <BlankState.Heading>This conversation has been deleted</BlankState.Heading>
+          </BlankState.Content>
+          <BlankState.Button
+            onPress={navigation.goBack}
+            title="Back to conversations"
+            accessibilityHint="Navigates back to the conversations list"
+            accessibilityRole="link"
+          />
+        </BlankState.Root>
       </View>
     )
   }

package/src/screens/conversation_select_recipients/conversation_select_recipients_screen.tsx

@@ -1,7 +1,8 @@
 import { useNavigation } from '@react-navigation/native'
 import React from 'react'
 import { ScrollView, StyleSheet, View } from 'react-native'
-import { BlankState, Button, Heading } from '../../components'
+import { Button, Heading } from '../../components'
+import BlankState from '../../components/primitive/blank_state_primitive'
 import { GroupsGroupResource } from '../../types'
 import { useGroupsGroups } from '../../hooks/use_groups_groups'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
@@ -95,10 +96,7 @@ export const ConversationSelectRecipientsScreen = ({
             {isGroupsFetching ? (
               <DefaultLoading />
             ) : groupsWithCreatePermission.length === 0 ? (
-              <BlankState
-                subtitle="Join a group with chat enabled and permissions to start a new conversation."
-                style={styles.blankState}
-              />
+              <RecipientsBlankState subtitle="Join a group with chat enabled and permissions to start a new conversation." />
             ) : (
               <>
                 {visibleGroups.map(group => {
@@ -167,7 +165,7 @@ export const ConversationSelectRecipientsScreen = ({
                 )}
               </>
             ) : (
-              <BlankState subtitle="You don't lead any teams." style={styles.blankState} />
+              <RecipientsBlankState subtitle="You don't lead any teams." />
             )}
           </View>
         </View>
@@ -176,6 +174,19 @@ export const ConversationSelectRecipientsScreen = ({
   )
 }
 
+const RecipientsBlankState = ({ subtitle }: { subtitle: string }) => {
+  const styles = useStyles()
+
+  return (
+    <BlankState.Root style={styles.blankState}>
+      <BlankState.Imagery name="general.outlinedTextMessage" />
+      <BlankState.Content>
+        <BlankState.Text>{subtitle}</BlankState.Text>
+      </BlankState.Content>
+    </BlankState.Root>
+  )
+}
+
 const useStyles = () => {
   const { bottom } = useSafeAreaInsets()
 

package/src/screens/conversations/components/list_header_component.tsx

@@ -8,6 +8,7 @@ import { useCanDisplayGroups } from '../../../hooks/use_groups'
 import { ConversationsScreenProps } from '../conversations_screen'
 import { ChatGroupBadge } from './chat_group_badge'
 import { Haptic } from '../../../utils/native_adapters'
+import { MAX_FONT_SIZE_MULTIPLIER_LANDMARK } from '../../../utils'
 
 const ROW_PADDING_HORIZONTAL = 16
 
@@ -63,7 +64,11 @@ export const ListHeaderComponent = () => {
         <Heading numberOfLines={1} variant="h2">
           Conversations
         </Heading>
-        <TextButton onPress={alertMarkAllRead} disabled={isPending}>
+        <TextButton
+          onPress={alertMarkAllRead}
+          disabled={isPending}
+          maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER_LANDMARK}
+        >
           Mark all read
         </TextButton>
       </View>

package/src/screens/conversations/conversations_screen.tsx

@@ -6,7 +6,7 @@ import { ActionButton } from '../../components/display/action_button'
 import { ConversationsContextProvider } from '../../contexts/conversations_context'
 import { useCanCreateConversations } from '../../hooks'
 import { GraphId } from '../../types/resources/group_resource'
-import { destructureChatGroupGraphId } from '../../utils'
+import { destructureChatGroupGraphId, MAX_FONT_SIZE_MULTIPLIER_LANDMARK } from '../../utils'
 import { ListHeaderComponent } from './components/list_header_component'
 import { AppName } from '../../types/resources/app_name'
 
@@ -69,7 +69,11 @@ export function ConversationsScreen({ route }: ConversationsScreenProps) {
         onPress={handleNewConversationNavigation}
         buttonIconNameLeft="churchCenter.signups"
         secondaryButton={
-          <TextButton variant="tertiary" onPress={reportABug}>
+          <TextButton
+            variant="tertiary"
+            onPress={reportABug}
+            maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER_LANDMARK}
+          >
             Report a bug
           </TextButton>
         }

package/src/screens/design_system_screen.tsx

@@ -8,7 +8,6 @@ import {
   Badge,
   Banner,
   BannerCollapsible,
-  BlankState,
   Button,
   ToggleButton,
   Heading,
@@ -23,6 +22,7 @@ import {
   TextInlineButton,
   ImageAttachmentPreview,
 } from '../components/display'
+import BlankState from '../components/primitive/blank_state_primitive'
 import {
   MAX_FONT_SIZE_MULTIPLIER,
   platformPressedOpacityStyle,
@@ -1056,20 +1056,24 @@ function MiscComponentsSection({ isLast }: SectionProps) {
       </Group>
       <Group
         title="BlankState"
-        description="Displays a title and an optional icon, subtitle, and button. Button can be customized via `buttonProps`."
+        description="Compound component with primitives to display imagary, heading, title, and a button."
       >
         <Column>
-          <BlankState
-            iconName="general.outlinedTextMessage"
-            title="No messages"
-            subtitle="Conversation is hidden from everyone until you send a message."
-            buttonProps={{
-              onPress: buttonPress,
-              title: 'Go back',
-              accessibilityHint: 'Navigates back to the conversations list',
-              accessibilityRole: 'link',
-            }}
-          />
+          <BlankState.Root>
+            <BlankState.Imagery name="general.outlinedTextMessage" />
+            <BlankState.Content>
+              <BlankState.Heading>No messages</BlankState.Heading>
+              <BlankState.Text>
+                Conversation is hidden from everyone until you send a message.
+              </BlankState.Text>
+            </BlankState.Content>
+            <BlankState.Button
+              onPress={buttonPress}
+              title="Go back"
+              accessibilityHint="Navigates back to the conversations list"
+              accessibilityRole="link"
+            />
+          </BlankState.Root>
         </Column>
       </Group>
     </CollapsableSection>

package/src/screens/send_giphy_screen.tsx

@@ -1,7 +1,8 @@
 import { StackActions, StaticScreenProps, useNavigation } from '@react-navigation/native'
 import React from 'react'
 import { Image as NativeImage, Platform, StyleSheet, useWindowDimensions, View } from 'react-native'
-import { BlankState, Button, IconButton, IconString, TextButton } from '../components'
+import { Button, IconButton, IconString, TextButton } from '../components'
+import BlankState from '../components/primitive/blank_state_primitive'
 import { DefaultLoading } from '../components/page/loading'
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'
 import { useCreateAndroidRippleColor, useTheme } from '../hooks'
@@ -36,16 +37,14 @@ export function SendGiphyScreen({ route }: SendGiphyScreenProps) {
   if (!result)
     return (
       <FormSheet.Root contentStyle={styles.blankStateContainer}>
-        <BlankState
-          style={styles.blankState}
-          title="No Giphys found"
-          subtitle="Try a different search term."
-          iconName="general.bolt"
-          buttonProps={{
-            onPress: () => navigation.goBack(),
-            title: 'Close',
-          }}
-        />
+        <BlankState.Root style={styles.blankState}>
+          <BlankState.Imagery name="general.bolt" />
+          <BlankState.Content>
+            <BlankState.Heading>No Giphys found</BlankState.Heading>
+            <BlankState.Text>Try a different search term.</BlankState.Text>
+          </BlankState.Content>
+          <BlankState.Button onPress={() => navigation.goBack()} title="Close" />
+        </BlankState.Root>
       </FormSheet.Root>
     )
 

package/src/utils/styles.ts

@@ -2,6 +2,7 @@ import { Platform } from 'react-native'
 import { tokens } from '../vendor/tapestry/tokens'
 
 export const MAX_FONT_SIZE_MULTIPLIER = 1.5
+export const MAX_FONT_SIZE_MULTIPLIER_LANDMARK = 1.3 // Use in headers, footers, toolbars, etc.
 
 export const CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL = 16 // TODO: move to `screens/conversation/utils/styles` when `/screens/conversation` is created
 

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

@@ -1,18 +0,0 @@
-import { type ViewStyle } from 'react-native';
-import { type HeadingProps } from './heading';
-import { type IconString, type IconStyle } from './icon';
-import { type TextProps } from './text';
-import { type ButtonProps } from './button';
-interface BlankStateProps {
-    iconName?: IconString;
-    iconStyle?: IconStyle;
-    title?: string;
-    titleStyle?: HeadingProps['style'];
-    subtitle?: string;
-    subtitleStyle?: TextProps['style'];
-    style?: ViewStyle;
-    buttonProps?: ButtonProps;
-}
-export declare const BlankState: ({ iconName, title, titleStyle, subtitle, subtitleStyle, style, iconStyle, buttonProps, }: BlankStateProps) => import("react").JSX.Element;
-export {};
-//# sourceMappingURL=blank_state.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"blank_state.d.ts","sourceRoot":"","sources":["../../../src/components/display/blank_state.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,SAAS,EAAc,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AACtD,OAAO,EAAQ,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAA;AAC9D,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAA;AAE7C,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AAEnD,UAAU,eAAe;IACvB,QAAQ,CAAC,EAAE,UAAU,CAAA;IACrB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAA;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,aAAa,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;IAClC,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B;AAED,eAAO,MAAM,UAAU,6FASpB,eAAe,gCAsBjB,CAAA"}

package/build/components/display/blank_state.js

@@ -1,47 +0,0 @@
-import { View, StyleSheet } from 'react-native';
-import { Heading } from './heading';
-import { Icon } from './icon';
-import { Text } from './text';
-import { useTheme } from '../../hooks';
-import { Button } from './button';
-export const BlankState = ({ iconName, title, titleStyle, subtitle, subtitleStyle, style, iconStyle, buttonProps, }) => {
-    const styles = useStyles();
-    return (<View style={[styles.container, style]}>
-      {iconName && <Icon name={iconName} size={32} style={[styles.icon, iconStyle]}/>}
-
-      <View style={styles.content}>
-        {title && (<Heading variant="h3" style={[styles.baseText, titleStyle]}>
-            {title}
-          </Heading>)}
-        {subtitle && (<Text variant="tertiary" style={[styles.baseText, subtitleStyle]}>
-            {subtitle}
-          </Text>)}
-      </View>
-      {buttonProps && <Button variant="outline" size="sm" {...buttonProps}/>}
-    </View>);
-};
-const useStyles = () => {
-    const { colors } = useTheme();
-    return StyleSheet.create({
-        container: {
-            flex: 1,
-            alignItems: 'center',
-            justifyContent: 'center',
-            gap: 16,
-            padding: 16,
-        },
-        icon: {
-            color: colors.iconColorDefaultDisabled,
-        },
-        content: {
-            alignItems: 'center',
-            gap: 4,
-            maxWidth: 250,
-        },
-        baseText: {
-            textAlign: 'center',
-            color: colors.textColorDefaultSecondary,
-        },
-    });
-};
-//# sourceMappingURL=blank_state.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"blank_state.js","sourceRoot":"","sources":["../../../src/components/display/blank_state.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAkB,UAAU,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,OAAO,EAAqB,MAAM,WAAW,CAAA;AACtD,OAAO,EAAE,IAAI,EAAmC,MAAM,QAAQ,CAAA;AAC9D,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,MAAM,EAAoB,MAAM,UAAU,CAAA;AAanD,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,QAAQ,EACR,KAAK,EACL,UAAU,EACV,QAAQ,EACR,aAAa,EACb,KAAK,EACL,SAAS,EACT,WAAW,GACK,EAAE,EAAE;IACpB,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CACrC;MAAA,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,EAAG,CAEhF;;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAC1B;QAAA,CAAC,KAAK,IAAI,CACR,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC,CACzD;YAAA,CAAC,KAAK,CACR;UAAA,EAAE,OAAO,CAAC,CACX,CACD;QAAA,CAAC,QAAQ,IAAI,CACX,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC,CAC/D;YAAA,CAAC,QAAQ,CACX;UAAA,EAAE,IAAI,CAAC,CACR,CACH;MAAA,EAAE,IAAI,CACN;MAAA,CAAC,WAAW,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,WAAW,CAAC,EAAG,CACzE;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,SAAS,EAAE;YACT,IAAI,EAAE,CAAC;YACP,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,GAAG,EAAE,EAAE;YACP,OAAO,EAAE,EAAE;SACZ;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,MAAM,CAAC,wBAAwB;SACvC;QACD,OAAO,EAAE;YACP,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,CAAC;YACN,QAAQ,EAAE,GAAG;SACd;QACD,QAAQ,EAAE;YACR,SAAS,EAAE,QAAQ;YACnB,KAAK,EAAE,MAAM,CAAC,yBAAyB;SACxC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { View, type ViewStyle, StyleSheet } from 'react-native'\nimport { Heading, type HeadingProps } from './heading'\nimport { Icon, type IconString, type IconStyle } from './icon'\nimport { Text, type TextProps } from './text'\nimport { useTheme } from '../../hooks'\nimport { Button, type ButtonProps } from './button'\n\ninterface BlankStateProps {\n  iconName?: IconString\n  iconStyle?: IconStyle\n  title?: string\n  titleStyle?: HeadingProps['style']\n  subtitle?: string\n  subtitleStyle?: TextProps['style']\n  style?: ViewStyle\n  buttonProps?: ButtonProps\n}\n\nexport const BlankState = ({\n  iconName,\n  title,\n  titleStyle,\n  subtitle,\n  subtitleStyle,\n  style,\n  iconStyle,\n  buttonProps,\n}: BlankStateProps) => {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.container, style]}>\n      {iconName && <Icon name={iconName} size={32} style={[styles.icon, iconStyle]} />}\n\n      <View style={styles.content}>\n        {title && (\n          <Heading variant=\"h3\" style={[styles.baseText, titleStyle]}>\n            {title}\n          </Heading>\n        )}\n        {subtitle && (\n          <Text variant=\"tertiary\" style={[styles.baseText, subtitleStyle]}>\n            {subtitle}\n          </Text>\n        )}\n      </View>\n      {buttonProps && <Button variant=\"outline\" size=\"sm\" {...buttonProps} />}\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    container: {\n      flex: 1,\n      alignItems: 'center',\n      justifyContent: 'center',\n      gap: 16,\n      padding: 16,\n    },\n    icon: {\n      color: colors.iconColorDefaultDisabled,\n    },\n    content: {\n      alignItems: 'center',\n      gap: 4,\n      maxWidth: 250,\n    },\n    baseText: {\n      textAlign: 'center',\n      color: colors.textColorDefaultSecondary,\n    },\n  })\n}\n"]}

package/build/navigation/header.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { HeaderButtonProps } from '@react-navigation/elements';
-import { TextProps, TextStyle } from 'react-native';
-type HeaderRightButtonProps = HeaderButtonProps & {
-    children: TextProps['children'];
-    textStyle?: TextStyle;
-};
-export declare const HeaderRightButton: (props: HeaderRightButtonProps) => React.JSX.Element;
-export {};
-//# sourceMappingURL=header.d.ts.map

package/build/navigation/header.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../src/navigation/header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAgB,iBAAiB,EAAQ,MAAM,4BAA4B,CAAA;AAClF,OAAO,EAAc,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE/D,KAAK,sBAAsB,GAAG,iBAAiB,GAAG;IAChD,QAAQ,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,iBAAiB,UAAW,sBAAsB,sBAc9D,CAAA"}

package/build/navigation/header.js

@@ -1,16 +0,0 @@
-import React from 'react';
-import { HeaderButton, Text } from '@react-navigation/elements';
-import { StyleSheet } from 'react-native';
-export const HeaderRightButton = (props) => {
-    const styles = StyleSheet.create({
-        text: {
-            fontSize: 16,
-        },
-    });
-    return (<HeaderButton {...props} style={props.style}>
-      <Text style={[styles.text, props.textStyle]} numberOfLines={1}>
-        {props.children}
-      </Text>
-    </HeaderButton>);
-};
-//# sourceMappingURL=header.js.map

package/build/navigation/header.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"header.js","sourceRoot":"","sources":["../../src/navigation/header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,YAAY,EAAqB,IAAI,EAAE,MAAM,4BAA4B,CAAA;AAClF,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAA;AAO/D,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IACjE,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;QAC/B,IAAI,EAAE;YACJ,QAAQ,EAAE,EAAE;SACb;KACF,CAAC,CAAA;IAEF,OAAO,CACL,CAAC,YAAY,CAAC,IAAI,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAC1C;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAC5D;QAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,YAAY,CAAC,CAChB,CAAA;AACH,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { HeaderButton, HeaderButtonProps, Text } from '@react-navigation/elements'\nimport { StyleSheet, TextProps, TextStyle } from 'react-native'\n\ntype HeaderRightButtonProps = HeaderButtonProps & {\n  children: TextProps['children']\n  textStyle?: TextStyle\n}\n\nexport const HeaderRightButton = (props: HeaderRightButtonProps) => {\n  const styles = StyleSheet.create({\n    text: {\n      fontSize: 16,\n    },\n  })\n\n  return (\n    <HeaderButton {...props} style={props.style}>\n      <Text style={[styles.text, props.textStyle]} numberOfLines={1}>\n        {props.children}\n      </Text>\n    </HeaderButton>\n  )\n}\n"]}

package/src/components/display/blank_state.tsx

@@ -1,76 +0,0 @@
-import { View, type ViewStyle, StyleSheet } from 'react-native'
-import { Heading, type HeadingProps } from './heading'
-import { Icon, type IconString, type IconStyle } from './icon'
-import { Text, type TextProps } from './text'
-import { useTheme } from '../../hooks'
-import { Button, type ButtonProps } from './button'
-
-interface BlankStateProps {
-  iconName?: IconString
-  iconStyle?: IconStyle
-  title?: string
-  titleStyle?: HeadingProps['style']
-  subtitle?: string
-  subtitleStyle?: TextProps['style']
-  style?: ViewStyle
-  buttonProps?: ButtonProps
-}
-
-export const BlankState = ({
-  iconName,
-  title,
-  titleStyle,
-  subtitle,
-  subtitleStyle,
-  style,
-  iconStyle,
-  buttonProps,
-}: BlankStateProps) => {
-  const styles = useStyles()
-
-  return (
-    <View style={[styles.container, style]}>
-      {iconName && <Icon name={iconName} size={32} style={[styles.icon, iconStyle]} />}
-
-      <View style={styles.content}>
-        {title && (
-          <Heading variant="h3" style={[styles.baseText, titleStyle]}>
-            {title}
-          </Heading>
-        )}
-        {subtitle && (
-          <Text variant="tertiary" style={[styles.baseText, subtitleStyle]}>
-            {subtitle}
-          </Text>
-        )}
-      </View>
-      {buttonProps && <Button variant="outline" size="sm" {...buttonProps} />}
-    </View>
-  )
-}
-
-const useStyles = () => {
-  const { colors } = useTheme()
-
-  return StyleSheet.create({
-    container: {
-      flex: 1,
-      alignItems: 'center',
-      justifyContent: 'center',
-      gap: 16,
-      padding: 16,
-    },
-    icon: {
-      color: colors.iconColorDefaultDisabled,
-    },
-    content: {
-      alignItems: 'center',
-      gap: 4,
-      maxWidth: 250,
-    },
-    baseText: {
-      textAlign: 'center',
-      color: colors.textColorDefaultSecondary,
-    },
-  })
-}

package/src/navigation/header.tsx

@@ -1,24 +0,0 @@
-import React from 'react'
-import { HeaderButton, HeaderButtonProps, Text } from '@react-navigation/elements'
-import { StyleSheet, TextProps, TextStyle } from 'react-native'
-
-type HeaderRightButtonProps = HeaderButtonProps & {
-  children: TextProps['children']
-  textStyle?: TextStyle
-}
-
-export const HeaderRightButton = (props: HeaderRightButtonProps) => {
-  const styles = StyleSheet.create({
-    text: {
-      fontSize: 16,
-    },
-  })
-
-  return (
-    <HeaderButton {...props} style={props.style}>
-      <Text style={[styles.text, props.textStyle]} numberOfLines={1}>
-        {props.children}
-      </Text>
-    </HeaderButton>
-  )
-}