@aws-amplify/ui-react-native 0.0.0-in-app-messaging-20220826014803

package/dist/InAppMessaging/components/CarouselMessage/types.d.ts

@@ -0,0 +1,18 @@
+import { StyleProp, ViewStyle } from 'react-native';
+import { CarouselMessageCommonProps, MessageComponentBaseProps } from '@aws-amplify/ui-react-core';
+import { MessageDefaultStyle, MessageOverrideStyle } from '../../hooks';
+interface CarouselMessageOverrideStyle extends MessageOverrideStyle {
+    pageIndicatorActive?: StyleProp<ViewStyle>;
+    pageIndicatorInactive?: StyleProp<ViewStyle>;
+}
+export interface CarouselMessageProps extends CarouselMessageCommonProps<CarouselMessageOverrideStyle | undefined> {
+}
+export interface CarouselMessageItemProps extends MessageComponentBaseProps<CarouselMessageOverrideStyle> {
+}
+export interface CarouselMessageStyle extends MessageDefaultStyle {
+}
+export interface CarouselMessageComponentStyle {
+    pageIndicatorActive: ViewStyle;
+    pageIndicatorInactive: ViewStyle;
+}
+export {};

package/dist/InAppMessaging/components/CarouselMessage/types.js

@@ -0,0 +1 @@
+export {};

package/dist/InAppMessaging/components/FullScreenMessage/FullScreenMessage.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FullScreenMessageProps } from './types';
+export default function FullScreenMessage(props: FullScreenMessageProps): JSX.Element | null;

package/dist/InAppMessaging/components/FullScreenMessage/FullScreenMessage.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { useDeviceOrientation } from '../../../hooks';
+import { useMessageProps } from '../../hooks';
+import { MessageLayout } from '../MessageLayout';
+import { MessageWrapper } from '../MessageWrapper';
+import { getLandscapeStyles, getPortraitStyles } from './styles';
+export default function FullScreenMessage(props) {
+    const { deviceOrientation, isPortraitMode } = useDeviceOrientation();
+    const messageProps = useMessageProps(props, isPortraitMode ? getPortraitStyles : getLandscapeStyles);
+    const { shouldRenderMessage, styles } = messageProps;
+    if (!shouldRenderMessage) {
+        return null;
+    }
+    const { wrapper, ...messageStyles } = styles;
+    return (<MessageWrapper style={wrapper}>
+      <MessageLayout {...props} {...messageProps} orientation={deviceOrientation} styles={messageStyles}/>
+    </MessageWrapper>);
+}

package/dist/InAppMessaging/components/FullScreenMessage/index.d.ts

@@ -0,0 +1,2 @@
+export { default as FullScreenMessage } from './FullScreenMessage';
+export { FullScreenMessageProps } from './types';

package/dist/InAppMessaging/components/FullScreenMessage/index.js

@@ -0,0 +1 @@
+export { default as FullScreenMessage } from './FullScreenMessage';

package/dist/InAppMessaging/components/FullScreenMessage/styles.d.ts

@@ -0,0 +1,3 @@
+import { GetDefaultStyle } from '../../hooks';
+export declare const getPortraitStyles: GetDefaultStyle;
+export declare const getLandscapeStyles: GetDefaultStyle;

package/dist/InAppMessaging/components/FullScreenMessage/styles.js

@@ -0,0 +1,86 @@
+import { BORDER_RADIUS_BASE, COLOR_LIGHT_GREY, COLOR_WHITE, FONT_SIZE_BASE, FONT_SIZE_LARGE, FONT_WEIGHT_BASE, LINE_HEIGHT_BASE, LINE_HEIGHT_LARGE, SPACING_EXTRA_LARGE, SPACING_LARGE, SPACING_MEDIUM, } from '../../constants';
+const commonStyles = {
+    body: {
+        fontSize: FONT_SIZE_BASE,
+        fontWeight: FONT_WEIGHT_BASE,
+        lineHeight: LINE_HEIGHT_BASE,
+    },
+    buttonContainer: {
+        backgroundColor: COLOR_LIGHT_GREY,
+        borderRadius: BORDER_RADIUS_BASE,
+        flex: 1,
+        margin: SPACING_MEDIUM,
+        padding: SPACING_LARGE,
+    },
+    buttonsContainer: {
+        flexDirection: 'row',
+        justifyContent: 'center',
+    },
+    buttonText: {
+        fontSize: FONT_SIZE_BASE,
+        fontWeight: FONT_WEIGHT_BASE,
+        lineHeight: LINE_HEIGHT_BASE,
+        textAlign: 'center',
+    },
+    container: {
+        flex: 1,
+        padding: SPACING_EXTRA_LARGE,
+    },
+    contentContainer: {
+        flex: 1,
+    },
+    header: {
+        fontSize: FONT_SIZE_LARGE,
+        fontWeight: FONT_WEIGHT_BASE,
+        lineHeight: LINE_HEIGHT_LARGE,
+    },
+    iconButton: {
+        alignSelf: 'flex-start',
+        marginBottom: SPACING_MEDIUM,
+        marginLeft: 'auto',
+        marginRight: SPACING_MEDIUM,
+    },
+    imageContainer: {
+        alignItems: 'center',
+        margin: SPACING_LARGE,
+    },
+    textContainer: {
+        paddingHorizontal: SPACING_MEDIUM,
+    },
+    wrapper: {
+        backgroundColor: COLOR_WHITE,
+    },
+};
+export const getPortraitStyles = (imageDimensions) => ({
+    ...commonStyles,
+    buttonsContainer: {
+        ...commonStyles.buttonsContainer,
+        marginTop: 'auto',
+    },
+    image: imageDimensions,
+    textContainer: {
+        ...commonStyles.textContainer,
+        marginVertical: SPACING_LARGE,
+    },
+});
+export const getLandscapeStyles = (imageDimensions) => ({
+    ...commonStyles,
+    contentContainer: {
+        ...commonStyles.contentContainer,
+        flexDirection: 'row',
+    },
+    image: { ...imageDimensions },
+    imageContainer: {
+        ...commonStyles.imageContainer,
+        justifyContent: 'center',
+    },
+    textContainer: {
+        ...commonStyles.textContainer,
+        flex: 1,
+        justifyContent: 'center',
+    },
+    wrapper: {
+        ...commonStyles.wrapper,
+        flex: 1,
+    },
+});

package/dist/InAppMessaging/components/FullScreenMessage/types.d.ts

@@ -0,0 +1,6 @@
+import { FullScreenMessageCommonProps } from '@aws-amplify/ui-react-core';
+import { MessageDefaultStyle, MessageOverrideStyle } from '../../hooks';
+export interface FullScreenMessageProps extends FullScreenMessageCommonProps<MessageOverrideStyle | undefined> {
+}
+export interface FullScreenMessageStyle extends MessageDefaultStyle {
+}

package/dist/InAppMessaging/components/FullScreenMessage/types.js

@@ -0,0 +1 @@
+export {};

package/dist/InAppMessaging/components/InAppMessageDisplay/InAppMessageDisplay.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { InAppMessageDisplayProps } from './types';
+declare function InAppMessageDisplay({ components: overrideComponents, }: InAppMessageDisplayProps): JSX.Element | null;
+declare namespace InAppMessageDisplay {
+    var BannerMessage: typeof import("../BannerMessage").BannerMessage;
+    var CarouselMessage: typeof import("../CarouselMessage").CarouselMessage;
+    var FullScreenMessage: typeof import("../FullScreenMessage").FullScreenMessage;
+    var ModalMessage: typeof import("../ModalMessage").ModalMessage;
+}
+export default InAppMessageDisplay;

package/dist/InAppMessaging/components/InAppMessageDisplay/InAppMessageDisplay.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { handleMessageAction, useMessage, } from '@aws-amplify/ui-react-core';
+import { BannerMessage } from '../BannerMessage';
+import { FullScreenMessage } from '../FullScreenMessage';
+import { CarouselMessage } from '../CarouselMessage';
+import { ModalMessage } from '../ModalMessage';
+import handleMessageLinkAction from './handleMessageLinkAction';
+const platformComponents = {
+    BannerMessage,
+    CarouselMessage,
+    FullScreenMessage,
+    ModalMessage,
+};
+const onMessageAction = ({ action, url }) => {
+    handleMessageAction({ action, url, handleMessageLinkAction });
+};
+function InAppMessageDisplay({ components: overrideComponents, }) {
+    const components = React.useMemo(() => ({ ...platformComponents, ...overrideComponents }), [overrideComponents]);
+    const { Component, props } = useMessage({
+        components,
+        onMessageAction,
+    });
+    return <Component {...props}/>;
+}
+InAppMessageDisplay.BannerMessage = BannerMessage;
+InAppMessageDisplay.CarouselMessage = CarouselMessage;
+InAppMessageDisplay.FullScreenMessage = FullScreenMessage;
+InAppMessageDisplay.ModalMessage = ModalMessage;
+export default InAppMessageDisplay;

package/dist/InAppMessaging/components/InAppMessageDisplay/handleMessageLinkAction.d.ts

@@ -0,0 +1,3 @@
+import { HandleMessageLinkAction } from '@aws-amplify/ui-react-core';
+declare const handleMessageLinkAction: HandleMessageLinkAction;
+export default handleMessageLinkAction;

package/dist/InAppMessaging/components/InAppMessageDisplay/handleMessageLinkAction.js

@@ -0,0 +1,24 @@
+import { Linking } from 'react-native';
+import { ConsoleLogger as Logger } from '@aws-amplify/core';
+const logger = new Logger('Notifications.InAppMessaging');
+const handleMessageLinkAction = async (url) => {
+    let supported = false;
+    try {
+        supported = await Linking.canOpenURL(url);
+    }
+    catch (e) {
+        logger.warn(`Call to Linking.canOpenURL failed: ${e}`);
+    }
+    if (!supported) {
+        logger.warn(`Unsupported url provided: ${url}`);
+        return;
+    }
+    try {
+        logger.info(`Opening url: ${url}`);
+        await Linking.openURL(url);
+    }
+    catch (e) {
+        logger.warn(`Call to Linking.openURL failed: ${e}`);
+    }
+};
+export default handleMessageLinkAction;

package/dist/InAppMessaging/components/InAppMessageDisplay/index.d.ts

@@ -0,0 +1,2 @@
+export { default as InAppMessageDisplay } from './InAppMessageDisplay';
+export { MessageComponents } from './types';

package/dist/InAppMessaging/components/InAppMessageDisplay/index.js

@@ -0,0 +1 @@
+export { default as InAppMessageDisplay } from './InAppMessageDisplay';

package/dist/InAppMessaging/components/InAppMessageDisplay/types.d.ts

@@ -0,0 +1,24 @@
+import { BannerMessageComponent, CarouselMessageComponent, FullScreenMessageComponent, ModalMessageComponent } from '@aws-amplify/ui-react-core';
+import { BannerMessageProps } from '../BannerMessage';
+import { CarouselMessageProps } from '../CarouselMessage';
+import { FullScreenMessageProps } from '../FullScreenMessage';
+import { ModalMessageProps } from '../ModalMessage';
+declare type BannerStyle = BannerMessageProps['style'];
+declare type CarouselStyle = CarouselMessageProps['style'];
+declare type FullScreenStyle = FullScreenMessageProps['style'];
+declare type ModalStyle = ModalMessageProps['style'];
+export interface MessageDefaultComponents {
+    BannerMessage: BannerMessageComponent<BannerStyle>;
+    CarouselMessage: CarouselMessageComponent<CarouselStyle>;
+    FullScreenMessage: FullScreenMessageComponent<FullScreenStyle>;
+    ModalMessage: ModalMessageComponent<ModalStyle>;
+}
+export interface MessageComponents extends Partial<MessageDefaultComponents> {
+}
+export interface InAppMessageDisplayProps {
+    /**
+     * Message override UI components
+     */
+    components?: MessageComponents;
+}
+export {};

package/dist/InAppMessaging/components/InAppMessageDisplay/types.js

@@ -0,0 +1 @@
+export {};

package/dist/InAppMessaging/components/MessageLayout/MessageLayout.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { LayoutProps } from './types';
+export default function MessageLayout({ orientation, ...props }: LayoutProps): JSX.Element;

package/dist/InAppMessaging/components/MessageLayout/MessageLayout.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { Image, Text, View } from 'react-native';
+import icons from '../../../assets';
+import { Button, IconButton } from '../../../primitives';
+import { ICON_BUTTON_HIT_SLOP, ICON_BUTTON_SIZE, IN_APP_MESSAGING_TEST_ID, } from '../../constants';
+export default function MessageLayout({ orientation, ...props }) {
+    const { body, hasButtons, hasPrimaryButton, hasRenderableImage, hasSecondaryButton, header, image, onClose, primaryButton, secondaryButton, styles, } = props;
+    const iconButton = (<IconButton color={styles.iconButton.iconColor} hitSlop={ICON_BUTTON_HIT_SLOP} onPress={onClose} size={ICON_BUTTON_SIZE} source={icons.close} style={styles.iconButton.container} testID={IN_APP_MESSAGING_TEST_ID.CLOSE_BUTTON}/>);
+    return (<View style={styles.container}>
+      <View style={styles.contentContainer}>
+        {orientation === 'portrait' && iconButton}
+        {hasRenderableImage && (<View style={styles.imageContainer}>
+            <Image source={{ uri: image?.src }} style={styles.image} testID={IN_APP_MESSAGING_TEST_ID.IMAGE}/>
+          </View>)}
+        <View style={styles.textContainer}>
+          {header?.content && (<Text style={styles.header} testID={IN_APP_MESSAGING_TEST_ID.HEADER}>
+              {header.content}
+            </Text>)}
+          {body?.content && (<Text style={styles.body} testID={IN_APP_MESSAGING_TEST_ID.BODY}>
+              {body.content}
+            </Text>)}
+        </View>
+        {orientation === 'landscape' && iconButton}
+      </View>
+      {hasButtons && (<View style={styles.buttonsContainer}>
+          {hasSecondaryButton && (<Button onPress={secondaryButton?.onAction} style={styles.secondaryButton.container} testID={IN_APP_MESSAGING_TEST_ID.SECONDARY_BUTTON} textStyle={styles.secondaryButton.text}>
+              {secondaryButton?.title}
+            </Button>)}
+          {hasPrimaryButton && (<Button onPress={primaryButton?.onAction} style={styles.primaryButton.container} testID={IN_APP_MESSAGING_TEST_ID.PRIMARY_BUTTON} textStyle={styles.primaryButton.text}>
+              {primaryButton?.title}
+            </Button>)}
+        </View>)}
+    </View>);
+}

package/dist/InAppMessaging/components/MessageLayout/index.d.ts

@@ -0,0 +1 @@
+export { default as MessageLayout } from './MessageLayout';

package/dist/InAppMessaging/components/MessageLayout/index.js

@@ -0,0 +1 @@
+export { default as MessageLayout } from './MessageLayout';

package/dist/InAppMessaging/components/MessageLayout/types.d.ts

@@ -0,0 +1,7 @@
+import { MessageComponentBaseProps } from '@aws-amplify/ui-react-core';
+import { DeviceOrientation } from '../../../hooks';
+import { MessageComponentStyles, MessageOverrideStyle, UseMessageProps } from '../../hooks';
+export interface LayoutProps extends Omit<MessageComponentBaseProps<MessageOverrideStyle>, 'style'>, Omit<UseMessageProps, 'shouldRenderMessage' | 'styles'> {
+    orientation: DeviceOrientation;
+    styles: Omit<MessageComponentStyles, 'wrapper'>;
+}

package/dist/InAppMessaging/components/MessageLayout/types.js

@@ -0,0 +1 @@
+export {};

package/dist/InAppMessaging/components/MessageWrapper/MessageWrapper.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MessageWrapperProps } from './types';
+export default function MessageWrapper({ children, disableSafeAreaView, style, }: MessageWrapperProps): JSX.Element;

package/dist/InAppMessaging/components/MessageWrapper/MessageWrapper.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { Modal } from 'react-native';
+import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
+import { styles } from './styles';
+const SUPPORTED_ORIENTATIONS = [
+    'portrait',
+    'portrait-upside-down',
+    'landscape',
+    'landscape-left',
+    'landscape-right',
+];
+export default function MessageWrapper({ children, disableSafeAreaView, style, }) {
+    return (<Modal transparent visible supportedOrientations={SUPPORTED_ORIENTATIONS}>
+      <SafeAreaProvider>
+        {disableSafeAreaView ? (children) : (<SafeAreaView style={[styles.messageWrapper, style]}>
+            {children}
+          </SafeAreaView>)}
+      </SafeAreaProvider>
+    </Modal>);
+}

package/dist/InAppMessaging/components/MessageWrapper/index.d.ts

@@ -0,0 +1,2 @@
+export { default as MessageWrapper } from './MessageWrapper';
+export { MessageWrapperProps, MessageWrapperStyle } from './types';

package/dist/InAppMessaging/components/MessageWrapper/index.js

@@ -0,0 +1 @@
+export { default as MessageWrapper } from './MessageWrapper';

package/dist/InAppMessaging/components/MessageWrapper/styles.d.ts

@@ -0,0 +1,2 @@
+import { MessageWrapperStyle } from './types';
+export declare const styles: MessageWrapperStyle;

package/dist/InAppMessaging/components/MessageWrapper/styles.js

@@ -0,0 +1,5 @@
+export const styles = {
+    messageWrapper: {
+        flex: 1,
+    },
+};

package/dist/InAppMessaging/components/MessageWrapper/types.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+export interface MessageWrapperProps {
+    children: ReactNode;
+    disableSafeAreaView?: boolean;
+    style?: StyleProp<ViewStyle>;
+}
+export interface MessageWrapperStyle {
+    messageWrapper: ViewStyle;
+}

package/dist/InAppMessaging/components/MessageWrapper/types.js

@@ -0,0 +1 @@
+export {};

package/dist/InAppMessaging/components/ModalMessage/ModalMessage.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ModalMessageProps } from './types';
+export default function ModalMessage(props: ModalMessageProps): JSX.Element | null;

package/dist/InAppMessaging/components/ModalMessage/ModalMessage.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { useDeviceOrientation } from '../../../hooks';
+import { useMessageProps } from '../../hooks';
+import { MessageLayout } from '../MessageLayout';
+import { MessageWrapper } from '../MessageWrapper';
+import { getLandscapeStyles, getPortraitStyles } from './styles';
+export default function ModalMessage(props) {
+    const { deviceOrientation, isPortraitMode } = useDeviceOrientation();
+    const messageProps = useMessageProps(props, isPortraitMode ? getPortraitStyles : getLandscapeStyles);
+    const { shouldRenderMessage, styles } = messageProps;
+    if (!shouldRenderMessage) {
+        return null;
+    }
+    const { wrapper, ...messageStyles } = styles;
+    return (<MessageWrapper style={wrapper}>
+      <MessageLayout {...props} {...messageProps} orientation={deviceOrientation} styles={messageStyles}/>
+    </MessageWrapper>);
+}

package/dist/InAppMessaging/components/ModalMessage/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ModalMessage } from './ModalMessage';
+export { ModalMessageProps } from './types';

package/dist/InAppMessaging/components/ModalMessage/index.js

@@ -0,0 +1 @@
+export { default as ModalMessage } from './ModalMessage';

package/dist/InAppMessaging/components/ModalMessage/styles.d.ts

@@ -0,0 +1,4 @@
+import { ImageStyle } from 'react-native';
+import { ModalMessageStyle } from './types';
+export declare const getPortraitStyles: (imageDimensions: ImageStyle) => ModalMessageStyle;
+export declare const getLandscapeStyles: (imageDimensions: ImageStyle) => ModalMessageStyle;

package/dist/InAppMessaging/components/ModalMessage/styles.js

@@ -0,0 +1,99 @@
+import { StyleSheet } from 'react-native';
+import { BORDER_RADIUS_BASE, COLOR_BLACK, COLOR_LIGHT_GREY, COLOR_WHITE, FONT_SIZE_BASE, FONT_SIZE_LARGE, FONT_WEIGHT_BASE, LINE_HEIGHT_BASE, LINE_HEIGHT_LARGE, MESSAGE_ELEVATION, MESSAGE_SHADOW_HEIGHT, MESSAGE_SHADOW_OPACITY, MESSAGE_SHADOW_RADIUS, MESSAGE_SHADOW_WIDTH, SPACING_EXTRA_LARGE, SPACING_LARGE, SPACING_MEDIUM, SPACING_SMALL, } from '../../constants';
+const commonStyles = {
+    body: {
+        fontSize: FONT_SIZE_BASE,
+        fontWeight: FONT_WEIGHT_BASE,
+        lineHeight: LINE_HEIGHT_BASE,
+    },
+    buttonContainer: {
+        backgroundColor: COLOR_LIGHT_GREY,
+        borderRadius: BORDER_RADIUS_BASE,
+        flex: 1,
+        margin: SPACING_MEDIUM,
+        padding: SPACING_LARGE,
+    },
+    buttonsContainer: {
+        flexDirection: 'row',
+        justifyContent: 'center',
+    },
+    container: {
+        backgroundColor: COLOR_WHITE,
+        elevation: MESSAGE_ELEVATION,
+        margin: SPACING_EXTRA_LARGE,
+        shadowColor: COLOR_BLACK,
+        shadowOffset: {
+            width: MESSAGE_SHADOW_WIDTH,
+            height: MESSAGE_SHADOW_HEIGHT,
+        },
+        shadowOpacity: MESSAGE_SHADOW_OPACITY,
+        shadowRadius: MESSAGE_SHADOW_RADIUS,
+    },
+    buttonText: {
+        fontSize: FONT_SIZE_BASE,
+        fontWeight: FONT_WEIGHT_BASE,
+        lineHeight: LINE_HEIGHT_BASE,
+        textAlign: 'center',
+    },
+    header: {
+        fontSize: FONT_SIZE_LARGE,
+        fontWeight: FONT_WEIGHT_BASE,
+        lineHeight: LINE_HEIGHT_LARGE,
+    },
+    iconButton: {
+        alignSelf: 'flex-start',
+        marginLeft: 'auto',
+    },
+    imageContainer: {
+        alignItems: 'center',
+        margin: SPACING_LARGE,
+    },
+    wrapper: {
+        flex: 1,
+        justifyContent: 'center',
+    },
+};
+export const getPortraitStyles = (imageDimensions) => StyleSheet.create({
+    ...commonStyles,
+    buttonsContainer: {
+        ...commonStyles.buttonsContainer,
+        marginTop: 'auto',
+        paddingHorizontal: SPACING_SMALL,
+        paddingBottom: SPACING_SMALL,
+    },
+    container: {
+        ...commonStyles.container,
+        minHeight: '40%',
+    },
+    contentContainer: { padding: SPACING_LARGE },
+    image: { ...imageDimensions },
+    textContainer: {
+        marginTop: SPACING_LARGE,
+    },
+});
+export const getLandscapeStyles = (imageDimensions) => StyleSheet.create({
+    ...commonStyles,
+    container: {
+        ...commonStyles.container,
+        flex: 1,
+        padding: SPACING_EXTRA_LARGE,
+    },
+    contentContainer: {
+        flex: 1,
+        flexDirection: 'row',
+    },
+    iconButton: {
+        ...commonStyles.iconButton,
+        marginRight: SPACING_MEDIUM,
+    },
+    image: { ...imageDimensions },
+    imageContainer: {
+        ...commonStyles.imageContainer,
+        justifyContent: 'center',
+    },
+    textContainer: {
+        flex: 1,
+        justifyContent: 'center',
+        paddingHorizontal: SPACING_MEDIUM,
+    },
+});

package/dist/InAppMessaging/components/ModalMessage/types.d.ts

@@ -0,0 +1,6 @@
+import { ModalMessageCommonProps } from '@aws-amplify/ui-react-core';
+import { MessageDefaultStyle, MessageOverrideStyle } from '../../hooks';
+export interface ModalMessageProps extends ModalMessageCommonProps<MessageOverrideStyle | undefined> {
+}
+export interface ModalMessageStyle extends MessageDefaultStyle {
+}

package/dist/InAppMessaging/components/ModalMessage/types.js

@@ -0,0 +1 @@
+export {};

package/dist/InAppMessaging/components/index.d.ts

@@ -0,0 +1,6 @@
+export { BannerMessageProps } from './BannerMessage';
+export { CarouselMessageProps } from './CarouselMessage';
+export { FullScreenMessageProps } from './FullScreenMessage';
+export { InAppMessageDisplay, MessageComponents } from './InAppMessageDisplay';
+export { ModalMessageProps } from './ModalMessage';
+export { withInAppMessaging } from './withInAppMessaging';

package/dist/InAppMessaging/components/index.js

@@ -0,0 +1,2 @@
+export { InAppMessageDisplay } from './InAppMessageDisplay';
+export { withInAppMessaging } from './withInAppMessaging';

package/dist/InAppMessaging/components/withInAppMessaging/index.d.ts

@@ -0,0 +1 @@
+export { default as withInAppMessaging } from './withInAppMessaging';

package/dist/InAppMessaging/components/withInAppMessaging/index.js

@@ -0,0 +1 @@
+export { default as withInAppMessaging } from './withInAppMessaging';

package/dist/InAppMessaging/components/withInAppMessaging/withInAppMessaging.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { MessageComponents } from '../InAppMessageDisplay';
+export default function withInAppMessaging<Props>(Component: (props: Props) => JSX.Element, options?: {
+    components?: MessageComponents;
+}): (props: Props) => JSX.Element;

package/dist/InAppMessaging/components/withInAppMessaging/withInAppMessaging.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { InAppMessagingProvider } from '@aws-amplify/ui-react-core';
+import { InAppMessageDisplay } from '../InAppMessageDisplay';
+export default function withInAppMessaging(Component, options) {
+    return function WrappedWithInAppMessaging(props) {
+        return (<InAppMessagingProvider>
+        <InAppMessageDisplay {...options}/>
+        <Component {...props}/>
+      </InAppMessagingProvider>);
+    };
+}

package/dist/InAppMessaging/constants.d.ts

@@ -0,0 +1,31 @@
+export declare const COLOR_BLACK = "#000";
+export declare const COLOR_GREY = "#a1a1a1";
+export declare const COLOR_LIGHT_GREY = "#e8e8e8";
+export declare const COLOR_LIGHT_GREY_2 = "#d8d8d8";
+export declare const COLOR_WHITE = "#fff";
+export declare const SPACING_SMALL = 4;
+export declare const SPACING_MEDIUM = 8;
+export declare const SPACING_LARGE = 12;
+export declare const SPACING_EXTRA_LARGE = 16;
+export declare const BORDER_RADIUS_BASE = 4;
+export declare const FONT_SIZE_BASE = 16;
+export declare const FONT_SIZE_LARGE = 18;
+export declare const LINE_HEIGHT_BASE: number;
+export declare const LINE_HEIGHT_LARGE: number;
+export declare const FONT_WEIGHT_BASE = "400";
+export declare const ICON_BUTTON_SIZE = 20;
+export declare const ICON_BUTTON_HIT_SLOP = 10;
+export declare const MESSAGE_SHADOW_HEIGHT = 2;
+export declare const MESSAGE_SHADOW_WIDTH = 2;
+export declare const MESSAGE_SHADOW_OPACITY = 0.1;
+export declare const MESSAGE_SHADOW_RADIUS = 2;
+export declare const MESSAGE_ELEVATION = 3;
+export declare const BUTTON_PRESSED_OPACITY = 0.8;
+export declare const IN_APP_MESSAGING_TEST_ID: {
+    BODY: string;
+    CLOSE_BUTTON: string;
+    HEADER: string;
+    IMAGE: string;
+    PRIMARY_BUTTON: string;
+    SECONDARY_BUTTON: string;
+};