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

package/build/components/conversations.js

@@ -1,10 +1,10 @@
 import { useNavigation } from '@react-navigation/native';
 import { QueryErrorResetBoundary, useSuspenseQuery } from '@tanstack/react-query';
 import React, { Suspense, useContext } from 'react';
-import { FlatList, Pressable, StyleSheet, Text, View } from 'react-native';
+import { FlatList, Pressable, StyleSheet } from 'react-native';
 import { ChatContext } from '../contexts/chat_context';
 import { useTheme } from '../hooks';
-import { Image, Spinner } from './display';
+import { Text } from './display';
 import ErrorBoundary from './error_boundary';
 export function Conversations() {
     const { token } = useContext(ChatContext);
@@ -24,19 +24,7 @@ const Loaded = () => {
         queryKey: ['/chat/v2/me/conversations'],
     });
     const navigation = useNavigation();
-    return (<FlatList data={conversations?.data} contentContainerStyle={styles.container} style={styles.scrollView} ListEmptyComponent={<Text>No conversations found</Text>} ListHeaderComponent={<View style={styles.column}>
-          <Text style={styles.foo}>Display Components</Text>
-          <View style={[styles.row, styles.spinnerContainer]}>
-            <Spinner size={24}/>
-          </View>
-          <View style={styles.row}>
-            <Image source={{ uri: 'https://broken.url' }} style={styles.image}/>
-            <Image source={{
-                uri: 'https://picsum.photos/seed/picsum/200',
-            }} style={styles.image}/>
-          </View>
-          <Text style={styles.foo}>Conversations</Text>
-        </View>} renderItem={({ item }) => (<Pressable onPress={() => navigation.navigate('Settings')}>
+    return (<FlatList data={conversations?.data} contentContainerStyle={styles.container} style={styles.scrollView} ListEmptyComponent={<Text>No conversations found</Text>} ListHeaderComponent={<Text style={styles.foo}>Conversations</Text>} renderItem={({ item }) => (<Pressable onPress={() => navigation.navigate('Settings')}>
           <Text style={styles.listItem}>{item.attributes.title}</Text>
         </Pressable>)}/>);
 };
@@ -47,20 +35,6 @@ const useStyles = () => {
         container: { gap: 8, padding: 16 },
         foo: { fontSize: 24, color: colors.testColor },
         listItem: { color: colors.fillColorNeutral020 },
-        row: {
-            gap: 16,
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'center',
-        },
-        column: { gap: 16 },
-        spinnerContainer: {
-            height: 20,
-        },
-        image: {
-            width: 100,
-            height: 100,
-        },
     });
 };
 //# sourceMappingURL=conversations.js.map

package/build/components/conversations.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversations.js","sourceRoot":"","sources":["../../src/components/conversations.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ConversationResource, JSONAPICollection } from '@planningcenter/chat-core'\nimport { useNavigation } from '@react-navigation/native'\nimport { QueryErrorResetBoundary, useSuspenseQuery } from '@tanstack/react-query'\nimport React, { Suspense, useContext } from 'react'\nimport { FlatList, Pressable, StyleSheet, Text, View } from 'react-native'\nimport { ChatContext } from '../contexts/chat_context'\nimport { useTheme } from '../hooks'\nimport { Image, Spinner } from './display'\nimport ErrorBoundary from './error_boundary'\n\ntype ConversationsResponse = JSONAPICollection<ConversationResource>\n\nexport function Conversations() {\n  const { token } = useContext(ChatContext)\n\n  if (!token) return null\n\n  return (\n    <QueryErrorResetBoundary>\n      {({ reset }) => (\n        <ErrorBoundary onReset={reset}>\n          <Suspense fallback={<Text>loading...</Text>}>\n            <Loaded />\n          </Suspense>\n        </ErrorBoundary>\n      )}\n    </QueryErrorResetBoundary>\n  )\n}\n\nconst Loaded = () => {\n  const styles = useStyles()\n  const { data: conversations } = useSuspenseQuery<ConversationsResponse>({\n    queryKey: ['/chat/v2/me/conversations'],\n  })\n  const navigation = useNavigation()\n\n  return (\n    <FlatList\n      data={conversations?.data}\n      contentContainerStyle={styles.container}\n      style={styles.scrollView}\n      ListEmptyComponent={<Text>No conversations found</Text>}\n      ListHeaderComponent={\n        <View style={styles.column}>\n          <Text style={styles.foo}>Display Components</Text>\n          <View style={[styles.row, styles.spinnerContainer]}>\n            <Spinner size={24} />\n          </View>\n          <View style={styles.row}>\n            <Image source={{ uri: 'https://broken.url' }} style={styles.image} />\n            <Image\n              source={{\n                uri: 'https://picsum.photos/seed/picsum/200',\n              }}\n              style={styles.image}\n            />\n          </View>\n          <Text style={styles.foo}>Conversations</Text>\n        </View>\n      }\n      renderItem={({ item }) => (\n        <Pressable onPress={() => navigation.navigate('Settings')}>\n          <Text style={styles.listItem}>{item.attributes.title}</Text>\n        </Pressable>\n      )}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    scrollView: { flex: 1, backgroundColor: colors.fillColorNeutral090 },\n    container: { gap: 8, padding: 16 },\n    foo: { fontSize: 24, color: colors.testColor },\n    listItem: { color: colors.fillColorNeutral020 },\n    row: {\n      gap: 16,\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'center',\n    },\n    column: { gap: 16 },\n    spinnerContainer: {\n      height: 20,\n    },\n    image: {\n      width: 100,\n      height: 100,\n    },\n  })\n}\n"]}
+{"version":3,"file":"conversations.js","sourceRoot":"","sources":["../../src/components/conversations.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ConversationResource, JSONAPICollection } from '@planningcenter/chat-core'\nimport { useNavigation } from '@react-navigation/native'\nimport { QueryErrorResetBoundary, useSuspenseQuery } from '@tanstack/react-query'\nimport React, { Suspense, useContext } from 'react'\nimport { FlatList, Pressable, StyleSheet } from 'react-native'\nimport { ChatContext } from '../contexts/chat_context'\nimport { useTheme } from '../hooks'\nimport { Text } from './display'\nimport ErrorBoundary from './error_boundary'\n\ntype ConversationsResponse = JSONAPICollection<ConversationResource>\n\nexport function Conversations() {\n  const { token } = useContext(ChatContext)\n\n  if (!token) return null\n\n  return (\n    <QueryErrorResetBoundary>\n      {({ reset }) => (\n        <ErrorBoundary onReset={reset}>\n          <Suspense fallback={<Text>loading...</Text>}>\n            <Loaded />\n          </Suspense>\n        </ErrorBoundary>\n      )}\n    </QueryErrorResetBoundary>\n  )\n}\n\nconst Loaded = () => {\n  const styles = useStyles()\n  const { data: conversations } = useSuspenseQuery<ConversationsResponse>({\n    queryKey: ['/chat/v2/me/conversations'],\n  })\n  const navigation = useNavigation()\n\n  return (\n    <FlatList\n      data={conversations?.data}\n      contentContainerStyle={styles.container}\n      style={styles.scrollView}\n      ListEmptyComponent={<Text>No conversations found</Text>}\n      ListHeaderComponent={<Text style={styles.foo}>Conversations</Text>}\n      renderItem={({ item }) => (\n        <Pressable onPress={() => navigation.navigate('Settings')}>\n          <Text style={styles.listItem}>{item.attributes.title}</Text>\n        </Pressable>\n      )}\n    />\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    scrollView: { flex: 1, backgroundColor: colors.fillColorNeutral090 },\n    container: { gap: 8, padding: 16 },\n    foo: { fontSize: 24, color: colors.testColor },\n    listItem: { color: colors.fillColorNeutral020 },\n  })\n}\n"]}

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

@@ -1,6 +1,6 @@
 import React from 'react';
-import { ImageProps as RNImageProps, ViewStyle } from 'react-native';
-interface ImageProps extends RNImageProps {
+import { ImageProps as ReactNativeImageProps, ViewStyle } from 'react-native';
+interface ImageProps extends ReactNativeImageProps {
     /**
      * Should the image show the loading indicator by default.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,EAIL,UAAU,IAAI,YAAY,EAG1B,SAAS,EACV,MAAM,cAAc,CAAA;AAIrB,UAAU,UAAW,SAAQ,YAAY;IACvC;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,uBAAuB,CAAC,EAAE,SAAS,CAAA;CACpC;AAED,wBAAgB,KAAK,CAAC,EACpB,MAAM,EACN,MAAa,EACb,cAAqB,EACrB,UAAe,EACf,uBAAuB,EACvB,KAAK,EACL,GAAG,SAAS,EACb,EAAE,UAAU,qBA2BZ"}
+{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,EAIL,UAAU,IAAI,qBAAqB,EAGnC,SAAS,EACV,MAAM,cAAc,CAAA;AAIrB,UAAU,UAAW,SAAQ,qBAAqB;IAChD;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,uBAAuB,CAAC,EAAE,SAAS,CAAA;CACpC;AAED,wBAAgB,KAAK,CAAC,EACpB,MAAM,EACN,MAAa,EACb,cAAqB,EACrB,UAAe,EACf,uBAAuB,EACvB,KAAK,EACL,GAAG,SAAS,EACb,EAAE,UAAU,qBA2BZ"}

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

@@ -1 +1 @@
-{"version":3,"file":"image.js","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAGL,KAAK,IAAI,gBAAgB,EAEzB,UAAU,EACV,IAAI,GAEL,MAAM,cAAc,CAAA;AACrB,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAiBnC,MAAM,UAAU,KAAK,CAAC,EACpB,MAAM,EACN,MAAM,GAAG,IAAI,EACb,cAAc,GAAG,IAAI,EACrB,UAAU,GAAG,EAAE,EACf,uBAAuB,EACvB,KAAK,EACL,GAAG,SAAS,EACD;IACX,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAA;IAEtD,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;IAC7C,MAAM,EAAE,KAAK,GAAG,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,YAAY,GAAG,CAAC,EAAE,GAAG,WAAW,IAAI,EAAE,CAAA;IAC/E,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,CAAC,CAAA;IAErD,MAAM,YAAY,GAAG,CAAC,KAAU,EAAE,EAAE;QAClC,UAAU,CAAC,KAAK,CAAC,CAAA;QACjB,MAAM,EAAE,CAAC,KAAK,CAAC,CAAA;IACjB,CAAC,CAAA;IAED,OAAO,CACL,CAAC,IAAI,CACH;MAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CACnC,MAAM,CAAC,CAAC,YAAY,CAAC,CACrB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,SAAS,CAAC,EAEhB;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,EAAE,uBAAuB,CAAC,CAAC,CAC/D;UAAA,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,UAAU,CAAC,EAC5B;QAAA,EAAE,IAAI,CAAC,CACR,CACH;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,CAChB,KAAqB,EACrB,MAAsB,EACtB,YAAoC,EACpC,EAAE;IACF,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,iBAAiB,EAAE;YACjB,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,eAAe,EAAE,MAAM,CAAC,mBAAmB;YAC3C,YAAY;YACZ,KAAK;YACL,MAAM;SACP;QACD,KAAK,EAAE;YACL,eAAe,EAAE,aAAa;SAC/B;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { noop } from 'lodash'\nimport React, { useState } from 'react'\nimport {\n  AnimatableNumericValue,\n  DimensionValue,\n  Image as ReactNativeImage,\n  ImageProps as RNImageProps,\n  StyleSheet,\n  View,\n  ViewStyle,\n} from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { Spinner } from './spinner'\n\ninterface ImageProps extends RNImageProps {\n  /**\n   * Should the image show the loading indicator by default.\n   */\n  defaultLoading?: boolean\n  /**\n   * Size of the loading spinner.\n   */\n  loaderSize?: number\n  /**\n   * Style object for the preload background.\n   */\n  loadingBackgroundStyles?: ViewStyle\n}\n\nexport function Image({\n  source,\n  onLoad = noop,\n  defaultLoading = true,\n  loaderSize = 24,\n  loadingBackgroundStyles,\n  style,\n  ...restProps\n}: ImageProps) {\n  const [loading, setLoading] = useState(defaultLoading)\n\n  const imageStyles = StyleSheet.flatten(style)\n  const { width = '100%', height = '100%', borderRadius = 0 } = imageStyles || {}\n  const styles = useStyles(width, height, borderRadius)\n\n  const handleOnLoad = (event: any) => {\n    setLoading(false)\n    onLoad?.(event)\n  }\n\n  return (\n    <View>\n      <ReactNativeImage\n        style={[styles.image, imageStyles]}\n        onLoad={handleOnLoad}\n        source={source}\n        {...restProps}\n      />\n      {loading && (\n        <View style={[styles.loadingBackground, loadingBackgroundStyles]}>\n          <Spinner size={loaderSize} />\n        </View>\n      )}\n    </View>\n  )\n}\n\nconst useStyles = (\n  width: DimensionValue,\n  height: DimensionValue,\n  borderRadius: AnimatableNumericValue\n) => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    loadingBackground: {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      backgroundColor: colors.fillColorNeutral070,\n      borderRadius,\n      width,\n      height,\n    },\n    image: {\n      backgroundColor: 'transparent',\n    },\n  })\n}\n"]}
+{"version":3,"file":"image.js","sourceRoot":"","sources":["../../../src/components/display/image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAGL,KAAK,IAAI,gBAAgB,EAEzB,UAAU,EACV,IAAI,GAEL,MAAM,cAAc,CAAA;AACrB,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAiBnC,MAAM,UAAU,KAAK,CAAC,EACpB,MAAM,EACN,MAAM,GAAG,IAAI,EACb,cAAc,GAAG,IAAI,EACrB,UAAU,GAAG,EAAE,EACf,uBAAuB,EACvB,KAAK,EACL,GAAG,SAAS,EACD;IACX,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAA;IAEtD,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;IAC7C,MAAM,EAAE,KAAK,GAAG,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,YAAY,GAAG,CAAC,EAAE,GAAG,WAAW,IAAI,EAAE,CAAA;IAC/E,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,CAAC,CAAA;IAErD,MAAM,YAAY,GAAG,CAAC,KAAU,EAAE,EAAE;QAClC,UAAU,CAAC,KAAK,CAAC,CAAA;QACjB,MAAM,EAAE,CAAC,KAAK,CAAC,CAAA;IACjB,CAAC,CAAA;IAED,OAAO,CACL,CAAC,IAAI,CACH;MAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CACnC,MAAM,CAAC,CAAC,YAAY,CAAC,CACrB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,SAAS,CAAC,EAEhB;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,EAAE,uBAAuB,CAAC,CAAC,CAC/D;UAAA,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,UAAU,CAAC,EAC5B;QAAA,EAAE,IAAI,CAAC,CACR,CACH;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,CAChB,KAAqB,EACrB,MAAsB,EACtB,YAAoC,EACpC,EAAE;IACF,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,iBAAiB,EAAE;YACjB,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,eAAe,EAAE,MAAM,CAAC,mBAAmB;YAC3C,YAAY;YACZ,KAAK;YACL,MAAM;SACP;QACD,KAAK,EAAE;YACL,eAAe,EAAE,aAAa;SAC/B;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { noop } from 'lodash'\nimport React, { useState } from 'react'\nimport {\n  AnimatableNumericValue,\n  DimensionValue,\n  Image as ReactNativeImage,\n  ImageProps as ReactNativeImageProps,\n  StyleSheet,\n  View,\n  ViewStyle,\n} from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { Spinner } from './spinner'\n\ninterface ImageProps extends ReactNativeImageProps {\n  /**\n   * Should the image show the loading indicator by default.\n   */\n  defaultLoading?: boolean\n  /**\n   * Size of the loading spinner.\n   */\n  loaderSize?: number\n  /**\n   * Style object for the preload background.\n   */\n  loadingBackgroundStyles?: ViewStyle\n}\n\nexport function Image({\n  source,\n  onLoad = noop,\n  defaultLoading = true,\n  loaderSize = 24,\n  loadingBackgroundStyles,\n  style,\n  ...restProps\n}: ImageProps) {\n  const [loading, setLoading] = useState(defaultLoading)\n\n  const imageStyles = StyleSheet.flatten(style)\n  const { width = '100%', height = '100%', borderRadius = 0 } = imageStyles || {}\n  const styles = useStyles(width, height, borderRadius)\n\n  const handleOnLoad = (event: any) => {\n    setLoading(false)\n    onLoad?.(event)\n  }\n\n  return (\n    <View>\n      <ReactNativeImage\n        style={[styles.image, imageStyles]}\n        onLoad={handleOnLoad}\n        source={source}\n        {...restProps}\n      />\n      {loading && (\n        <View style={[styles.loadingBackground, loadingBackgroundStyles]}>\n          <Spinner size={loaderSize} />\n        </View>\n      )}\n    </View>\n  )\n}\n\nconst useStyles = (\n  width: DimensionValue,\n  height: DimensionValue,\n  borderRadius: AnimatableNumericValue\n) => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    loadingBackground: {\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      backgroundColor: colors.fillColorNeutral070,\n      borderRadius,\n      width,\n      height,\n    },\n    image: {\n      backgroundColor: 'transparent',\n    },\n  })\n}\n"]}

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

@@ -1,3 +1,4 @@
 export { Spinner } from './spinner';
 export { Image } from './image';
+export { Text } from './text';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA"}

package/build/components/display/index.js

@@ -1,3 +1,4 @@
 export { Spinner } from './spinner';
 export { Image } from './image';
+export { Text } from './text';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA","sourcesContent":["export { Spinner } from './spinner'\nexport { Image } from './image'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA","sourcesContent":["export { Spinner } from './spinner'\nexport { Image } from './image'\nexport { Text } from './text'\n"]}

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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { TextProps as ReactNativeTextProps } from 'react-native';
+interface TextProps extends ReactNativeTextProps {
+    variant?: 'plain' | 'secondary' | 'tertiary' | 'footnote';
+}
+export declare function Text({ style, variant, children, ...rest }: TextProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=text.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../src/components/display/text.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAIL,SAAS,IAAI,oBAAoB,EAClC,MAAM,cAAc,CAAA;AAErB,UAAU,SAAU,SAAQ,oBAAoB;IAC9C,OAAO,CAAC,EAAE,OAAO,GAAG,WAAW,GAAG,UAAU,GAAG,UAAU,CAAA;CAC1D;AAED,wBAAgB,IAAI,CAAC,EAAE,KAAK,EAAE,OAAiB,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,qBAc9E"}

package/build/components/display/text.js

@@ -0,0 +1,47 @@
+import { useTheme } from '../../hooks';
+import React from 'react';
+import { Platform, StyleSheet, Text as ReactNativeText, } from 'react-native';
+export function Text({ style, variant = 'plain', children, ...rest }) {
+    const styles = useStyles();
+    const variantStyleMap = {
+        plain: styles.plain,
+        secondary: styles.secondary,
+        tertiary: styles.tertiary,
+        footnote: styles.footnote,
+    };
+    return (<ReactNativeText style={[styles.global, variantStyleMap[variant], style]} {...rest}>
+      {children}
+    </ReactNativeText>);
+}
+const useStyles = () => {
+    const { colors } = useTheme();
+    return StyleSheet.create({
+        global: {
+            fontFamily: Platform.select({
+                ios: 'System',
+                android: 'normal',
+            }),
+        },
+        plain: {
+            color: colors.textColorDefaultPrimary,
+            fontSize: 16,
+            lineHeight: 24,
+        },
+        secondary: {
+            color: colors.textColorDefaultPrimary,
+            fontSize: 15,
+            lineHeight: 22,
+        },
+        tertiary: {
+            color: colors.textColorDefaultPrimary,
+            fontSize: 14,
+            lineHeight: 20,
+        },
+        footnote: {
+            color: colors.textColorDefaultSecondary,
+            fontSize: 13,
+            lineHeight: 16,
+        },
+    });
+};
+//# sourceMappingURL=text.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../../../src/components/display/text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EACL,QAAQ,EACR,UAAU,EACV,IAAI,IAAI,eAAe,GAExB,MAAM,cAAc,CAAA;AAMrB,MAAM,UAAU,IAAI,CAAC,EAAE,KAAK,EAAE,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAa;IAC7E,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,eAAe,GAAG;QACtB,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,SAAS,EAAE,MAAM,CAAC,SAAS;QAC3B,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,QAAQ,EAAE,MAAM,CAAC,QAAQ;KAC1B,CAAA;IAED,OAAO,CACL,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CACjF;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,eAAe,CAAC,CACnB,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAC7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,MAAM,EAAE;YACN,UAAU,EAAE,QAAQ,CAAC,MAAM,CAAC;gBAC1B,GAAG,EAAE,QAAQ;gBACb,OAAO,EAAE,QAAQ;aAClB,CAAC;SACH;QACD,KAAK,EAAE;YACL,KAAK,EAAE,MAAM,CAAC,uBAAuB;YACrC,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,SAAS,EAAE;YACT,KAAK,EAAE,MAAM,CAAC,uBAAuB;YACrC,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,MAAM,CAAC,uBAAuB;YACrC,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,MAAM,CAAC,yBAAyB;YACvC,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useTheme } from '../../hooks'\nimport React from 'react'\nimport {\n  Platform,\n  StyleSheet,\n  Text as ReactNativeText,\n  TextProps as ReactNativeTextProps,\n} from 'react-native'\n\ninterface TextProps extends ReactNativeTextProps {\n  variant?: 'plain' | 'secondary' | 'tertiary' | 'footnote'\n}\n\nexport function Text({ style, variant = 'plain', children, ...rest }: TextProps) {\n  const styles = useStyles()\n  const variantStyleMap = {\n    plain: styles.plain,\n    secondary: styles.secondary,\n    tertiary: styles.tertiary,\n    footnote: styles.footnote,\n  }\n\n  return (\n    <ReactNativeText style={[styles.global, variantStyleMap[variant], style]} {...rest}>\n      {children}\n    </ReactNativeText>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  return StyleSheet.create({\n    global: {\n      fontFamily: Platform.select({\n        ios: 'System',\n        android: 'normal',\n      }),\n    },\n    plain: {\n      color: colors.textColorDefaultPrimary,\n      fontSize: 16,\n      lineHeight: 24,\n    },\n    secondary: {\n      color: colors.textColorDefaultPrimary,\n      fontSize: 15,\n      lineHeight: 22,\n    },\n    tertiary: {\n      color: colors.textColorDefaultPrimary,\n      fontSize: 14,\n      lineHeight: 20,\n    },\n    footnote: {\n      color: colors.textColorDefaultSecondary,\n      fontSize: 13,\n      lineHeight: 16,\n    },\n  })\n}\n"]}

package/build/index.d.ts

@@ -3,5 +3,6 @@ import { ChatContext, ChatProvider } from './contexts/chat_context';
 import { OAuthToken } from './types';
 import { baseUrlMap, uploadUrlMap } from './utils/session';
 import { TemporaryDefaultColorsType } from './utils/theme';
+export * from './screens';
 export { baseUrlMap, ChatContext, ChatProvider, Conversations, OAuthToken, TemporaryDefaultColorsType, uploadUrlMap, };
 //# sourceMappingURL=index.d.ts.map

package/build/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC1D,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,EACL,UAAU,EACV,WAAW,EACX,YAAY,EACZ,aAAa,EACb,UAAU,EACV,0BAA0B,EAC1B,YAAY,GACb,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC1D,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAA;AAC1D,cAAc,WAAW,CAAA;AAEzB,OAAO,EACL,UAAU,EACV,WAAW,EACX,YAAY,EACZ,aAAa,EACb,UAAU,EACV,0BAA0B,EAC1B,YAAY,GACb,CAAA"}

package/build/index.js

@@ -1,5 +1,6 @@
 import { Conversations } from './components/conversations';
 import { ChatContext, ChatProvider } from './contexts/chat_context';
 import { baseUrlMap, uploadUrlMap } from './utils/session';
+export * from './screens';
 export { baseUrlMap, ChatContext, ChatProvider, Conversations, uploadUrlMap, };
 //# sourceMappingURL=index.js.map

package/build/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AAEnE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAG1D,OAAO,EACL,UAAU,EACV,WAAW,EACX,YAAY,EACZ,aAAa,EAGb,YAAY,GACb,CAAA","sourcesContent":["import { Conversations } from './components/conversations'\nimport { ChatContext, ChatProvider } from './contexts/chat_context'\nimport { OAuthToken } from './types'\nimport { baseUrlMap, uploadUrlMap } from './utils/session'\nimport { TemporaryDefaultColorsType } from './utils/theme'\n\nexport {\n  baseUrlMap,\n  ChatContext,\n  ChatProvider,\n  Conversations,\n  OAuthToken,\n  TemporaryDefaultColorsType,\n  uploadUrlMap,\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AAEnE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE1D,cAAc,WAAW,CAAA;AAEzB,OAAO,EACL,UAAU,EACV,WAAW,EACX,YAAY,EACZ,aAAa,EAGb,YAAY,GACb,CAAA","sourcesContent":["import { Conversations } from './components/conversations'\nimport { ChatContext, ChatProvider } from './contexts/chat_context'\nimport { OAuthToken } from './types'\nimport { baseUrlMap, uploadUrlMap } from './utils/session'\nimport { TemporaryDefaultColorsType } from './utils/theme'\nexport * from './screens'\n\nexport {\n  baseUrlMap,\n  ChatContext,\n  ChatProvider,\n  Conversations,\n  OAuthToken,\n  TemporaryDefaultColorsType,\n  uploadUrlMap,\n}\n"]}

package/build/screens/display.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare function DisplayScreen(): React.JSX.Element;
+//# sourceMappingURL=display.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"display.d.ts","sourceRoot":"","sources":["../../src/screens/display.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,wBAAgB,aAAa,sBA2B5B"}

package/build/screens/display.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import { ScrollView, StyleSheet, View } from 'react-native';
+import { useTheme } from '../hooks';
+import { Image, Spinner, Text } from '../components/display';
+export function DisplayScreen() {
+    const styles = useStyles();
+    return (<ScrollView contentContainerStyle={styles.container} style={styles.scrollView}>
+      <View style={styles.column}>
+        <View style={[styles.row, styles.spinnerContainer]}>
+          <Spinner size={24}/>
+        </View>
+        <View style={styles.row}>
+          <Image source={{ uri: 'https://broken.url' }} style={styles.image}/>
+          <Image source={{
+            uri: 'https://picsum.photos/seed/picsum/200',
+        }} style={styles.image}/>
+        </View>
+        <View style={styles.row}>
+          <Text>Plain text</Text>
+          <Text variant="secondary">Secondary</Text>
+          <Text variant="tertiary">Tertiary</Text>
+          <Text variant="footnote">Footnote</Text>
+        </View>
+      </View>
+    </ScrollView>);
+}
+const useStyles = () => {
+    const { colors } = useTheme();
+    return StyleSheet.create({
+        scrollView: { flex: 1, backgroundColor: colors.fillColorNeutral090 },
+        container: { gap: 16, padding: 24 },
+        listItem: { color: colors.fillColorNeutral020 },
+        row: {
+            gap: 16,
+            flexDirection: 'row',
+            alignItems: 'center',
+            justifyContent: 'center',
+            flexWrap: 'wrap',
+        },
+        column: { gap: 32 },
+        spinnerContainer: {
+            height: 20,
+        },
+        image: {
+            width: 100,
+            height: 100,
+        },
+    });
+};
+//# sourceMappingURL=display.js.map

package/build/screens/display.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"display.js","sourceRoot":"","sources":["../../src/screens/display.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAE5D,MAAM,UAAU,aAAa;IAC3B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAC5E;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CACzB;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,gBAAgB,CAAC,CAAC,CACjD;UAAA,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EACpB;QAAA,EAAE,IAAI,CACN;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CACtB;UAAA,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,EAAE,oBAAoB,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAClE;UAAA,CAAC,KAAK,CACJ,MAAM,CAAC,CAAC;YACN,GAAG,EAAE,uCAAuC;SAC7C,CAAC,CACF,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAExB;QAAA,EAAE,IAAI,CACN;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CACtB;UAAA,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CACtB;UAAA,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,SAAS,EAAE,IAAI,CACzC;UAAA,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,QAAQ,EAAE,IAAI,CACvC;UAAA,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,QAAQ,EAAE,IAAI,CACzC;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,UAAU,CAAC,CACd,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,UAAU,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,mBAAmB,EAAE;QACpE,SAAS,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;QACnC,QAAQ,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,mBAAmB,EAAE;QAC/C,GAAG,EAAE;YACH,GAAG,EAAE,EAAE;YACP,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,QAAQ,EAAE,MAAM;SACjB;QACD,MAAM,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE;QACnB,gBAAgB,EAAE;YAChB,MAAM,EAAE,EAAE;SACX;QACD,KAAK,EAAE;YACL,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;SACZ;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { ScrollView, StyleSheet, View } from 'react-native'\nimport { useTheme } from '../hooks'\nimport { Image, Spinner, Text } from '../components/display'\n\nexport function DisplayScreen() {\n  const styles = useStyles()\n\n  return (\n    <ScrollView contentContainerStyle={styles.container} style={styles.scrollView}>\n      <View style={styles.column}>\n        <View style={[styles.row, styles.spinnerContainer]}>\n          <Spinner size={24} />\n        </View>\n        <View style={styles.row}>\n          <Image source={{ uri: 'https://broken.url' }} style={styles.image} />\n          <Image\n            source={{\n              uri: 'https://picsum.photos/seed/picsum/200',\n            }}\n            style={styles.image}\n          />\n        </View>\n        <View style={styles.row}>\n          <Text>Plain text</Text>\n          <Text variant=\"secondary\">Secondary</Text>\n          <Text variant=\"tertiary\">Tertiary</Text>\n          <Text variant=\"footnote\">Footnote</Text>\n        </View>\n      </View>\n    </ScrollView>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    scrollView: { flex: 1, backgroundColor: colors.fillColorNeutral090 },\n    container: { gap: 16, padding: 24 },\n    listItem: { color: colors.fillColorNeutral020 },\n    row: {\n      gap: 16,\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexWrap: 'wrap',\n    },\n    column: { gap: 32 },\n    spinnerContainer: {\n      height: 20,\n    },\n    image: {\n      width: 100,\n      height: 100,\n    },\n  })\n}\n"]}

package/build/screens/index.d.ts

@@ -0,0 +1,2 @@
+export * from './display';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/screens/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA"}

package/build/screens/index.js

@@ -0,0 +1,2 @@
+export * from './display';
+//# sourceMappingURL=index.js.map

package/build/screens/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/screens/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA","sourcesContent":["export * from './display'\n"]}

package/build/vendor/tapestry/tapestry_alias_tokens_color_map.d.ts

@@ -6,6 +6,12 @@ export declare const tapestryAliasTokensColorMap: {
         iconColorDefaultDim: string;
         iconColorDefaultDisabled: string;
         iconColorDefaultInverted: string;
+        textColorDefaultHeadline: string;
+        textColorDefaultPrimary: string;
+        textColorDefaultSecondary: string;
+        textColorDefaultDisabled: string;
+        textColorDefaultPlaceholder: string;
+        textColorDefaultInverted: string;
         fillColorNeutral000: string;
         fillColorNeutral010: string;
         fillColorNeutral020: string;
@@ -25,6 +31,12 @@ export declare const tapestryAliasTokensColorMap: {
         iconColorDefaultDim: string;
         iconColorDefaultDisabled: string;
         iconColorDefaultInverted: string;
+        textColorDefaultHeadline: string;
+        textColorDefaultPrimary: string;
+        textColorDefaultSecondary: string;
+        textColorDefaultDisabled: string;
+        textColorDefaultPlaceholder: string;
+        textColorDefaultInverted: string;
         fillColorNeutral000: string;
         fillColorNeutral010: string;
         fillColorNeutral020: string;

package/build/vendor/tapestry/tapestry_alias_tokens_color_map.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tapestry_alias_tokens_color_map.d.ts","sourceRoot":"","sources":["../../../src/vendor/tapestry/tapestry_alias_tokens_color_map.ts"],"names":[],"mappings":"AA8EA,eAAO,MAAM,2BAA2B;;cA1BhC,MAAM;iCACa,MAAM;mCACJ,MAAM;6BACZ,MAAM;kCACD,MAAM;kCACN,MAAM;6BAjDX,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;iCACF,MAAM;6BACV,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;qCACE,MAAM;;;cAkC7B,MAAM;iCACa,MAAM;mCACJ,MAAM;6BACZ,MAAM;kCACD,MAAM;kCACN,MAAM;6BAjDX,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;iCACF,MAAM;6BACV,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;qCACE,MAAM;;CA+DpC,CAAA"}
+{"version":3,"file":"tapestry_alias_tokens_color_map.d.ts","sourceRoot":"","sources":["../../../src/vendor/tapestry/tapestry_alias_tokens_color_map.ts"],"names":[],"mappings":"AAgGA,eAAO,MAAM,2BAA2B;;cA5ChC,MAAM;iCACa,MAAM;mCACJ,MAAM;6BACZ,MAAM;kCACD,MAAM;kCACN,MAAM;kCACN,MAAM;iCACP,MAAM;mCACJ,MAAM;kCACP,MAAM;qCACH,MAAM;kCACT,MAAM;6BAvDX,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;iCACF,MAAM;6BACV,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;qCACE,MAAM;;;cAkC7B,MAAM;iCACa,MAAM;mCACJ,MAAM;6BACZ,MAAM;kCACD,MAAM;kCACN,MAAM;kCACN,MAAM;iCACP,MAAM;mCACJ,MAAM;kCACP,MAAM;qCACH,MAAM;kCACT,MAAM;6BAvDX,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;iCACF,MAAM;6BACV,MAAM;6BACN,MAAM;6BACN,MAAM;6BACN,MAAM;qCACE,MAAM;;CAiFpC,CAAA"}

package/build/vendor/tapestry/tapestry_alias_tokens_color_map.js

@@ -34,6 +34,12 @@ const semanticAliasesLight = {
     iconColorDefaultDim: neutralsLight.fillColorNeutral030,
     iconColorDefaultDisabled: neutralsLight.fillColorNeutral040,
     iconColorDefaultInverted: neutralsLight.fillColorNeutral100Inverted,
+    textColorDefaultHeadline: neutralsLight.fillColorNeutral000,
+    textColorDefaultPrimary: neutralsLight.fillColorNeutral010,
+    textColorDefaultSecondary: neutralsLight.fillColorNeutral020,
+    textColorDefaultDisabled: neutralsLight.fillColorNeutral040,
+    textColorDefaultPlaceholder: neutralsLight.fillColorNeutral030,
+    textColorDefaultInverted: tokens.colorNeutral100White,
 };
 const semanticAliasesDark = {
     name: 'dark',
@@ -42,6 +48,12 @@ const semanticAliasesDark = {
     iconColorDefaultDim: neutralsDark.fillColorNeutral030,
     iconColorDefaultDisabled: neutralsDark.fillColorNeutral040,
     iconColorDefaultInverted: neutralsDark.fillColorNeutral100Inverted,
+    textColorDefaultHeadline: neutralsDark.fillColorNeutral000,
+    textColorDefaultPrimary: neutralsDark.fillColorNeutral010,
+    textColorDefaultSecondary: neutralsDark.fillColorNeutral020,
+    textColorDefaultDisabled: neutralsDark.fillColorNeutral040,
+    textColorDefaultPlaceholder: neutralsDark.fillColorNeutral030,
+    textColorDefaultInverted: tokens.colorNeutral7,
 };
 export const tapestryAliasTokensColorMap = {
     light: { ...neutralsLight, ...semanticAliasesLight },

package/build/vendor/tapestry/tapestry_alias_tokens_color_map.js.map

@@ -1 +1 @@
-{"version":3,"file":"tapestry_alias_tokens_color_map.js","sourceRoot":"","sources":["../../../src/vendor/tapestry/tapestry_alias_tokens_color_map.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAqBjC,MAAM,aAAa,GAAkB;IACnC,IAAI,EAAE,OAAO;IACb,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,uBAAuB,EAAE,MAAM,CAAC,cAAc;IAC9C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,2BAA2B,EAAE,MAAM,CAAC,oBAAoB;CACzD,CAAA;AAED,MAAM,YAAY,GAAkB;IAClC,IAAI,EAAE,MAAM;IACZ,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,uBAAuB,EAAE,MAAM,CAAC,cAAc;IAC9C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,2BAA2B,EAAE,MAAM,CAAC,aAAa;CAClD,CAAA;AAWD,MAAM,oBAAoB,GAA0B;IAClD,IAAI,EAAE,OAAO;IACb,uBAAuB,EAAE,aAAa,CAAC,mBAAmB;IAC1D,yBAAyB,EAAE,aAAa,CAAC,mBAAmB;IAC5D,mBAAmB,EAAE,aAAa,CAAC,mBAAmB;IACtD,wBAAwB,EAAE,aAAa,CAAC,mBAAmB;IAC3D,wBAAwB,EAAE,aAAa,CAAC,2BAA2B;CACpE,CAAA;AAED,MAAM,mBAAmB,GAA0B;IACjD,IAAI,EAAE,MAAM;IACZ,uBAAuB,EAAE,YAAY,CAAC,mBAAmB;IACzD,yBAAyB,EAAE,YAAY,CAAC,mBAAmB;IAC3D,mBAAmB,EAAE,YAAY,CAAC,mBAAmB;IACrD,wBAAwB,EAAE,YAAY,CAAC,mBAAmB;IAC1D,wBAAwB,EAAE,YAAY,CAAC,2BAA2B;CACnE,CAAA;AAED,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,KAAK,EAAE,EAAE,GAAG,aAAa,EAAE,GAAG,oBAAoB,EAAE;IACpD,IAAI,EAAE,EAAE,GAAG,YAAY,EAAE,GAAG,mBAAmB,EAAE;CAClD,CAAA","sourcesContent":["import { tokens } from './tokens'\n\n// Copied from `@planningcenter/tapestry` package.\n// Defining these tokens locally is a temporary solution until the package supports mobile.\n// Tokens Reference: https://planningcenter.github.io/tapestry/?path=/docs/foundations-design-tokens--docs\n\ninterface NeutralColors {\n  name: string\n  fillColorNeutral000: string\n  fillColorNeutral010: string\n  fillColorNeutral020: string\n  fillColorNeutral030: string\n  fillColorNeutral040: string\n  fillColorNeutral050Base: string\n  fillColorNeutral060: string\n  fillColorNeutral070: string\n  fillColorNeutral080: string\n  fillColorNeutral090: string\n  fillColorNeutral100Inverted: string\n}\n\nconst neutralsLight: NeutralColors = {\n  name: 'light',\n  fillColorNeutral000: tokens.colorNeutral12,\n  fillColorNeutral010: tokens.colorNeutral24,\n  fillColorNeutral020: tokens.colorNeutral45,\n  fillColorNeutral030: tokens.colorNeutral58,\n  fillColorNeutral040: tokens.colorNeutral81,\n  fillColorNeutral050Base: tokens.colorNeutral88,\n  fillColorNeutral060: tokens.colorNeutral93,\n  fillColorNeutral070: tokens.colorNeutral95,\n  fillColorNeutral080: tokens.colorNeutral97,\n  fillColorNeutral090: tokens.colorNeutral98,\n  fillColorNeutral100Inverted: tokens.colorNeutral100White,\n}\n\nconst neutralsDark: NeutralColors = {\n  name: 'dark',\n  fillColorNeutral000: tokens.colorNeutral98,\n  fillColorNeutral010: tokens.colorNeutral88,\n  fillColorNeutral020: tokens.colorNeutral68,\n  fillColorNeutral030: tokens.colorNeutral50,\n  fillColorNeutral040: tokens.colorNeutral32,\n  fillColorNeutral050Base: tokens.colorNeutral24,\n  fillColorNeutral060: tokens.colorNeutral19,\n  fillColorNeutral070: tokens.colorNeutral17,\n  fillColorNeutral080: tokens.colorNeutral15,\n  fillColorNeutral090: tokens.colorNeutral12,\n  fillColorNeutral100Inverted: tokens.colorNeutral7,\n}\n\ninterface SemanticAliasesColors {\n  name: string\n  iconColorDefaultPrimary: string\n  iconColorDefaultSecondary: string\n  iconColorDefaultDim: string\n  iconColorDefaultDisabled: string\n  iconColorDefaultInverted: string\n}\n\nconst semanticAliasesLight: SemanticAliasesColors = {\n  name: 'light',\n  iconColorDefaultPrimary: neutralsLight.fillColorNeutral010,\n  iconColorDefaultSecondary: neutralsLight.fillColorNeutral020,\n  iconColorDefaultDim: neutralsLight.fillColorNeutral030,\n  iconColorDefaultDisabled: neutralsLight.fillColorNeutral040,\n  iconColorDefaultInverted: neutralsLight.fillColorNeutral100Inverted,\n}\n\nconst semanticAliasesDark: SemanticAliasesColors = {\n  name: 'dark',\n  iconColorDefaultPrimary: neutralsDark.fillColorNeutral010,\n  iconColorDefaultSecondary: neutralsDark.fillColorNeutral020,\n  iconColorDefaultDim: neutralsDark.fillColorNeutral030,\n  iconColorDefaultDisabled: neutralsDark.fillColorNeutral040,\n  iconColorDefaultInverted: neutralsDark.fillColorNeutral100Inverted,\n}\n\nexport const tapestryAliasTokensColorMap = {\n  light: { ...neutralsLight, ...semanticAliasesLight },\n  dark: { ...neutralsDark, ...semanticAliasesDark },\n}\n"]}
+{"version":3,"file":"tapestry_alias_tokens_color_map.js","sourceRoot":"","sources":["../../../src/vendor/tapestry/tapestry_alias_tokens_color_map.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAqBjC,MAAM,aAAa,GAAkB;IACnC,IAAI,EAAE,OAAO;IACb,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,uBAAuB,EAAE,MAAM,CAAC,cAAc;IAC9C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,2BAA2B,EAAE,MAAM,CAAC,oBAAoB;CACzD,CAAA;AAED,MAAM,YAAY,GAAkB;IAClC,IAAI,EAAE,MAAM;IACZ,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,uBAAuB,EAAE,MAAM,CAAC,cAAc;IAC9C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,mBAAmB,EAAE,MAAM,CAAC,cAAc;IAC1C,2BAA2B,EAAE,MAAM,CAAC,aAAa;CAClD,CAAA;AAiBD,MAAM,oBAAoB,GAA0B;IAClD,IAAI,EAAE,OAAO;IACb,uBAAuB,EAAE,aAAa,CAAC,mBAAmB;IAC1D,yBAAyB,EAAE,aAAa,CAAC,mBAAmB;IAC5D,mBAAmB,EAAE,aAAa,CAAC,mBAAmB;IACtD,wBAAwB,EAAE,aAAa,CAAC,mBAAmB;IAC3D,wBAAwB,EAAE,aAAa,CAAC,2BAA2B;IACnE,wBAAwB,EAAE,aAAa,CAAC,mBAAmB;IAC3D,uBAAuB,EAAE,aAAa,CAAC,mBAAmB;IAC1D,yBAAyB,EAAE,aAAa,CAAC,mBAAmB;IAC5D,wBAAwB,EAAE,aAAa,CAAC,mBAAmB;IAC3D,2BAA2B,EAAE,aAAa,CAAC,mBAAmB;IAC9D,wBAAwB,EAAE,MAAM,CAAC,oBAAoB;CACtD,CAAA;AAED,MAAM,mBAAmB,GAA0B;IACjD,IAAI,EAAE,MAAM;IACZ,uBAAuB,EAAE,YAAY,CAAC,mBAAmB;IACzD,yBAAyB,EAAE,YAAY,CAAC,mBAAmB;IAC3D,mBAAmB,EAAE,YAAY,CAAC,mBAAmB;IACrD,wBAAwB,EAAE,YAAY,CAAC,mBAAmB;IAC1D,wBAAwB,EAAE,YAAY,CAAC,2BAA2B;IAClE,wBAAwB,EAAE,YAAY,CAAC,mBAAmB;IAC1D,uBAAuB,EAAE,YAAY,CAAC,mBAAmB;IACzD,yBAAyB,EAAE,YAAY,CAAC,mBAAmB;IAC3D,wBAAwB,EAAE,YAAY,CAAC,mBAAmB;IAC1D,2BAA2B,EAAE,YAAY,CAAC,mBAAmB;IAC7D,wBAAwB,EAAE,MAAM,CAAC,aAAa;CAC/C,CAAA;AAED,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,KAAK,EAAE,EAAE,GAAG,aAAa,EAAE,GAAG,oBAAoB,EAAE;IACpD,IAAI,EAAE,EAAE,GAAG,YAAY,EAAE,GAAG,mBAAmB,EAAE;CAClD,CAAA","sourcesContent":["import { tokens } from './tokens'\n\n// Copied from `@planningcenter/tapestry` package.\n// Defining these tokens locally is a temporary solution until the package supports mobile.\n// Tokens Reference: https://planningcenter.github.io/tapestry/?path=/docs/foundations-design-tokens--docs\n\ninterface NeutralColors {\n  name: string\n  fillColorNeutral000: string\n  fillColorNeutral010: string\n  fillColorNeutral020: string\n  fillColorNeutral030: string\n  fillColorNeutral040: string\n  fillColorNeutral050Base: string\n  fillColorNeutral060: string\n  fillColorNeutral070: string\n  fillColorNeutral080: string\n  fillColorNeutral090: string\n  fillColorNeutral100Inverted: string\n}\n\nconst neutralsLight: NeutralColors = {\n  name: 'light',\n  fillColorNeutral000: tokens.colorNeutral12,\n  fillColorNeutral010: tokens.colorNeutral24,\n  fillColorNeutral020: tokens.colorNeutral45,\n  fillColorNeutral030: tokens.colorNeutral58,\n  fillColorNeutral040: tokens.colorNeutral81,\n  fillColorNeutral050Base: tokens.colorNeutral88,\n  fillColorNeutral060: tokens.colorNeutral93,\n  fillColorNeutral070: tokens.colorNeutral95,\n  fillColorNeutral080: tokens.colorNeutral97,\n  fillColorNeutral090: tokens.colorNeutral98,\n  fillColorNeutral100Inverted: tokens.colorNeutral100White,\n}\n\nconst neutralsDark: NeutralColors = {\n  name: 'dark',\n  fillColorNeutral000: tokens.colorNeutral98,\n  fillColorNeutral010: tokens.colorNeutral88,\n  fillColorNeutral020: tokens.colorNeutral68,\n  fillColorNeutral030: tokens.colorNeutral50,\n  fillColorNeutral040: tokens.colorNeutral32,\n  fillColorNeutral050Base: tokens.colorNeutral24,\n  fillColorNeutral060: tokens.colorNeutral19,\n  fillColorNeutral070: tokens.colorNeutral17,\n  fillColorNeutral080: tokens.colorNeutral15,\n  fillColorNeutral090: tokens.colorNeutral12,\n  fillColorNeutral100Inverted: tokens.colorNeutral7,\n}\n\ninterface SemanticAliasesColors {\n  name: string\n  iconColorDefaultPrimary: string\n  iconColorDefaultSecondary: string\n  iconColorDefaultDim: string\n  iconColorDefaultDisabled: string\n  iconColorDefaultInverted: string\n  textColorDefaultHeadline: string\n  textColorDefaultPrimary: string\n  textColorDefaultSecondary: string\n  textColorDefaultDisabled: string\n  textColorDefaultPlaceholder: string\n  textColorDefaultInverted: string\n}\n\nconst semanticAliasesLight: SemanticAliasesColors = {\n  name: 'light',\n  iconColorDefaultPrimary: neutralsLight.fillColorNeutral010,\n  iconColorDefaultSecondary: neutralsLight.fillColorNeutral020,\n  iconColorDefaultDim: neutralsLight.fillColorNeutral030,\n  iconColorDefaultDisabled: neutralsLight.fillColorNeutral040,\n  iconColorDefaultInverted: neutralsLight.fillColorNeutral100Inverted,\n  textColorDefaultHeadline: neutralsLight.fillColorNeutral000,\n  textColorDefaultPrimary: neutralsLight.fillColorNeutral010,\n  textColorDefaultSecondary: neutralsLight.fillColorNeutral020,\n  textColorDefaultDisabled: neutralsLight.fillColorNeutral040,\n  textColorDefaultPlaceholder: neutralsLight.fillColorNeutral030,\n  textColorDefaultInverted: tokens.colorNeutral100White,\n}\n\nconst semanticAliasesDark: SemanticAliasesColors = {\n  name: 'dark',\n  iconColorDefaultPrimary: neutralsDark.fillColorNeutral010,\n  iconColorDefaultSecondary: neutralsDark.fillColorNeutral020,\n  iconColorDefaultDim: neutralsDark.fillColorNeutral030,\n  iconColorDefaultDisabled: neutralsDark.fillColorNeutral040,\n  iconColorDefaultInverted: neutralsDark.fillColorNeutral100Inverted,\n  textColorDefaultHeadline: neutralsDark.fillColorNeutral000,\n  textColorDefaultPrimary: neutralsDark.fillColorNeutral010,\n  textColorDefaultSecondary: neutralsDark.fillColorNeutral020,\n  textColorDefaultDisabled: neutralsDark.fillColorNeutral040,\n  textColorDefaultPlaceholder: neutralsDark.fillColorNeutral030,\n  textColorDefaultInverted: tokens.colorNeutral7,\n}\n\nexport const tapestryAliasTokensColorMap = {\n  light: { ...neutralsLight, ...semanticAliasesLight },\n  dark: { ...neutralsDark, ...semanticAliasesDark },\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "1.4.1-rc.0",
+  "version": "1.4.1-rc.2",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -38,5 +38,5 @@
     "prettier": "^3.4.2",
     "react-native": "0.74.5"
   },
-  "gitHead": "ec03747d0b2fdf8c637b72c015da37358b0b2d86"
+  "gitHead": "47f16f52c26422fb06f7ee7bdf5a1d9166955d37"
 }

package/src/components/conversations.tsx

@@ -2,10 +2,10 @@ import { ConversationResource, JSONAPICollection } from '@planningcenter/chat-co
 import { useNavigation } from '@react-navigation/native'
 import { QueryErrorResetBoundary, useSuspenseQuery } from '@tanstack/react-query'
 import React, { Suspense, useContext } from 'react'
-import { FlatList, Pressable, StyleSheet, Text, View } from 'react-native'
+import { FlatList, Pressable, StyleSheet } from 'react-native'
 import { ChatContext } from '../contexts/chat_context'
 import { useTheme } from '../hooks'
-import { Image, Spinner } from './display'
+import { Text } from './display'
 import ErrorBoundary from './error_boundary'
 
 type ConversationsResponse = JSONAPICollection<ConversationResource>
@@ -41,24 +41,7 @@ const Loaded = () => {
       contentContainerStyle={styles.container}
       style={styles.scrollView}
       ListEmptyComponent={<Text>No conversations found</Text>}
-      ListHeaderComponent={
-        <View style={styles.column}>
-          <Text style={styles.foo}>Display Components</Text>
-          <View style={[styles.row, styles.spinnerContainer]}>
-            <Spinner size={24} />
-          </View>
-          <View style={styles.row}>
-            <Image source={{ uri: 'https://broken.url' }} style={styles.image} />
-            <Image
-              source={{
-                uri: 'https://picsum.photos/seed/picsum/200',
-              }}
-              style={styles.image}
-            />
-          </View>
-          <Text style={styles.foo}>Conversations</Text>
-        </View>
-      }
+      ListHeaderComponent={<Text style={styles.foo}>Conversations</Text>}
       renderItem={({ item }) => (
         <Pressable onPress={() => navigation.navigate('Settings')}>
           <Text style={styles.listItem}>{item.attributes.title}</Text>
@@ -76,19 +59,5 @@ const useStyles = () => {
     container: { gap: 8, padding: 16 },
     foo: { fontSize: 24, color: colors.testColor },
     listItem: { color: colors.fillColorNeutral020 },
-    row: {
-      gap: 16,
-      flexDirection: 'row',
-      alignItems: 'center',
-      justifyContent: 'center',
-    },
-    column: { gap: 16 },
-    spinnerContainer: {
-      height: 20,
-    },
-    image: {
-      width: 100,
-      height: 100,
-    },
   })
 }

package/src/components/display/image.tsx

@@ -4,7 +4,7 @@ import {
   AnimatableNumericValue,
   DimensionValue,
   Image as ReactNativeImage,
-  ImageProps as RNImageProps,
+  ImageProps as ReactNativeImageProps,
   StyleSheet,
   View,
   ViewStyle,
@@ -12,7 +12,7 @@ import {
 import { useTheme } from '../../hooks'
 import { Spinner } from './spinner'
 
-interface ImageProps extends RNImageProps {
+interface ImageProps extends ReactNativeImageProps {
   /**
    * Should the image show the loading indicator by default.
    */

package/src/components/display/index.ts

@@ -1,2 +1,3 @@
 export { Spinner } from './spinner'
 export { Image } from './image'
+export { Text } from './text'

package/src/components/display/text.tsx

@@ -0,0 +1,60 @@
+import { useTheme } from '../../hooks'
+import React from 'react'
+import {
+  Platform,
+  StyleSheet,
+  Text as ReactNativeText,
+  TextProps as ReactNativeTextProps,
+} from 'react-native'
+
+interface TextProps extends ReactNativeTextProps {
+  variant?: 'plain' | 'secondary' | 'tertiary' | 'footnote'
+}
+
+export function Text({ style, variant = 'plain', children, ...rest }: TextProps) {
+  const styles = useStyles()
+  const variantStyleMap = {
+    plain: styles.plain,
+    secondary: styles.secondary,
+    tertiary: styles.tertiary,
+    footnote: styles.footnote,
+  }
+
+  return (
+    <ReactNativeText style={[styles.global, variantStyleMap[variant], style]} {...rest}>
+      {children}
+    </ReactNativeText>
+  )
+}
+
+const useStyles = () => {
+  const { colors } = useTheme()
+  return StyleSheet.create({
+    global: {
+      fontFamily: Platform.select({
+        ios: 'System',
+        android: 'normal',
+      }),
+    },
+    plain: {
+      color: colors.textColorDefaultPrimary,
+      fontSize: 16,
+      lineHeight: 24,
+    },
+    secondary: {
+      color: colors.textColorDefaultPrimary,
+      fontSize: 15,
+      lineHeight: 22,
+    },
+    tertiary: {
+      color: colors.textColorDefaultPrimary,
+      fontSize: 14,
+      lineHeight: 20,
+    },
+    footnote: {
+      color: colors.textColorDefaultSecondary,
+      fontSize: 13,
+      lineHeight: 16,
+    },
+  })
+}

package/src/index.tsx

@@ -3,6 +3,7 @@ import { ChatContext, ChatProvider } from './contexts/chat_context'
 import { OAuthToken } from './types'
 import { baseUrlMap, uploadUrlMap } from './utils/session'
 import { TemporaryDefaultColorsType } from './utils/theme'
+export * from './screens'
 
 export {
   baseUrlMap,

package/src/screens/display.tsx

@@ -0,0 +1,58 @@
+import React from 'react'
+import { ScrollView, StyleSheet, View } from 'react-native'
+import { useTheme } from '../hooks'
+import { Image, Spinner, Text } from '../components/display'
+
+export function DisplayScreen() {
+  const styles = useStyles()
+
+  return (
+    <ScrollView contentContainerStyle={styles.container} style={styles.scrollView}>
+      <View style={styles.column}>
+        <View style={[styles.row, styles.spinnerContainer]}>
+          <Spinner size={24} />
+        </View>
+        <View style={styles.row}>
+          <Image source={{ uri: 'https://broken.url' }} style={styles.image} />
+          <Image
+            source={{
+              uri: 'https://picsum.photos/seed/picsum/200',
+            }}
+            style={styles.image}
+          />
+        </View>
+        <View style={styles.row}>
+          <Text>Plain text</Text>
+          <Text variant="secondary">Secondary</Text>
+          <Text variant="tertiary">Tertiary</Text>
+          <Text variant="footnote">Footnote</Text>
+        </View>
+      </View>
+    </ScrollView>
+  )
+}
+
+const useStyles = () => {
+  const { colors } = useTheme()
+
+  return StyleSheet.create({
+    scrollView: { flex: 1, backgroundColor: colors.fillColorNeutral090 },
+    container: { gap: 16, padding: 24 },
+    listItem: { color: colors.fillColorNeutral020 },
+    row: {
+      gap: 16,
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'center',
+      flexWrap: 'wrap',
+    },
+    column: { gap: 32 },
+    spinnerContainer: {
+      height: 20,
+    },
+    image: {
+      width: 100,
+      height: 100,
+    },
+  })
+}

package/src/screens/index.ts

@@ -0,0 +1 @@
+export * from './display'

package/src/vendor/tapestry/tapestry_alias_tokens_color_map.ts

@@ -56,6 +56,12 @@ interface SemanticAliasesColors {
   iconColorDefaultDim: string
   iconColorDefaultDisabled: string
   iconColorDefaultInverted: string
+  textColorDefaultHeadline: string
+  textColorDefaultPrimary: string
+  textColorDefaultSecondary: string
+  textColorDefaultDisabled: string
+  textColorDefaultPlaceholder: string
+  textColorDefaultInverted: string
 }
 
 const semanticAliasesLight: SemanticAliasesColors = {
@@ -65,6 +71,12 @@ const semanticAliasesLight: SemanticAliasesColors = {
   iconColorDefaultDim: neutralsLight.fillColorNeutral030,
   iconColorDefaultDisabled: neutralsLight.fillColorNeutral040,
   iconColorDefaultInverted: neutralsLight.fillColorNeutral100Inverted,
+  textColorDefaultHeadline: neutralsLight.fillColorNeutral000,
+  textColorDefaultPrimary: neutralsLight.fillColorNeutral010,
+  textColorDefaultSecondary: neutralsLight.fillColorNeutral020,
+  textColorDefaultDisabled: neutralsLight.fillColorNeutral040,
+  textColorDefaultPlaceholder: neutralsLight.fillColorNeutral030,
+  textColorDefaultInverted: tokens.colorNeutral100White,
 }
 
 const semanticAliasesDark: SemanticAliasesColors = {
@@ -74,6 +86,12 @@ const semanticAliasesDark: SemanticAliasesColors = {
   iconColorDefaultDim: neutralsDark.fillColorNeutral030,
   iconColorDefaultDisabled: neutralsDark.fillColorNeutral040,
   iconColorDefaultInverted: neutralsDark.fillColorNeutral100Inverted,
+  textColorDefaultHeadline: neutralsDark.fillColorNeutral000,
+  textColorDefaultPrimary: neutralsDark.fillColorNeutral010,
+  textColorDefaultSecondary: neutralsDark.fillColorNeutral020,
+  textColorDefaultDisabled: neutralsDark.fillColorNeutral040,
+  textColorDefaultPlaceholder: neutralsDark.fillColorNeutral030,
+  textColorDefaultInverted: tokens.colorNeutral7,
 }
 
 export const tapestryAliasTokensColorMap = {