@planningcenter/chat-react-native 2.1.1 → 2.2.0-rc.1

package/build/components/conversation/message_form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_form.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,EAA+B,SAAS,EAAE,MAAM,cAAc,CAAA;AAKrE,OAAO,EAA8B,oBAAoB,EAAmB,MAAM,aAAa,CAAA;AAG/F,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA;AAED,UAAU,qBAAsB,SAAQ,SAAS;IAC/C,YAAY,EAAE,oBAAoB,CAAA;CACnC;AASD,iBAAS,eAAe,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,qBAAqB,qBA+CzE;AAED,iBAAS,gBAAgB,sBAcxB;AAED,iBAAS,oBAAoB,sBAe5B;AAED,iBAAS,2BAA2B,sBASnC;AAED,iBAAS,mBAAmB,sBAI3B"}
+{"version":3,"file":"message_form.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAA+B,SAAS,EAAE,MAAM,cAAc,CAAA;AAKrE,OAAO,EAA8B,oBAAoB,EAAmB,MAAM,aAAa,CAAA;AAG/F,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA;AAED,UAAU,qBAAsB,SAAQ,SAAS;IAC/C,YAAY,EAAE,oBAAoB,CAAA;CACnC;AASD,iBAAS,eAAe,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,qBAAqB,qBA+CzE;AAED,iBAAS,gBAAgB,sBAcxB;AAED,iBAAS,oBAAoB,sBAe5B;AAED,iBAAS,2BAA2B,sBASnC;AAED,iBAAS,mBAAmB,sBAI3B"}

package/build/components/conversation/message_form.js

@@ -1,10 +1,10 @@
 import { useTheme as useNavigationTheme } from '@react-navigation/native';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import React, { useContext } from 'react';
+import React from 'react';
 import { StyleSheet, TextInput, View } from 'react-native';
 import { IconButton } from '../../components';
-import { ChatContext } from '../../contexts';
 import { useTheme } from '../../hooks';
+import { useApiClient } from '../../hooks/use_api_client';
 import { getMessagesQueryKey, getMessagesRequestArgs } from '../../hooks/use_conversation_messages';
 import { updateRecordInPagesData } from '../../utils';
 export const MessageForm = {
@@ -23,13 +23,13 @@ const MessageFormContext = React.createContext({
 function MessageFormRoot({ conversation, children }) {
     const styles = useMessageFormStyles();
     const [text, setText] = React.useState('');
-    const { client } = useContext(ChatContext);
+    const apiClient = useApiClient();
     const queryClient = useQueryClient();
     const { mutate, isPending } = useMutation({
         mutationFn: async () => {
             const requestParams = getMessagesRequestArgs({ conversation_id: conversation.id });
             const fieldsWithValueJoined = Object.fromEntries(Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')]));
-            return client.post({
+            return apiClient.chat.post({
                 url: `/me/conversations/${conversation.id}/messages`,
                 data: {
                     ...requestParams.data,

package/build/components/conversation/message_form.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_form.js","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTheme as useNavigationTheme } from '@react-navigation/native'\nimport { InfiniteData, useMutation, useQueryClient } from '@tanstack/react-query'\nimport React, { useContext } from 'react'\nimport { StyleSheet, TextInput, View, ViewProps } from 'react-native'\nimport { IconButton } from '../../components'\nimport { ChatContext } from '../../contexts'\nimport { useTheme } from '../../hooks'\nimport { getMessagesQueryKey, getMessagesRequestArgs } from '../../hooks/use_conversation_messages'\nimport { ApiCollection, ApiResource, ConversationResource, MessageResource } from '../../types'\nimport { updateRecordInPagesData } from '../../utils'\n\nexport const MessageForm = {\n  Root: MessageFormRoot,\n  TextInput: MessageFormInput,\n  SubmitButton: MessageFormSubmitBtn,\n  AttachmentPicker: MessageFormAttachmentPicker,\n  Commands: MessageFormCommands,\n}\n\ninterface MessagesFormRootProps extends ViewProps {\n  conversation: ConversationResource\n}\n\nconst MessageFormContext = React.createContext({\n  text: '',\n  setText: (_text: string) => {},\n  onSubmit: () => {},\n  disabled: false,\n})\n\nfunction MessageFormRoot({ conversation, children }: MessagesFormRootProps) {\n  const styles = useMessageFormStyles()\n  const [text, setText] = React.useState('')\n  const { client } = useContext(ChatContext)\n  const queryClient = useQueryClient()\n\n  const { mutate, isPending } = useMutation({\n    mutationFn: async () => {\n      const requestParams = getMessagesRequestArgs({ conversation_id: conversation.id })\n      const fieldsWithValueJoined = Object.fromEntries(\n        Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')])\n      )\n\n      return client.post({\n        url: `/me/conversations/${conversation.id}/messages`,\n        data: {\n          ...requestParams.data,\n          data: {\n            type: 'Message',\n            attributes: { text },\n          },\n          fields: fieldsWithValueJoined,\n        },\n      })\n    },\n    onSuccess: (result: ApiResource<MessageResource>) => {\n      const updatedMessage = result.data\n      type QueryData = InfiniteData<ApiCollection<MessageResource>>\n      const queryKey = getMessagesQueryKey({ conversation_id: conversation.id })\n\n      setText('')\n      queryClient.setQueryData<QueryData>(queryKey, data =>\n        updateRecordInPagesData({\n          data,\n          record: updatedMessage,\n        })\n      )\n    },\n  })\n\n  return (\n    <MessageFormContext.Provider\n      value={{ text, setText, onSubmit: () => mutate(), disabled: isPending }}\n    >\n      <View style={styles.textInputContainer}>{children}</View>\n    </MessageFormContext.Provider>\n  )\n}\n\nfunction MessageFormInput() {\n  const styles = useMessageFormStyles()\n  const { text, setText, onSubmit } = React.useContext(MessageFormContext)\n\n  return (\n    <TextInput\n      aria-disabled={true}\n      placeholder=\"Send a message\"\n      onChangeText={setText}\n      value={text}\n      style={styles.textInput}\n      onSubmitEditing={onSubmit}\n    />\n  )\n}\n\nfunction MessageFormSubmitBtn() {\n  const styles = useMessageFormStyles()\n  const { onSubmit, disabled } = React.useContext(MessageFormContext)\n\n  return (\n    <IconButton\n      disabled={disabled}\n      accessibilityLabel=\"Send message\"\n      size=\"md\"\n      appearance=\"neutral\"\n      style={styles.textInputSend}\n      name={'general.upArrow'}\n      onPress={onSubmit}\n    />\n  )\n}\n\nfunction MessageFormAttachmentPicker() {\n  return (\n    <IconButton\n      accessibilityLabel=\"Shazam\"\n      size=\"md\"\n      appearance=\"neutral\"\n      name={'general.paperclip'}\n    />\n  )\n}\n\nfunction MessageFormCommands() {\n  return (\n    <IconButton accessibilityLabel=\"Shazam\" size=\"md\" appearance=\"neutral\" name={'general.bolt'} />\n  )\n}\n\nconst useMessageFormStyles = () => {\n  const theme = useTheme()\n  const navigationTheme = useNavigationTheme()\n\n  return StyleSheet.create({\n    textInputContainer: {\n      borderColor: theme.colors.fillColorNeutral050Base,\n      borderTopWidth: 1,\n      padding: 12,\n      backgroundColor: navigationTheme.colors.card,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n    },\n    textInput: {\n      borderRadius: 24,\n      borderWidth: 1,\n      padding: 12,\n      paddingHorizontal: 20,\n      borderColor: theme.colors.fillColorNeutral050Base,\n      flex: 1,\n    },\n    textInputSend: {\n      borderRadius: 24,\n      height: 36,\n      width: 36,\n      backgroundColor: theme.colors.fillColorNeutral040,\n    },\n  })\n}\n"]}
+{"version":3,"file":"message_form.js","sourceRoot":"","sources":["../../../src/components/conversation/message_form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTheme as useNavigationTheme } from '@react-navigation/native'\nimport { InfiniteData, useMutation, useQueryClient } from '@tanstack/react-query'\nimport React from 'react'\nimport { StyleSheet, TextInput, View, ViewProps } from 'react-native'\nimport { IconButton } from '../../components'\nimport { useTheme } from '../../hooks'\nimport { useApiClient } from '../../hooks/use_api_client'\nimport { getMessagesQueryKey, getMessagesRequestArgs } from '../../hooks/use_conversation_messages'\nimport { ApiCollection, ApiResource, ConversationResource, MessageResource } from '../../types'\nimport { updateRecordInPagesData } from '../../utils'\n\nexport const MessageForm = {\n  Root: MessageFormRoot,\n  TextInput: MessageFormInput,\n  SubmitButton: MessageFormSubmitBtn,\n  AttachmentPicker: MessageFormAttachmentPicker,\n  Commands: MessageFormCommands,\n}\n\ninterface MessagesFormRootProps extends ViewProps {\n  conversation: ConversationResource\n}\n\nconst MessageFormContext = React.createContext({\n  text: '',\n  setText: (_text: string) => {},\n  onSubmit: () => {},\n  disabled: false,\n})\n\nfunction MessageFormRoot({ conversation, children }: MessagesFormRootProps) {\n  const styles = useMessageFormStyles()\n  const [text, setText] = React.useState('')\n  const apiClient = useApiClient()\n  const queryClient = useQueryClient()\n\n  const { mutate, isPending } = useMutation({\n    mutationFn: async () => {\n      const requestParams = getMessagesRequestArgs({ conversation_id: conversation.id })\n      const fieldsWithValueJoined = Object.fromEntries(\n        Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')])\n      )\n\n      return apiClient.chat.post({\n        url: `/me/conversations/${conversation.id}/messages`,\n        data: {\n          ...requestParams.data,\n          data: {\n            type: 'Message',\n            attributes: { text },\n          },\n          fields: fieldsWithValueJoined,\n        },\n      })\n    },\n    onSuccess: (result: ApiResource<MessageResource>) => {\n      const updatedMessage = result.data\n      type QueryData = InfiniteData<ApiCollection<MessageResource>>\n      const queryKey = getMessagesQueryKey({ conversation_id: conversation.id })\n\n      setText('')\n      queryClient.setQueryData<QueryData>(queryKey, data =>\n        updateRecordInPagesData({\n          data,\n          record: updatedMessage,\n        })\n      )\n    },\n  })\n\n  return (\n    <MessageFormContext.Provider\n      value={{ text, setText, onSubmit: () => mutate(), disabled: isPending }}\n    >\n      <View style={styles.textInputContainer}>{children}</View>\n    </MessageFormContext.Provider>\n  )\n}\n\nfunction MessageFormInput() {\n  const styles = useMessageFormStyles()\n  const { text, setText, onSubmit } = React.useContext(MessageFormContext)\n\n  return (\n    <TextInput\n      aria-disabled={true}\n      placeholder=\"Send a message\"\n      onChangeText={setText}\n      value={text}\n      style={styles.textInput}\n      onSubmitEditing={onSubmit}\n    />\n  )\n}\n\nfunction MessageFormSubmitBtn() {\n  const styles = useMessageFormStyles()\n  const { onSubmit, disabled } = React.useContext(MessageFormContext)\n\n  return (\n    <IconButton\n      disabled={disabled}\n      accessibilityLabel=\"Send message\"\n      size=\"md\"\n      appearance=\"neutral\"\n      style={styles.textInputSend}\n      name={'general.upArrow'}\n      onPress={onSubmit}\n    />\n  )\n}\n\nfunction MessageFormAttachmentPicker() {\n  return (\n    <IconButton\n      accessibilityLabel=\"Shazam\"\n      size=\"md\"\n      appearance=\"neutral\"\n      name={'general.paperclip'}\n    />\n  )\n}\n\nfunction MessageFormCommands() {\n  return (\n    <IconButton accessibilityLabel=\"Shazam\" size=\"md\" appearance=\"neutral\" name={'general.bolt'} />\n  )\n}\n\nconst useMessageFormStyles = () => {\n  const theme = useTheme()\n  const navigationTheme = useNavigationTheme()\n\n  return StyleSheet.create({\n    textInputContainer: {\n      borderColor: theme.colors.fillColorNeutral050Base,\n      borderTopWidth: 1,\n      padding: 12,\n      backgroundColor: navigationTheme.colors.card,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 12,\n    },\n    textInput: {\n      borderRadius: 24,\n      borderWidth: 1,\n      padding: 12,\n      paddingHorizontal: 20,\n      borderColor: theme.colors.fillColorNeutral050Base,\n      flex: 1,\n    },\n    textInputSend: {\n      borderRadius: 24,\n      height: 36,\n      width: 36,\n      backgroundColor: theme.colors.fillColorNeutral040,\n    },\n  })\n}\n"]}

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

@@ -1,13 +1,6 @@
 import React from 'react';
 import type { ViewStyle } from 'react-native';
-declare const APPEARANCES: {
-    readonly error: "error";
-    readonly info: "info";
-    readonly neutral: "neutral";
-    readonly success: "success";
-    readonly warning: "warning";
-};
-type AppearanceUnion = (typeof APPEARANCES)[keyof typeof APPEARANCES];
+import { type StatusAppearanceUnion } from './utils/status_colors';
 declare const VARIANTS: {
     readonly default: "default";
     readonly meta: "meta";
@@ -27,7 +20,7 @@ interface BadgeProps {
     /**
      * Changes the status color for the badge and icon.
      */
-    appearance?: AppearanceUnion;
+    appearance?: StatusAppearanceUnion;
     /**
      * Changes form of the logo to support a meta label and badge
      */

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

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,SAAS,EAAa,MAAM,cAAc,CAAA;AAYxD,QAAA,MAAM,WAAW;;;;;;CAMP,CAAA;AAEV,KAAK,eAAe,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,OAAO,WAAW,CAAC,CAAA;AAWrE,QAAA,MAAM,QAAQ;;;;CAIJ,CAAA;AAEV,KAAK,YAAY,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAA;AAiB5D,KAAK,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAA;AAWpE,UAAU,UAAU;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;CAC/B;AAED,wBAAgB,KAAK,CAAC,EACpB,UAAsB,EACtB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,KAAK,EACL,eAAe,EACf,OAAmB,EACnB,qBAAqB,GACtB,EAAE,UAAU,qBA4BZ"}
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,SAAS,EAAa,MAAM,cAAc,CAAA;AAOxD,OAAO,EAA+B,KAAK,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAM/F,QAAA,MAAM,QAAQ;;;;CAIJ,CAAA;AAEV,KAAK,YAAY,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAA;AAiB5D,KAAK,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAA;AAWpE,UAAU,UAAU;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;CAC/B;AAED,wBAAgB,KAAK,CAAC,EACpB,UAAsB,EACtB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,KAAK,EACL,eAAe,EACf,OAAmB,EACnB,qBAAqB,GACtB,EAAE,UAAU,qBA4BZ"}

package/build/components/display/badge.js

@@ -6,16 +6,10 @@ import { Icon } from './icon';
 import { Text } from './text';
 import { platformFontWeightMedium, space } from '../../utils';
 import { tokens } from '../../vendor/tapestry/tokens';
+import { useStatusColorAppearanceMap } from './utils/status_colors';
 // =================================
 // ====== Constants ================
 // =================================
-const APPEARANCES = {
-    error: 'error',
-    info: 'info',
-    neutral: 'neutral',
-    success: 'success',
-    warning: 'warning',
-};
 const VARIANTS = {
     default: 'default',
     meta: 'meta',
@@ -53,33 +47,7 @@ export function Badge({ appearance = 'neutral', metaLabel, style, iconName, labe
 const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'default', }) => {
     const { colors } = useTheme();
     const fontScale = useFontScale({ maxFontSizeMultiplier });
-    const apparenceColorMap = {
-        error: {
-            background: colors.statusErrorBackground,
-            text: colors.statusErrorText,
-            icon: colors.statusErrorIcon,
-        },
-        info: {
-            background: colors.statusInfoBackground,
-            text: colors.statusInfoText,
-            icon: colors.statusInfoIcon,
-        },
-        neutral: {
-            background: colors.statusNeutralBackground,
-            text: colors.statusNeutralText,
-            icon: colors.statusNeutralIcon,
-        },
-        success: {
-            background: colors.statusSuccessBackground,
-            text: colors.statusSuccessText,
-            icon: colors.statusSuccessIcon,
-        },
-        warning: {
-            background: colors.statusWarningBackground,
-            text: colors.statusWarningText,
-            icon: colors.statusWarningIcon,
-        },
-    };
+    const statusColorMap = useStatusColorAppearanceMap();
     const badgePaddingHorizontal = space(1) * fontScale;
     const badgePaddingVertical = space(0.5) * fontScale;
     const badgeGap = space(0.5) * fontScale;
@@ -87,24 +55,24 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
     const variantStylesMap = {
         default: {
             gap: badgeGap,
-            backgroundColor: apparenceColorMap[appearance].background,
+            backgroundColor: statusColorMap[appearance].background,
             metaLabelPaddingLeft: badgePaddingHorizontal,
             paddingHorizontal: badgePaddingHorizontal,
             paddingVertical: badgePaddingVertical,
             borderWidth: tokens.borderSizeDefault * fontScale,
             borderRadius: tokens.borderRadiusMd,
-            textColor: apparenceColorMap[appearance].text,
+            textColor: statusColorMap[appearance].text,
             fontWeight: 'normal',
         },
         meta: {
             gap: badgeGap,
-            backgroundColor: apparenceColorMap[appearance].background,
+            backgroundColor: statusColorMap[appearance].background,
             metaLabelPaddingLeft: badgePaddingHorizontal,
             paddingHorizontal: badgePaddingHorizontal,
             paddingVertical: badgePaddingVertical,
             borderWidth: tokens.borderSizeDefault * fontScale,
             borderRadius: tokens.borderRadiusMd,
-            textColor: apparenceColorMap[appearance].text,
+            textColor: statusColorMap[appearance].text,
             fontWeight: platformFontWeightMedium,
         },
         metaSubtle: {
@@ -126,7 +94,7 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
             justifyContent: 'center',
             borderRadius: variantStylesMap[variant].borderRadius,
             borderWidth: variantStylesMap[variant].borderWidth,
-            borderColor: apparenceColorMap[appearance].background,
+            borderColor: statusColorMap[appearance].background,
         },
         badge: {
             flexDirection: 'row',
@@ -138,7 +106,7 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
             borderRadius: variantStylesMap[variant].borderRadius - 2,
         },
         icon: {
-            color: apparenceColorMap[appearance].icon,
+            color: statusColorMap[appearance].icon,
             fontSize: badgeFontSize,
         },
         logo: {

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

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport type { ViewStyle, TextStyle } from 'react-native'\nimport Svg, { Path, Defs, LinearGradient, Stop } from 'react-native-svg'\nimport { useFontScale, useTheme } from '../../hooks'\nimport { Icon } from './icon'\nimport { Text } from './text'\nimport { platformFontWeightMedium, space } from '../../utils'\nimport { tokens } from '../../vendor/tapestry/tokens'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst APPEARANCES = {\n  error: 'error',\n  info: 'info',\n  neutral: 'neutral',\n  success: 'success',\n  warning: 'warning',\n} as const\n\ntype AppearanceUnion = (typeof APPEARANCES)[keyof typeof APPEARANCES]\n\ntype AppearanceColors = Record<\n  AppearanceUnion,\n  {\n    background: string\n    text: string\n    icon: string\n  }\n>\n\nconst VARIANTS = {\n  default: 'default',\n  meta: 'meta',\n  metaSubtle: 'metaSubtle',\n} as const\n\ntype VariantUnion = (typeof VARIANTS)[keyof typeof VARIANTS]\n\ntype VariantStyles = Record<\n  VariantUnion,\n  {\n    backgroundColor: string\n    paddingHorizontal: number\n    paddingVertical: number\n    borderWidth: number\n    borderRadius: number\n    textColor: string\n    gap: number\n    metaLabelPaddingLeft: number\n    fontWeight: TextStyle['fontWeight']\n  }\n>\n\ntype ProductLogoName = 'Groups' | 'Services' | 'groups' | 'services'\n\nconst PRODUCT_LOGO_COMPONENT_MAP = {\n  groups: GroupsLogo,\n  services: ServicesIcon,\n} as const\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface BadgeProps {\n  /**\n   * Renders the main text.\n   */\n  label: string\n  /**\n   * Renders secondary meta text to the right of the label.\n   */\n  metaLabel?: string\n  /**\n   * Changes the status color for the badge and icon.\n   */\n  appearance?: AppearanceUnion\n  /**\n   * Changes form of the logo to support a meta label and badge\n   */\n  variant?: VariantUnion\n  /**\n   * Adds a product logo to the left of the text.\n   */\n  productLogoName?: ProductLogoName\n  /**\n   * Shows an icon of the user choice to the left of the text.\n   */\n  iconName?: string\n  /**\n   * Styles badge wrapper.\n   */\n  style?: ViewStyle\n  /**\n   * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n   */\n  maxFontSizeMultiplier?: number\n}\n\nexport function Badge({\n  appearance = 'neutral',\n  metaLabel,\n  style,\n  iconName,\n  label,\n  productLogoName,\n  variant = 'default',\n  maxFontSizeMultiplier,\n}: BadgeProps) {\n  const styles = useStyles({ appearance, maxFontSizeMultiplier, variant })\n  const { showBadgeLogo } = useTheme()\n\n  const isMetaSubtle = variant === 'metaSubtle'\n  const isMeta = variant === 'meta'\n  const hasMetaLabel = Boolean(metaLabel)\n\n  const showLogo = showBadgeLogo && productLogoName && isMeta\n  const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName?.toLowerCase()]\n  const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label\n\n  return (\n    <View style={[styles.badgeWrapper, style]}>\n      <View style={styles.badge}>\n        {showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}\n        {iconName && <Icon name={iconName} style={styles.icon} />}\n        <Text variant=\"footnote\" style={styles.label}>\n          {badgeLabel}\n        </Text>\n      </View>\n      {hasMetaLabel && (\n        <Text variant=\"footnote\" style={styles.metaLabel} numberOfLines={1}>\n          {metaLabel}\n        </Text>\n      )}\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n  appearance = 'neutral',\n  maxFontSizeMultiplier,\n  variant = 'default',\n}: Partial<BadgeProps>) => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier })\n\n  const apparenceColorMap: AppearanceColors = {\n    error: {\n      background: colors.statusErrorBackground,\n      text: colors.statusErrorText,\n      icon: colors.statusErrorIcon,\n    },\n    info: {\n      background: colors.statusInfoBackground,\n      text: colors.statusInfoText,\n      icon: colors.statusInfoIcon,\n    },\n    neutral: {\n      background: colors.statusNeutralBackground,\n      text: colors.statusNeutralText,\n      icon: colors.statusNeutralIcon,\n    },\n    success: {\n      background: colors.statusSuccessBackground,\n      text: colors.statusSuccessText,\n      icon: colors.statusSuccessIcon,\n    },\n    warning: {\n      background: colors.statusWarningBackground,\n      text: colors.statusWarningText,\n      icon: colors.statusWarningIcon,\n    },\n  }\n\n  const badgePaddingHorizontal = space(1) * fontScale\n  const badgePaddingVertical = space(0.5) * fontScale\n  const badgeGap = space(0.5) * fontScale\n  const badgeFontSize = 12\n\n  const variantStylesMap: VariantStyles = {\n    default: {\n      gap: badgeGap,\n      backgroundColor: apparenceColorMap[appearance].background,\n      metaLabelPaddingLeft: badgePaddingHorizontal,\n      paddingHorizontal: badgePaddingHorizontal,\n      paddingVertical: badgePaddingVertical,\n      borderWidth: tokens.borderSizeDefault * fontScale,\n      borderRadius: tokens.borderRadiusMd,\n      textColor: apparenceColorMap[appearance].text,\n      fontWeight: 'normal',\n    },\n    meta: {\n      gap: badgeGap,\n      backgroundColor: apparenceColorMap[appearance].background,\n      metaLabelPaddingLeft: badgePaddingHorizontal,\n      paddingHorizontal: badgePaddingHorizontal,\n      paddingVertical: badgePaddingVertical,\n      borderWidth: tokens.borderSizeDefault * fontScale,\n      borderRadius: tokens.borderRadiusMd,\n      textColor: apparenceColorMap[appearance].text,\n      fontWeight: platformFontWeightMedium,\n    },\n    metaSubtle: {\n      gap: badgeGap,\n      backgroundColor: 'transparent',\n      metaLabelPaddingLeft: badgeGap,\n      paddingHorizontal: 0,\n      paddingVertical: 0,\n      borderWidth: 0,\n      borderRadius: 0,\n      textColor: colors.textColorDefaultSecondary,\n      fontWeight: platformFontWeightMedium,\n    },\n  }\n\n  return StyleSheet.create({\n    badgeWrapper: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'center',\n      borderRadius: variantStylesMap[variant].borderRadius,\n      borderWidth: variantStylesMap[variant].borderWidth,\n      borderColor: apparenceColorMap[appearance].background,\n    },\n    badge: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: variantStylesMap[variant].gap,\n      paddingVertical: variantStylesMap[variant].paddingVertical,\n      paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n      backgroundColor: variantStylesMap[variant].backgroundColor,\n      borderRadius: variantStylesMap[variant].borderRadius - 2,\n    },\n    icon: {\n      color: apparenceColorMap[appearance].icon,\n      fontSize: badgeFontSize,\n    },\n    logo: {\n      fontSize: badgeFontSize * fontScale,\n    },\n    label: {\n      color: variantStylesMap[variant].textColor,\n      fontWeight: variantStylesMap[variant].fontWeight,\n      fontSize: badgeFontSize,\n    },\n    metaLabel: {\n      paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n      fontSize: badgeFontSize,\n      flexShrink: 1,\n      paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,\n    },\n  })\n}\n\n// =================================\n// ====== Product Logos ============\n// =================================\n\ninterface ProductLogoProps {\n  logoSize: number\n}\n\nfunction GroupsLogo({ logoSize }: ProductLogoProps) {\n  return (\n    <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n      <Path\n        d=\"M9.06 6.14H6.94c-.152.36-.438.646-.797.798v2.12c.359.152.645.438.797.797h2.117c.152-.359.437-.645.796-.797V6.94a1.502 1.502 0 01-.793-.8zM8 0C1.6 0 0 1.595 0 8s1.6 8 8 8 8-1.595 8-8-1.595-8-8-8zm3.939 10.44a1.5 1.5 0 01-2.882.585H6.94a1.5 1.5 0 11-1.963-1.963v-2.12A1.501 1.501 0 116.94 4.98h2.12a1.5 1.5 0 111.963 1.968v2.11a1.501 1.501 0 01.916 1.383z\"\n        fill=\"url(#paint0_linear_2632_26363)\"\n      />\n      <Defs>\n        <LinearGradient\n          id=\"paint0_linear_2632_26363\"\n          x1={-5.6338}\n          y1={5.6338}\n          x2={5.6338}\n          y2={16.9014}\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <Stop stopColor=\"#FF962D\" />\n          <Stop offset={1} stopColor=\"#FC7638\" />\n        </LinearGradient>\n      </Defs>\n    </Svg>\n  )\n}\n\nfunction ServicesIcon({ logoSize }: ProductLogoProps) {\n  return (\n    <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n      <Path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M.116 8c0-6.4 1.6-8 8-8s8 1.6 8 8-1.6 8-8 8-8-1.6-8-8zm4.123 3.464a.848.848 0 10.943-1.41.848.848 0 00-.943 1.41zm.001-2.76a.848.848 0 10.948-1.408.848.848 0 00-.948 1.407zm0-2.759a.849.849 0 10.948-1.408.849.849 0 00-.948 1.408zm8.1 5.34a.388.388 0 00.03-.149v-.755a.39.39 0 00-.39-.39H6.87a.39.39 0 00-.39.39v.755a.39.39 0 00.39.39h5.11a.39.39 0 00.36-.24zm0-2.758a.388.388 0 00.03-.149v-.757a.387.387 0 00-.39-.388H6.87a.388.388 0 00-.39.388v.757a.388.388 0 00.39.388h5.11a.388.388 0 00.36-.24zm0-2.76a.388.388 0 00.03-.148v-.754a.39.39 0 00-.39-.389H6.87a.39.39 0 00-.39.387v.756a.39.39 0 00.39.39h5.11a.389.389 0 00.36-.241z\"\n        fill=\"url(#paint0_linear_2632_56586)\"\n      />\n      <Defs>\n        <LinearGradient\n          id=\"paint0_linear_2632_56586\"\n          x1={-5.51759}\n          y1={5.6338}\n          x2={5.75001}\n          y2={16.9014}\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <Stop stopColor=\"#6BB23D\" />\n          <Stop offset={1} stopColor=\"#659630\" />\n        </LinearGradient>\n      </Defs>\n    </Svg>\n  )\n}\n"]}
+{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport type { ViewStyle, TextStyle } from 'react-native'\nimport Svg, { Path, Defs, LinearGradient, Stop } from 'react-native-svg'\nimport { useFontScale, useTheme } from '../../hooks'\nimport { Icon } from './icon'\nimport { Text } from './text'\nimport { platformFontWeightMedium, space } from '../../utils'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { useStatusColorAppearanceMap, type StatusAppearanceUnion } from './utils/status_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst VARIANTS = {\n  default: 'default',\n  meta: 'meta',\n  metaSubtle: 'metaSubtle',\n} as const\n\ntype VariantUnion = (typeof VARIANTS)[keyof typeof VARIANTS]\n\ntype VariantStyles = Record<\n  VariantUnion,\n  {\n    backgroundColor: string\n    paddingHorizontal: number\n    paddingVertical: number\n    borderWidth: number\n    borderRadius: number\n    textColor: string\n    gap: number\n    metaLabelPaddingLeft: number\n    fontWeight: TextStyle['fontWeight']\n  }\n>\n\ntype ProductLogoName = 'Groups' | 'Services' | 'groups' | 'services'\n\nconst PRODUCT_LOGO_COMPONENT_MAP = {\n  groups: GroupsLogo,\n  services: ServicesIcon,\n} as const\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface BadgeProps {\n  /**\n   * Renders the main text.\n   */\n  label: string\n  /**\n   * Renders secondary meta text to the right of the label.\n   */\n  metaLabel?: string\n  /**\n   * Changes the status color for the badge and icon.\n   */\n  appearance?: StatusAppearanceUnion\n  /**\n   * Changes form of the logo to support a meta label and badge\n   */\n  variant?: VariantUnion\n  /**\n   * Adds a product logo to the left of the text.\n   */\n  productLogoName?: ProductLogoName\n  /**\n   * Shows an icon of the user choice to the left of the text.\n   */\n  iconName?: string\n  /**\n   * Styles badge wrapper.\n   */\n  style?: ViewStyle\n  /**\n   * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n   */\n  maxFontSizeMultiplier?: number\n}\n\nexport function Badge({\n  appearance = 'neutral',\n  metaLabel,\n  style,\n  iconName,\n  label,\n  productLogoName,\n  variant = 'default',\n  maxFontSizeMultiplier,\n}: BadgeProps) {\n  const styles = useStyles({ appearance, maxFontSizeMultiplier, variant })\n  const { showBadgeLogo } = useTheme()\n\n  const isMetaSubtle = variant === 'metaSubtle'\n  const isMeta = variant === 'meta'\n  const hasMetaLabel = Boolean(metaLabel)\n\n  const showLogo = showBadgeLogo && productLogoName && isMeta\n  const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName?.toLowerCase()]\n  const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label\n\n  return (\n    <View style={[styles.badgeWrapper, style]}>\n      <View style={styles.badge}>\n        {showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}\n        {iconName && <Icon name={iconName} style={styles.icon} />}\n        <Text variant=\"footnote\" style={styles.label}>\n          {badgeLabel}\n        </Text>\n      </View>\n      {hasMetaLabel && (\n        <Text variant=\"footnote\" style={styles.metaLabel} numberOfLines={1}>\n          {metaLabel}\n        </Text>\n      )}\n    </View>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n  appearance = 'neutral',\n  maxFontSizeMultiplier,\n  variant = 'default',\n}: Partial<BadgeProps>) => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier })\n\n  const statusColorMap = useStatusColorAppearanceMap()\n\n  const badgePaddingHorizontal = space(1) * fontScale\n  const badgePaddingVertical = space(0.5) * fontScale\n  const badgeGap = space(0.5) * fontScale\n  const badgeFontSize = 12\n\n  const variantStylesMap: VariantStyles = {\n    default: {\n      gap: badgeGap,\n      backgroundColor: statusColorMap[appearance].background,\n      metaLabelPaddingLeft: badgePaddingHorizontal,\n      paddingHorizontal: badgePaddingHorizontal,\n      paddingVertical: badgePaddingVertical,\n      borderWidth: tokens.borderSizeDefault * fontScale,\n      borderRadius: tokens.borderRadiusMd,\n      textColor: statusColorMap[appearance].text,\n      fontWeight: 'normal',\n    },\n    meta: {\n      gap: badgeGap,\n      backgroundColor: statusColorMap[appearance].background,\n      metaLabelPaddingLeft: badgePaddingHorizontal,\n      paddingHorizontal: badgePaddingHorizontal,\n      paddingVertical: badgePaddingVertical,\n      borderWidth: tokens.borderSizeDefault * fontScale,\n      borderRadius: tokens.borderRadiusMd,\n      textColor: statusColorMap[appearance].text,\n      fontWeight: platformFontWeightMedium,\n    },\n    metaSubtle: {\n      gap: badgeGap,\n      backgroundColor: 'transparent',\n      metaLabelPaddingLeft: badgeGap,\n      paddingHorizontal: 0,\n      paddingVertical: 0,\n      borderWidth: 0,\n      borderRadius: 0,\n      textColor: colors.textColorDefaultSecondary,\n      fontWeight: platformFontWeightMedium,\n    },\n  }\n\n  return StyleSheet.create({\n    badgeWrapper: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'center',\n      borderRadius: variantStylesMap[variant].borderRadius,\n      borderWidth: variantStylesMap[variant].borderWidth,\n      borderColor: statusColorMap[appearance].background,\n    },\n    badge: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: variantStylesMap[variant].gap,\n      paddingVertical: variantStylesMap[variant].paddingVertical,\n      paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n      backgroundColor: variantStylesMap[variant].backgroundColor,\n      borderRadius: variantStylesMap[variant].borderRadius - 2,\n    },\n    icon: {\n      color: statusColorMap[appearance].icon,\n      fontSize: badgeFontSize,\n    },\n    logo: {\n      fontSize: badgeFontSize * fontScale,\n    },\n    label: {\n      color: variantStylesMap[variant].textColor,\n      fontWeight: variantStylesMap[variant].fontWeight,\n      fontSize: badgeFontSize,\n    },\n    metaLabel: {\n      paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n      fontSize: badgeFontSize,\n      flexShrink: 1,\n      paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,\n    },\n  })\n}\n\n// =================================\n// ====== Product Logos ============\n// =================================\n\ninterface ProductLogoProps {\n  logoSize: number\n}\n\nfunction GroupsLogo({ logoSize }: ProductLogoProps) {\n  return (\n    <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n      <Path\n        d=\"M9.06 6.14H6.94c-.152.36-.438.646-.797.798v2.12c.359.152.645.438.797.797h2.117c.152-.359.437-.645.796-.797V6.94a1.502 1.502 0 01-.793-.8zM8 0C1.6 0 0 1.595 0 8s1.6 8 8 8 8-1.595 8-8-1.595-8-8-8zm3.939 10.44a1.5 1.5 0 01-2.882.585H6.94a1.5 1.5 0 11-1.963-1.963v-2.12A1.501 1.501 0 116.94 4.98h2.12a1.5 1.5 0 111.963 1.968v2.11a1.501 1.501 0 01.916 1.383z\"\n        fill=\"url(#paint0_linear_2632_26363)\"\n      />\n      <Defs>\n        <LinearGradient\n          id=\"paint0_linear_2632_26363\"\n          x1={-5.6338}\n          y1={5.6338}\n          x2={5.6338}\n          y2={16.9014}\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <Stop stopColor=\"#FF962D\" />\n          <Stop offset={1} stopColor=\"#FC7638\" />\n        </LinearGradient>\n      </Defs>\n    </Svg>\n  )\n}\n\nfunction ServicesIcon({ logoSize }: ProductLogoProps) {\n  return (\n    <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n      <Path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M.116 8c0-6.4 1.6-8 8-8s8 1.6 8 8-1.6 8-8 8-8-1.6-8-8zm4.123 3.464a.848.848 0 10.943-1.41.848.848 0 00-.943 1.41zm.001-2.76a.848.848 0 10.948-1.408.848.848 0 00-.948 1.407zm0-2.759a.849.849 0 10.948-1.408.849.849 0 00-.948 1.408zm8.1 5.34a.388.388 0 00.03-.149v-.755a.39.39 0 00-.39-.39H6.87a.39.39 0 00-.39.39v.755a.39.39 0 00.39.39h5.11a.39.39 0 00.36-.24zm0-2.758a.388.388 0 00.03-.149v-.757a.387.387 0 00-.39-.388H6.87a.388.388 0 00-.39.388v.757a.388.388 0 00.39.388h5.11a.388.388 0 00.36-.24zm0-2.76a.388.388 0 00.03-.148v-.754a.39.39 0 00-.39-.389H6.87a.39.39 0 00-.39.387v.756a.39.39 0 00.39.39h5.11a.389.389 0 00.36-.241z\"\n        fill=\"url(#paint0_linear_2632_56586)\"\n      />\n      <Defs>\n        <LinearGradient\n          id=\"paint0_linear_2632_56586\"\n          x1={-5.51759}\n          y1={5.6338}\n          x2={5.75001}\n          y2={16.9014}\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <Stop stopColor=\"#6BB23D\" />\n          <Stop offset={1} stopColor=\"#659630\" />\n        </LinearGradient>\n      </Defs>\n    </Svg>\n  )\n}\n"]}

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

@@ -0,0 +1,29 @@
+import React, { ReactElement } from 'react';
+import { type BannerStatusIconProps, type BannerRootProps } from '../primitive/banner_primitive';
+interface BannerProps {
+    /**
+     * Changes the status color for the background, text, and icon.
+     * Sets a preset status icon.
+     */
+    appearance?: BannerRootProps['appearance'];
+    /**
+     * Renders the banner's main text.
+     * If some of the text is interactive it can also take `BannerPrimitive.Link` wrapped in `BannerPrimitive.Text`.
+     */
+    description: string | ReactElement;
+    /**
+     * Renders the banner's heading text.
+     */
+    heading?: string;
+    /**
+     * Overrides the preset status icon.
+     */
+    iconName?: BannerStatusIconProps['iconName'];
+    /**
+     * Hides the status icon. By default, the status icon is shown.
+     */
+    showIcon?: boolean;
+}
+export declare function Banner({ appearance, description, heading, iconName, showIcon, }: BannerProps): React.JSX.Element | null;
+export {};
+//# sourceMappingURL=banner.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../../../src/components/display/banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,YAAY,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAwB,EACtB,KAAK,qBAAqB,EAC1B,KAAK,eAAe,EACrB,MAAM,+BAA+B,CAAA;AAEtC,UAAU,WAAW;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAA;IAC1C;;;OAGG;IACH,WAAW,EAAE,MAAM,GAAG,YAAY,CAAA;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,qBAAqB,CAAC,UAAU,CAAC,CAAA;IAC5C;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,wBAAgB,MAAM,CAAC,EACrB,UAAU,EACV,WAAW,EACX,OAAO,EACP,QAAQ,EACR,QAAe,GAChB,EAAE,WAAW,4BAkBb"}

package/build/components/display/banner.js

@@ -0,0 +1,16 @@
+import React, { isValidElement } from 'react';
+import BannerPrimitive from '../primitive/banner_primitive';
+export function Banner({ appearance, description, heading, iconName, showIcon = true, }) {
+    if (!description && !heading)
+        return null;
+    return (<BannerPrimitive.Root appearance={appearance}>
+      <BannerPrimitive.StaticLayout>
+        {showIcon && <BannerPrimitive.StatusIcon iconName={iconName}/>}
+        <BannerPrimitive.Content>
+          {Boolean(heading) && <BannerPrimitive.Heading>{heading}</BannerPrimitive.Heading>}
+          {isValidElement(description) ? (description) : (<BannerPrimitive.Text>{description}</BannerPrimitive.Text>)}
+        </BannerPrimitive.Content>
+      </BannerPrimitive.StaticLayout>
+    </BannerPrimitive.Root>);
+}
+//# sourceMappingURL=banner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"banner.js","sourceRoot":"","sources":["../../../src/components/display/banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAgB,MAAM,OAAO,CAAA;AAC3D,OAAO,eAGN,MAAM,+BAA+B,CAAA;AA2BtC,MAAM,UAAU,MAAM,CAAC,EACrB,UAAU,EACV,WAAW,EACX,OAAO,EACP,QAAQ,EACR,QAAQ,GAAG,IAAI,GACH;IACZ,IAAI,CAAC,WAAW,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAA;IAEzC,OAAO,CACL,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,UAAU,CAAC,CAC3C;MAAA,CAAC,eAAe,CAAC,YAAY,CAC3B;QAAA,CAAC,QAAQ,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,EAAG,CAC/D;QAAA,CAAC,eAAe,CAAC,OAAO,CACtB;UAAA,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CACjF;UAAA,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAC7B,WAAW,CACZ,CAAC,CAAC,CAAC,CACF,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,EAAE,eAAe,CAAC,IAAI,CAAC,CAC3D,CACH;QAAA,EAAE,eAAe,CAAC,OAAO,CAC3B;MAAA,EAAE,eAAe,CAAC,YAAY,CAChC;IAAA,EAAE,eAAe,CAAC,IAAI,CAAC,CACxB,CAAA;AACH,CAAC","sourcesContent":["import React, { isValidElement, ReactElement } from 'react'\nimport BannerPrimitive, {\n  type BannerStatusIconProps,\n  type BannerRootProps,\n} from '../primitive/banner_primitive'\n\ninterface BannerProps {\n  /**\n   * Changes the status color for the background, text, and icon.\n   * Sets a preset status icon.\n   */\n  appearance?: BannerRootProps['appearance']\n  /**\n   * Renders the banner's main text.\n   * If some of the text is interactive it can also take `BannerPrimitive.Link` wrapped in `BannerPrimitive.Text`.\n   */\n  description: string | ReactElement\n  /**\n   * Renders the banner's heading text.\n   */\n  heading?: string\n  /**\n   * Overrides the preset status icon.\n   */\n  iconName?: BannerStatusIconProps['iconName']\n  /**\n   * Hides the status icon. By default, the status icon is shown.\n   */\n  showIcon?: boolean\n}\n\nexport function Banner({\n  appearance,\n  description,\n  heading,\n  iconName,\n  showIcon = true,\n}: BannerProps) {\n  if (!description && !heading) return null\n\n  return (\n    <BannerPrimitive.Root appearance={appearance}>\n      <BannerPrimitive.StaticLayout>\n        {showIcon && <BannerPrimitive.StatusIcon iconName={iconName} />}\n        <BannerPrimitive.Content>\n          {Boolean(heading) && <BannerPrimitive.Heading>{heading}</BannerPrimitive.Heading>}\n          {isValidElement(description) ? (\n            description\n          ) : (\n            <BannerPrimitive.Text>{description}</BannerPrimitive.Text>\n          )}\n        </BannerPrimitive.Content>\n      </BannerPrimitive.StaticLayout>\n    </BannerPrimitive.Root>\n  )\n}\n"]}

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { PressableProps, ViewStyle } from 'react-native';
-import type { ButtonAppearanceUnion } from './button_color_utils';
+import type { ButtonAppearanceUnion } from './utils/button_colors';
 declare const SIZES: {
     readonly sm: "sm";
     readonly md: "md";

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

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/display/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAQ7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAA;AAMjE,QAAA,MAAM,KAAK;;;;CAID,CAAA;AAEV,KAAK,SAAS,GAAG,CAAC,OAAO,KAAK,CAAC,CAAC,MAAM,OAAO,KAAK,CAAC,CAAA;AAYnD,QAAA,MAAM,QAAQ;;;CAGJ,CAAA;AAEV,KAAK,YAAY,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAA;AAa5D,UAAU,WAAY,SAAQ,cAAc;IAC1C;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAC7B;;OAEG;IACH,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAC7B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB;AAED,wBAAgB,MAAM,CAAC,EACrB,oBAA4B,EAC5B,gBAAuB,EACvB,UAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,QAAgB,EAChB,YAAY,EACZ,aAAa,EACb,OAAO,EACP,qBAAqB,EACrB,gBAAgB,EAChB,IAAW,EACX,KAAK,EACL,OAAgB,EAChB,GAAG,KAAK,EACT,EAAE,WAAW,qBA4Db"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/display/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAQ7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAMlE,QAAA,MAAM,KAAK;;;;CAID,CAAA;AAEV,KAAK,SAAS,GAAG,CAAC,OAAO,KAAK,CAAC,CAAC,MAAM,OAAO,KAAK,CAAC,CAAA;AAYnD,QAAA,MAAM,QAAQ;;;CAGJ,CAAA;AAEV,KAAK,YAAY,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAA;AAa5D,UAAU,WAAY,SAAQ,cAAc;IAC1C;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAC7B;;OAEG;IACH,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAC7B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;CACvB;AAED,wBAAgB,MAAM,CAAC,EACrB,oBAA4B,EAC5B,gBAAuB,EACvB,UAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,QAAgB,EAChB,YAAY,EACZ,aAAa,EACb,OAAO,EACP,qBAAqB,EACrB,gBAAgB,EAChB,IAAW,EACX,KAAK,EACL,OAAgB,EAChB,GAAG,KAAK,EACT,EAAE,WAAW,qBA4Db"}

package/build/components/display/button.js

@@ -6,7 +6,7 @@ import { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks
 import { tokens } from '../../vendor/tapestry/tokens';
 import { platformFontWeightBold, platformPressedOpacityStyle } from '../../utils';
 import { Spinner } from './spinner';
-import { getColorKey, useButtonColorOptionMap, useGradientColorMap } from './button_color_utils';
+import { getColorKey, useButtonColorOptionMap, useGradientColorMap } from './utils/button_colors';
 // =================================
 // ====== Constants ================
 // =================================

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

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/display/button.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { Pressable, StyleSheet, Text, View } from 'react-native'\nimport type { PressableProps, ViewStyle } from 'react-native'\nimport LinearGradient from 'react-native-linear-gradient'\nimport { Icon } from './icon'\nimport { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { platformFontWeightBold, platformPressedOpacityStyle } from '../../utils'\nimport { Spinner } from './spinner'\nimport { getColorKey, useButtonColorOptionMap, useGradientColorMap } from './button_color_utils'\nimport type { ButtonAppearanceUnion } from './button_color_utils'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst SIZES = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n} as const\n\ntype SizeUnion = (typeof SIZES)[keyof typeof SIZES]\ntype SizeStyle = Record<\n  SizeUnion,\n  {\n    fontSize: number\n    paddingHorizontal: number\n    height: number\n    borderRadius: number\n    gap: number\n  }\n>\n\nconst VARIANTS = {\n  fill: 'fill',\n  outline: 'outline',\n} as const\n\ntype VariantUnion = (typeof VARIANTS)[keyof typeof VARIANTS]\ntype VariantColors = Record<\n  VariantUnion,\n  {\n    backgroundColor: string\n    color: string\n  }\n>\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface ButtonProps extends PressableProps {\n  /**\n   * Specifies whether fonts should be scaled down automatically to fit given style constraints.\n   */\n  adjustsFontSizeToFit?: boolean\n  /**\n   * Specifies whether fonts should scale to respect the device's text size accessibility settings. The default is true.\n   */\n  allowFontScaling?: boolean\n  /**\n   * Updates the button's colors\n   */\n  appearance?: ButtonAppearanceUnion\n  /**\n   * Styles the inner View that wraps the button's content\n   */\n  buttonInnerStyles?: ViewStyle\n  /**\n   * Styles the outer LinearGradient that gives the button it's backgrounnd and outline color\n   */\n  buttonOuterStyles?: ViewStyle\n  /**\n   * Generates an icon to the left of the button text\n   */\n  iconNameLeft?: string\n  /**\n   * Generates an icon to the right of the button text\n   */\n  iconNameRight?: string\n  /**\n   * Disables the button and replaces its content with a spinner\n   */\n  loading?: boolean\n  /**\n   * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n   */\n  maxFontSizeMultiplier?: number\n  /**\n   * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0).\n   */\n  minimumFontScale?: number\n  /**\n   * Changes the overall size of the button and its contents\n   */\n  size?: SizeUnion\n  /**\n   * Renders as text within the button\n   */\n  title: string\n  /**\n   * Fill buttons are visually more propmonitent then outline buttons\n   */\n  variant?: VariantUnion\n}\n\nexport function Button({\n  adjustsFontSizeToFit = false,\n  allowFontScaling = true,\n  appearance = 'interaction',\n  buttonInnerStyles,\n  buttonOuterStyles,\n  disabled = false,\n  iconNameLeft,\n  iconNameRight,\n  loading,\n  maxFontSizeMultiplier,\n  minimumFontScale,\n  size = 'md',\n  title,\n  variant = 'fill',\n  ...props\n}: ButtonProps) {\n  const styles = useStyles({ appearance, disabled, loading, maxFontSizeMultiplier, size, variant })\n  const gradientOptionsMap = useGradientColorMap()\n  const colorKey = getColorKey({ disabled, loading, appearance })\n\n  const textStyles = [styles.text, disabled && styles.textDisabled, loading && styles.iconLoading]\n  const iconStyles = [styles.icon, disabled && styles.iconDisabled, loading && styles.textLoading]\n\n  const androidRippleColor = useCreateAndroidRippleColor({ color: gradientOptionsMap[colorKey][0] })\n\n  return (\n    <Pressable\n      style={({ pressed }) => [styles.pressable, pressed && platformPressedOpacityStyle]}\n      accessibilityRole=\"button\"\n      disabled={disabled || loading}\n      accessibilityState={{ busy: loading }}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n      {...props}\n    >\n      <LinearGradient\n        start={{ x: 0.1, y: 0.1 }}\n        end={{ x: 0.9, y: 0.9 }}\n        colors={gradientOptionsMap[colorKey]}\n        style={[styles.colorWrapper, buttonOuterStyles]}\n      >\n        {loading && (\n          <Spinner\n            size={styles.spinner.fontSize}\n            maxFontSizeMultiplier={maxFontSizeMultiplier || 0}\n          />\n        )}\n        <View style={[styles.innerWrapper, buttonInnerStyles]}>\n          {iconNameLeft && (\n            <Icon\n              name={iconNameLeft}\n              style={iconStyles}\n              maxFontSizeMultiplier={maxFontSizeMultiplier}\n            />\n          )}\n          <Text\n            allowFontScaling={allowFontScaling}\n            minimumFontScale={minimumFontScale}\n            maxFontSizeMultiplier={maxFontSizeMultiplier}\n            adjustsFontSizeToFit={adjustsFontSizeToFit}\n            numberOfLines={1}\n            style={textStyles}\n          >\n            {title}\n          </Text>\n          {iconNameRight && (\n            <Icon\n              name={iconNameRight}\n              style={iconStyles}\n              maxFontSizeMultiplier={maxFontSizeMultiplier}\n            />\n          )}\n        </View>\n      </LinearGradient>\n    </Pressable>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n  appearance = 'interaction',\n  disabled = false,\n  loading = false,\n  maxFontSizeMultiplier,\n  size = 'md',\n  variant = 'fill',\n}: Partial<ButtonProps>) => {\n  const { colors, button } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier })\n  const colorOptionMap = useButtonColorOptionMap()\n\n  const outlineHeightOffset = size === 'sm' ? 2 : 4\n  const outlineMarginOffset = size === 'sm' ? 1 : 2\n\n  const sizeStyleMap: SizeStyle = {\n    [SIZES.sm]: {\n      fontSize: 12,\n      paddingHorizontal: 12 * fontScale,\n      borderRadius: button.borderRadius * fontScale,\n      height: 24 * fontScale - outlineHeightOffset,\n      gap: 4 * fontScale,\n    },\n    [SIZES.md]: {\n      fontSize: 14,\n      paddingHorizontal: 16 * fontScale,\n      borderRadius: button.borderRadius * fontScale,\n      height: 32 * fontScale - outlineHeightOffset,\n      gap: 6 * fontScale,\n    },\n    [SIZES.lg]: {\n      fontSize: 16,\n      paddingHorizontal: 24 * fontScale,\n      borderRadius: button.borderRadius * fontScale,\n      height: 40 * fontScale - outlineHeightOffset,\n      gap: 8 * fontScale,\n    },\n  }\n\n  const variantOutlineColor =\n    disabled || loading ? colors.fillColorNeutral090 : colors.fillColorNeutral100Inverted\n\n  const variantStyleMap: VariantColors = {\n    fill: {\n      backgroundColor: 'transparent',\n      color: tokens.colorNeutral100White,\n    },\n    outline: {\n      backgroundColor: variantOutlineColor,\n      color: colorOptionMap[appearance],\n    },\n  }\n\n  return StyleSheet.create({\n    pressable: {\n      borderRadius: sizeStyleMap[size].borderRadius,\n      overflow: 'hidden',\n    },\n    colorWrapper: {\n      flexDirection: 'row',\n      justifyContent: 'center',\n      alignItems: 'center',\n      borderRadius: sizeStyleMap[size].borderRadius,\n    },\n    innerWrapper: {\n      flexDirection: 'row',\n      justifyContent: 'center',\n      alignItems: 'center',\n      margin: outlineMarginOffset,\n      gap: sizeStyleMap[size].gap,\n      borderRadius: sizeStyleMap[size].borderRadius - outlineMarginOffset,\n      height: sizeStyleMap[size].height,\n      backgroundColor: variantStyleMap[variant].backgroundColor,\n      paddingHorizontal: sizeStyleMap[size].paddingHorizontal,\n    },\n    text: {\n      textAlign: 'center',\n      textAlignVertical: 'center',\n      includeFontPadding: false,\n      fontWeight: platformFontWeightBold,\n      fontSize: sizeStyleMap[size].fontSize,\n      color: variantStyleMap[variant].color,\n    },\n    textDisabled: {\n      color: colors.textColorDefaultDisabled,\n    },\n    textLoading: {\n      opacity: 0,\n    },\n    icon: {\n      fontSize: sizeStyleMap[size].fontSize,\n      color: variantStyleMap[variant].color,\n    },\n    iconDisabled: {\n      color: colors.iconColorDefaultDisabled,\n    },\n    iconLoading: {\n      opacity: 0,\n    },\n    spinner: {\n      fontSize: sizeStyleMap[size].fontSize,\n    },\n  })\n}\n"]}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/display/button.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { Pressable, StyleSheet, Text, View } from 'react-native'\nimport type { PressableProps, ViewStyle } from 'react-native'\nimport LinearGradient from 'react-native-linear-gradient'\nimport { Icon } from './icon'\nimport { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { platformFontWeightBold, platformPressedOpacityStyle } from '../../utils'\nimport { Spinner } from './spinner'\nimport { getColorKey, useButtonColorOptionMap, useGradientColorMap } from './utils/button_colors'\nimport type { ButtonAppearanceUnion } from './utils/button_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\nconst SIZES = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n} as const\n\ntype SizeUnion = (typeof SIZES)[keyof typeof SIZES]\ntype SizeStyle = Record<\n  SizeUnion,\n  {\n    fontSize: number\n    paddingHorizontal: number\n    height: number\n    borderRadius: number\n    gap: number\n  }\n>\n\nconst VARIANTS = {\n  fill: 'fill',\n  outline: 'outline',\n} as const\n\ntype VariantUnion = (typeof VARIANTS)[keyof typeof VARIANTS]\ntype VariantColors = Record<\n  VariantUnion,\n  {\n    backgroundColor: string\n    color: string\n  }\n>\n\n// =================================\n// ====== Component ================\n// =================================\n\ninterface ButtonProps extends PressableProps {\n  /**\n   * Specifies whether fonts should be scaled down automatically to fit given style constraints.\n   */\n  adjustsFontSizeToFit?: boolean\n  /**\n   * Specifies whether fonts should scale to respect the device's text size accessibility settings. The default is true.\n   */\n  allowFontScaling?: boolean\n  /**\n   * Updates the button's colors\n   */\n  appearance?: ButtonAppearanceUnion\n  /**\n   * Styles the inner View that wraps the button's content\n   */\n  buttonInnerStyles?: ViewStyle\n  /**\n   * Styles the outer LinearGradient that gives the button it's backgrounnd and outline color\n   */\n  buttonOuterStyles?: ViewStyle\n  /**\n   * Generates an icon to the left of the button text\n   */\n  iconNameLeft?: string\n  /**\n   * Generates an icon to the right of the button text\n   */\n  iconNameRight?: string\n  /**\n   * Disables the button and replaces its content with a spinner\n   */\n  loading?: boolean\n  /**\n   * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n   */\n  maxFontSizeMultiplier?: number\n  /**\n   * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0).\n   */\n  minimumFontScale?: number\n  /**\n   * Changes the overall size of the button and its contents\n   */\n  size?: SizeUnion\n  /**\n   * Renders as text within the button\n   */\n  title: string\n  /**\n   * Fill buttons are visually more propmonitent then outline buttons\n   */\n  variant?: VariantUnion\n}\n\nexport function Button({\n  adjustsFontSizeToFit = false,\n  allowFontScaling = true,\n  appearance = 'interaction',\n  buttonInnerStyles,\n  buttonOuterStyles,\n  disabled = false,\n  iconNameLeft,\n  iconNameRight,\n  loading,\n  maxFontSizeMultiplier,\n  minimumFontScale,\n  size = 'md',\n  title,\n  variant = 'fill',\n  ...props\n}: ButtonProps) {\n  const styles = useStyles({ appearance, disabled, loading, maxFontSizeMultiplier, size, variant })\n  const gradientOptionsMap = useGradientColorMap()\n  const colorKey = getColorKey({ disabled, loading, appearance })\n\n  const textStyles = [styles.text, disabled && styles.textDisabled, loading && styles.iconLoading]\n  const iconStyles = [styles.icon, disabled && styles.iconDisabled, loading && styles.textLoading]\n\n  const androidRippleColor = useCreateAndroidRippleColor({ color: gradientOptionsMap[colorKey][0] })\n\n  return (\n    <Pressable\n      style={({ pressed }) => [styles.pressable, pressed && platformPressedOpacityStyle]}\n      accessibilityRole=\"button\"\n      disabled={disabled || loading}\n      accessibilityState={{ busy: loading }}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n      {...props}\n    >\n      <LinearGradient\n        start={{ x: 0.1, y: 0.1 }}\n        end={{ x: 0.9, y: 0.9 }}\n        colors={gradientOptionsMap[colorKey]}\n        style={[styles.colorWrapper, buttonOuterStyles]}\n      >\n        {loading && (\n          <Spinner\n            size={styles.spinner.fontSize}\n            maxFontSizeMultiplier={maxFontSizeMultiplier || 0}\n          />\n        )}\n        <View style={[styles.innerWrapper, buttonInnerStyles]}>\n          {iconNameLeft && (\n            <Icon\n              name={iconNameLeft}\n              style={iconStyles}\n              maxFontSizeMultiplier={maxFontSizeMultiplier}\n            />\n          )}\n          <Text\n            allowFontScaling={allowFontScaling}\n            minimumFontScale={minimumFontScale}\n            maxFontSizeMultiplier={maxFontSizeMultiplier}\n            adjustsFontSizeToFit={adjustsFontSizeToFit}\n            numberOfLines={1}\n            style={textStyles}\n          >\n            {title}\n          </Text>\n          {iconNameRight && (\n            <Icon\n              name={iconNameRight}\n              style={iconStyles}\n              maxFontSizeMultiplier={maxFontSizeMultiplier}\n            />\n          )}\n        </View>\n      </LinearGradient>\n    </Pressable>\n  )\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n  appearance = 'interaction',\n  disabled = false,\n  loading = false,\n  maxFontSizeMultiplier,\n  size = 'md',\n  variant = 'fill',\n}: Partial<ButtonProps>) => {\n  const { colors, button } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier })\n  const colorOptionMap = useButtonColorOptionMap()\n\n  const outlineHeightOffset = size === 'sm' ? 2 : 4\n  const outlineMarginOffset = size === 'sm' ? 1 : 2\n\n  const sizeStyleMap: SizeStyle = {\n    [SIZES.sm]: {\n      fontSize: 12,\n      paddingHorizontal: 12 * fontScale,\n      borderRadius: button.borderRadius * fontScale,\n      height: 24 * fontScale - outlineHeightOffset,\n      gap: 4 * fontScale,\n    },\n    [SIZES.md]: {\n      fontSize: 14,\n      paddingHorizontal: 16 * fontScale,\n      borderRadius: button.borderRadius * fontScale,\n      height: 32 * fontScale - outlineHeightOffset,\n      gap: 6 * fontScale,\n    },\n    [SIZES.lg]: {\n      fontSize: 16,\n      paddingHorizontal: 24 * fontScale,\n      borderRadius: button.borderRadius * fontScale,\n      height: 40 * fontScale - outlineHeightOffset,\n      gap: 8 * fontScale,\n    },\n  }\n\n  const variantOutlineColor =\n    disabled || loading ? colors.fillColorNeutral090 : colors.fillColorNeutral100Inverted\n\n  const variantStyleMap: VariantColors = {\n    fill: {\n      backgroundColor: 'transparent',\n      color: tokens.colorNeutral100White,\n    },\n    outline: {\n      backgroundColor: variantOutlineColor,\n      color: colorOptionMap[appearance],\n    },\n  }\n\n  return StyleSheet.create({\n    pressable: {\n      borderRadius: sizeStyleMap[size].borderRadius,\n      overflow: 'hidden',\n    },\n    colorWrapper: {\n      flexDirection: 'row',\n      justifyContent: 'center',\n      alignItems: 'center',\n      borderRadius: sizeStyleMap[size].borderRadius,\n    },\n    innerWrapper: {\n      flexDirection: 'row',\n      justifyContent: 'center',\n      alignItems: 'center',\n      margin: outlineMarginOffset,\n      gap: sizeStyleMap[size].gap,\n      borderRadius: sizeStyleMap[size].borderRadius - outlineMarginOffset,\n      height: sizeStyleMap[size].height,\n      backgroundColor: variantStyleMap[variant].backgroundColor,\n      paddingHorizontal: sizeStyleMap[size].paddingHorizontal,\n    },\n    text: {\n      textAlign: 'center',\n      textAlignVertical: 'center',\n      includeFontPadding: false,\n      fontWeight: platformFontWeightBold,\n      fontSize: sizeStyleMap[size].fontSize,\n      color: variantStyleMap[variant].color,\n    },\n    textDisabled: {\n      color: colors.textColorDefaultDisabled,\n    },\n    textLoading: {\n      opacity: 0,\n    },\n    icon: {\n      fontSize: sizeStyleMap[size].fontSize,\n      color: variantStyleMap[variant].color,\n    },\n    iconDisabled: {\n      color: colors.iconColorDefaultDisabled,\n    },\n    iconLoading: {\n      opacity: 0,\n    },\n    spinner: {\n      fontSize: sizeStyleMap[size].fontSize,\n    },\n  })\n}\n"]}

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { PressableProps, ViewStyle } from 'react-native';
 import type { IconProps } from './icon';
-import type { IconButtonAppearanceUnion } from './button_color_utils';
+import type { IconButtonAppearanceUnion } from './utils/button_colors';
 declare const SIZES: {
     readonly md: "md";
     readonly lg: "lg";

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

@@ -1 +1 @@
-{"version":3,"file":"icon_button.d.ts","sourceRoot":"","sources":["../../../src/components/display/icon_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAKvC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AAMrE,QAAA,MAAM,KAAK;;;;;;CAMD,CAAA;AAEV,KAAK,SAAS,GAAG,CAAC,OAAO,KAAK,CAAC,CAAC,MAAM,OAAO,KAAK,CAAC,CAAA;AAmBnD,UAAU,eAAgB,SAAQ,cAAc;IAC9C;;;OAGG;IACH,kBAAkB,EAAE,MAAM,CAAA;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,yBAAyB,CAAA;IACtC;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,UAAU,CAAC,EACzB,kBAAkB,EAClB,UAAsB,EACtB,QAAgB,EAChB,SAAS,EACT,OAAO,EACP,qBAAqB,EACrB,IAAI,EACJ,IAAW,EACX,KAAK,EACL,GAAG,KAAK,EACT,EAAE,eAAe,qBAuDjB"}
+{"version":3,"file":"icon_button.d.ts","sourceRoot":"","sources":["../../../src/components/display/icon_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAKvC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAA;AAMtE,QAAA,MAAM,KAAK;;;;;;CAMD,CAAA;AAEV,KAAK,SAAS,GAAG,CAAC,OAAO,KAAK,CAAC,CAAC,MAAM,OAAO,KAAK,CAAC,CAAA;AAmBnD,UAAU,eAAgB,SAAQ,cAAc;IAC9C;;;OAGG;IACH,kBAAkB,EAAE,MAAM,CAAA;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,yBAAyB,CAAA;IACtC;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,UAAU,CAAC,EACzB,kBAAkB,EAClB,UAAsB,EACtB,QAAgB,EAChB,SAAS,EACT,OAAO,EACP,qBAAqB,EACrB,IAAI,EACJ,IAAW,EACX,KAAK,EACL,GAAG,KAAK,EACT,EAAE,eAAe,qBAuDjB"}

package/build/components/display/icon_button.js

@@ -4,7 +4,7 @@ import { Icon } from './icon';
 import { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks';
 import { platformPressedOpacityStyle } from '../../utils';
 import { Spinner } from './spinner';
-import { getColorKey, useIconButtonColorOptionMap } from './button_color_utils';
+import { getColorKey, useIconButtonColorOptionMap } from './utils/button_colors';
 // =================================
 // ====== Constants ================
 // =================================

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

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

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

@@ -1,6 +1,7 @@
 export * from './avatar';
 export * from './avatar_group';
 export * from './badge';
+export * from './banner';
 export * from './button';
 export * from './heading';
 export * from './icon';

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,cAAc,UAAU,CAAA;AACxB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA"}

package/build/components/display/index.js

@@ -1,6 +1,7 @@
 export * from './avatar';
 export * from './avatar_group';
 export * from './badge';
+export * from './banner';
 export * from './button';
 export * from './heading';
 export * from './icon';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA","sourcesContent":["export * from './avatar'\nexport * from './avatar_group'\nexport * from './badge'\nexport * from './button'\nexport * from './heading'\nexport * from './icon'\nexport * from './icon_button'\nexport * from './image'\nexport * from './spinner'\nexport * from './switch'\nexport * from './text'\nexport * from './text_button'\nexport * from './text_inline_button'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/display/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA","sourcesContent":["export * from './avatar'\nexport * from './avatar_group'\nexport * from './badge'\nexport * from './banner'\nexport * from './button'\nexport * from './heading'\nexport * from './icon'\nexport * from './icon_button'\nexport * from './image'\nexport * from './spinner'\nexport * from './switch'\nexport * from './text'\nexport * from './text_button'\nexport * from './text_inline_button'\n"]}

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { PressableProps } from 'react-native';
 import type { TextProps } from './text';
-import type { ButtonAppearanceUnion } from './button_color_utils';
+import type { ButtonAppearanceUnion } from './utils/button_colors';
 interface TextButtonProps extends PressableProps {
     /**
      * Specifies whether fonts should be scaled down automatically to fit given style constraints.

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

@@ -1 +1 @@
-{"version":3,"file":"text_button.d.ts","sourceRoot":"","sources":["../../../src/components/display/text_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAIlD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAEvC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAA;AAMjE,UAAU,eAAgB,SAAQ,cAAc;IAC9C;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;IAChC;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC/B;AAED,wBAAgB,UAAU,CAAC,EACzB,oBAA4B,EAC5B,gBAAuB,EACvB,UAA0B,EAC1B,QAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,gBAAgB,EAChB,OAAiB,EACjB,GAAG,KAAK,EACT,EAAE,eAAe,qBAwBjB"}
+{"version":3,"file":"text_button.d.ts","sourceRoot":"","sources":["../../../src/components/display/text_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAIlD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAEvC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAMlE,UAAU,eAAgB,SAAQ,cAAc;IAC9C;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;IAChC;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC/B;AAED,wBAAgB,UAAU,CAAC,EACzB,oBAA4B,EAC5B,gBAAuB,EACvB,UAA0B,EAC1B,QAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,gBAAgB,EAChB,OAAiB,EACjB,GAAG,KAAK,EACT,EAAE,eAAe,qBAwBjB"}

package/build/components/display/text_button.js

@@ -3,7 +3,7 @@ import { Pressable, StyleSheet } from 'react-native';
 import { useTheme } from '../../hooks';
 import { platformFontWeightMedium } from '../../utils';
 import { Text } from './text';
-import { getColorKey, useButtonColorOptionMap } from './button_color_utils';
+import { getColorKey, useButtonColorOptionMap } from './utils/button_colors';
 export function TextButton({ adjustsFontSizeToFit = false, allowFontScaling = true, appearance = 'interaction', disabled = false, children, maxFontSizeMultiplier, minimumFontScale, variant = 'plain', ...props }) {
     const styles = useStyles({ appearance, disabled });
     return (<Pressable accessibilityRole="button" disabled={disabled} style={({ pressed }) => pressed && styles.pressed} // Android & iOS intentionally get the same pressed style