@aws-amplify/ui-react-core 1.0.4 → 2.0.0

package/dist/index.js

@@ -1,6 +1,348 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAuthenticator = exports.AuthenticatorProvider = void 0;
-var Authenticator_1 = require("./Authenticator");
-Object.defineProperty(exports, "AuthenticatorProvider", { enumerable: true, get: function () { return Authenticator_1.AuthenticatorProvider; } });
-Object.defineProperty(exports, "useAuthenticator", { enumerable: true, get: function () { return Authenticator_1.useAuthenticator; } });
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var react = require('@xstate/react');
+var ui = require('@aws-amplify/ui');
+var awsAmplify = require('aws-amplify');
+var isEmpty = require('lodash/isEmpty');
+var isObject = require('lodash/isObject');
+var notifications = require('@aws-amplify/notifications');
+var core = require('@aws-amplify/core');
+var isNil = require('lodash/isNil');
+var isString = require('lodash/isString');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var isEmpty__default = /*#__PURE__*/_interopDefaultLegacy(isEmpty);
+var isObject__default = /*#__PURE__*/_interopDefaultLegacy(isObject);
+var isNil__default = /*#__PURE__*/_interopDefaultLegacy(isNil);
+var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);
+
+/**
+ * AuthenticatorContext serves static reference to the auth machine service.
+ *
+ * https://xstate.js.org/docs/recipes/react.html#context-provider
+ */
+const AuthenticatorContext = React__default["default"].createContext(null);
+
+function AuthenticatorProvider({ children, }) {
+    /**
+     * Based on use cases, developer might already have added another Provider
+     * outside Authenticator. In that case, we sync the two providers by just
+     * passing the parent value.
+     *
+     * TODO(BREAKING): enforce only one provider in App tree
+     */
+    const parentProviderVal = React.useContext(AuthenticatorContext);
+    const service = react.useInterpret(ui.createAuthenticatorMachine);
+    const value = React.useMemo(() => (!parentProviderVal ? { service } : parentProviderVal), [parentProviderVal, service]);
+    const { service: activeService } = value;
+    React.useEffect(() => {
+        const unsubscribe = ui.listenToAuthHub(activeService);
+        return unsubscribe;
+    }, [activeService]);
+    return (jsxRuntime.jsx(AuthenticatorContext.Provider, Object.assign({ value: value }, { children: children })));
+}
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
+const USE_AUTHENTICATOR_ERROR = '`useAuthenticator` must be used inside an `Authenticator.Provider`.';
+const COMPONENT_ROUTE_KEYS = [
+    'signIn',
+    'signUp',
+    'forceNewPassword',
+    'confirmResetPassword',
+    'confirmSignIn',
+    'confirmSignUp',
+    'confirmVerifyUser',
+    'resetPassword',
+    'setupTOTP',
+    'verifyUser',
+];
+
+function isEmptyArray(value) {
+    return Array.isArray(value) && isEmpty__default["default"](value);
+}
+function areEmptyArrays(...values) {
+    return values.every(isEmptyArray);
+}
+function isEmptyObject(value) {
+    return isObject__default["default"](value) && !Array.isArray(value) && isEmpty__default["default"](value);
+}
+function areEmptyObjects(...values) {
+    return values.every(isEmptyObject);
+}
+
+const defaultComparator = () => false;
+/**
+ * Does an ordering and shallow comparison of each array value,
+ * plus a value equality check for empty objects and arrays.
+ */
+function areSelectorDepsEqual(currentDeps, nextDeps) {
+    if (currentDeps.length !== nextDeps.length) {
+        return false;
+    }
+    return currentDeps.every((currentDep, index) => {
+        const nextDep = nextDeps[index];
+        if (areEmptyArrays(currentDep, nextDep) ||
+            areEmptyObjects(currentDep, nextDep)) {
+            return true;
+        }
+        return currentDep === nextDep;
+    });
+}
+const getComparator = (selector) => (currentFacade, nextFacade) => {
+    const currentSelectorDeps = selector(currentFacade);
+    const nextSelectorDeps = selector(nextFacade);
+    // Shallow compare the array values
+    return areSelectorDepsEqual(currentSelectorDeps, nextSelectorDeps);
+};
+const getTotpSecretCodeCallback = (user) => function getTotpSecretCode() {
+    return __awaiter(this, void 0, void 0, function* () {
+        return yield awsAmplify.Auth.setupTOTP(user);
+    });
+};
+const isComponentRouteKey = (route) => COMPONENT_ROUTE_KEYS.some((componentRoute) => componentRoute === route);
+const flattenFormFields = (fields) => fields.flatMap(([name, options]) => (Object.assign({ name }, options)));
+/**
+ * Retrieves legacy form field values from state machine for routes that have fields
+ */
+const getLegacyFields = (route, state) => 
+// verifyUser is a component route, but does not have form fields
+isComponentRouteKey(route) && route !== 'verifyUser'
+    ? flattenFormFields(ui.getSortedFormFields(route, state))
+    : [];
+
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/connected-components/authenticator/headless#useauthenticator-hook)
+ */
+function useAuthenticator(selector) {
+    const context = React__default["default"].useContext(AuthenticatorContext);
+    if (!context) {
+        throw new Error(USE_AUTHENTICATOR_ERROR);
+    }
+    const { service } = context;
+    const { send } = service;
+    const xstateSelector = React.useCallback((state) => (Object.assign({}, ui.getServiceFacade({ send, state }))), [send]);
+    const comparator = selector ? getComparator(selector) : defaultComparator;
+    const facade = react.useSelector(service, xstateSelector, comparator);
+    const { route, user } = facade, rest = __rest(facade, ["route", "user"]);
+    // do not memoize output. `service.getSnapshot` reference remains stable preventing
+    // `fields` from updating with current form state on value changes
+    const serviceSnapshot = service.getSnapshot();
+    // legacy `formFields` values required until form state is removed from state machine
+    const fields = React.useMemo(() => getLegacyFields(route, serviceSnapshot), [route, serviceSnapshot]);
+    return Object.assign(Object.assign({}, rest), { getTotpSecretCode: getTotpSecretCodeCallback(user), route,
+        user,
+        /** @deprecated For internal use only */
+        fields });
+}
+
+const InAppMessagingContext = React.createContext(null);
+
+const { InAppMessaging: InAppMessaging$1 } = notifications.Notifications;
+function InAppMessagingProvider({ children, }) {
+    const [message, setMessage] = React.useState(null);
+    React.useEffect(() => {
+        const listener = InAppMessaging$1.onMessageReceived((message) => {
+            setMessage(message);
+        });
+        return listener.remove;
+    }, []);
+    const clearMessage = React.useCallback(() => {
+        setMessage(null);
+    }, []);
+    const value = React.useMemo(() => ({
+        clearMessage,
+        displayMessage: setMessage,
+        message,
+    }), [clearMessage, message]);
+    return (jsxRuntime.jsx(InAppMessagingContext.Provider, Object.assign({ value: value }, { children: children })));
+}
+
+/**
+ * Utility hook used to access the InAppMessagingContext values
+ *
+ * @returns {InAppMessagingContextType} InAppMessaging context values
+ */
+function useInAppMessaging() {
+    const inAppMessagingContext = React.useContext(InAppMessagingContext);
+    if (!inAppMessagingContext) {
+        throw new Error('InAppMessagingContext is empty, did you forget the InAppMessagingProvider?');
+    }
+    return inAppMessagingContext;
+}
+
+/**
+ * Utility component for rendering nothing.
+ */
+function RenderNothng(_) {
+    return null;
+}
+
+const logger$2 = new core.ConsoleLogger('Notifications.InAppMessaging');
+const positions = {
+    BOTTOM_BANNER: 'bottom',
+    MIDDLE_BANNER: 'middle',
+    TOP_BANNER: 'top',
+};
+const getPositionProp = (layout) => positions[layout];
+const getActionHandler = (actionParams, onMessageAction, onActionCallback) => ({
+    onAction() {
+        try {
+            onMessageAction(actionParams);
+        }
+        catch (e) {
+            logger$2.error(`Message action failure: ${e}`);
+        }
+        finally {
+            onActionCallback();
+        }
+    },
+});
+const getButtonProps = (_a, onMessageAction, onActionCallback) => {
+    var { action, url } = _a, baseButtonProps = __rest(_a, ["action", "url"]);
+    return (Object.assign(Object.assign({}, baseButtonProps), getActionHandler({ action, url }, onMessageAction, onActionCallback)));
+};
+const getContentProps = (content, onMessageAction, onActionCallback) => {
+    const props = {};
+    if (!content) {
+        return props;
+    }
+    const { primaryButton, secondaryButton } = content, restContent = __rest(content, ["primaryButton", "secondaryButton"]);
+    if (primaryButton) {
+        props.primaryButton = getButtonProps(primaryButton, onMessageAction, onActionCallback);
+    }
+    if (secondaryButton) {
+        props.secondaryButton = getButtonProps(secondaryButton, onMessageAction, onActionCallback);
+    }
+    return Object.assign(Object.assign({}, props), restContent);
+};
+
+const EMPTY_PROPS = Object.freeze({});
+const logger$1 = new core.ConsoleLogger('Notifications.InAppMessaging');
+const { InAppMessaging } = notifications.Notifications;
+/**
+ * Utility hook for parsing a message and retrieving its corresponding UI component and props
+ *
+ * @param {UseMessageParams} props - platform specific UI components, action handler, and styles
+ * @returns {UseMessage} message UI component and props
+ */
+function useMessage({ components, onMessageAction, }) {
+    const { clearMessage, message } = useInAppMessaging();
+    const { BannerMessage, CarouselMessage, FullScreenMessage, ModalMessage } = components;
+    if (isNil__default["default"](message)) {
+        return {
+            Component: RenderNothng,
+            props: EMPTY_PROPS,
+        };
+    }
+    const { content, layout } = message;
+    const onActionCallback = () => {
+        InAppMessaging.notifyMessageInteraction(message, notifications.InAppMessageInteractionEvent.MESSAGE_ACTION_TAKEN);
+        clearMessage();
+    };
+    const onClose = () => {
+        InAppMessaging.notifyMessageInteraction(message, notifications.InAppMessageInteractionEvent.MESSAGE_DISMISSED);
+        clearMessage();
+    };
+    const onDisplay = () => {
+        InAppMessaging.notifyMessageInteraction(message, notifications.InAppMessageInteractionEvent.MESSAGE_DISPLAYED);
+    };
+    switch (layout) {
+        case 'BOTTOM_BANNER':
+        case 'MIDDLE_BANNER':
+        case 'TOP_BANNER': {
+            const props = Object.assign(Object.assign({}, getContentProps(content === null || content === void 0 ? void 0 : content[0], onMessageAction, onActionCallback)), { layout,
+                onClose,
+                onDisplay, position: getPositionProp(layout) });
+            return { Component: BannerMessage, props };
+        }
+        case 'CAROUSEL': {
+            const props = {
+                data: content === null || content === void 0 ? void 0 : content.map((item) => getContentProps(item, onMessageAction, onActionCallback)),
+                layout,
+                onClose,
+                onDisplay,
+            };
+            return { Component: CarouselMessage, props };
+        }
+        case 'FULL_SCREEN': {
+            const props = Object.assign(Object.assign({}, getContentProps(content === null || content === void 0 ? void 0 : content[0], onMessageAction, onActionCallback)), { layout,
+                onClose,
+                onDisplay });
+            return { Component: FullScreenMessage, props };
+        }
+        case 'MODAL': {
+            const props = Object.assign(Object.assign({}, getContentProps(content === null || content === void 0 ? void 0 : content[0], onMessageAction, onActionCallback)), { layout,
+                onClose,
+                onDisplay });
+            return { Component: ModalMessage, props };
+        }
+        default: {
+            logger$1.info(`Received unknown InAppMessage layout: ${layout}`);
+            return {
+                Component: RenderNothng,
+                props: EMPTY_PROPS,
+            };
+        }
+    }
+}
+
+const logger = new core.ConsoleLogger('Notifications.InAppMessaging');
+const handleMessageAction = ({ action, handleMessageLinkAction, url, }) => {
+    logger.info(`Handle action: ${action}`);
+    if (action === 'LINK' || action === 'DEEP_LINK') {
+        if (!isString__default["default"](url)) {
+            logger.warn(`url must be of type string: ${url}`);
+            return;
+        }
+        handleMessageLinkAction(url);
+    }
+};
+
+exports.AuthenticatorProvider = AuthenticatorProvider;
+exports.InAppMessagingProvider = InAppMessagingProvider;
+exports.handleMessageAction = handleMessageAction;
+exports.useAuthenticator = useAuthenticator;
+exports.useInAppMessaging = useInAppMessaging;
+exports.useMessage = useMessage;

package/dist/types/Authenticator/hooks/useAuthenticator/__tests__/useAuthenticator.spec.d.ts

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

package/dist/types/Authenticator/hooks/useAuthenticator/__tests__/utils.spec.d.ts

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

package/dist/types/Authenticator/hooks/useAuthenticator/types.d.ts

@@ -1,4 +1,4 @@
-import { AuthMachineSend, AuthMachineState, AuthenticatorServiceFacade, LegacyFormFieldOptions } from '@aws-amplify/ui';
+import { AuthenticatorServiceFacade, LegacyFormFieldOptions } from '@aws-amplify/ui';
 /**
  * These are the "facades" that we provide, which contains contexts respective
  * to current authenticator state.
@@ -14,18 +14,10 @@ export declare type AuthenticatorLegacyFields = LegacyFormFieldOptions[];
  * desired value(s) that should trigger re-render.
  */
 export declare type Selector = (context: AuthenticatorMachineContext) => AuthenticatorMachineContext[AuthenticatorMachineContextKey][];
-declare type InternalAuthenticatorContext = {
-    _state: AuthMachineState;
-    _send: AuthMachineSend;
-};
 export interface UseAuthenticator extends AuthenticatorServiceFacade {
     getTotpSecretCode: () => Promise<string>;
     /** @deprecated For internal use only */
     fields: AuthenticatorLegacyFields;
-    /** @deprecated For internal use only */
-    _send: InternalAuthenticatorContext['_send'];
-    /** @deprecated For internal use only */
-    _state: InternalAuthenticatorContext['_state'];
 }
 export declare type Comparator = (currentFacade: AuthenticatorServiceFacade, nextFacade: AuthenticatorServiceFacade) => boolean;
 export {};

package/dist/types/InAppMessaging/context/InAppMessagingContext/InAppMessagingContext.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { Message } from '../../types';
+export interface InAppMessagingContextType {
+    clearMessage: () => void;
+    displayMessage: (message: Message) => void;
+    message: Message | null;
+}
+declare const InAppMessagingContext: import("react").Context<InAppMessagingContextType | null>;
+export default InAppMessagingContext;

package/dist/types/InAppMessaging/context/InAppMessagingContext/index.d.ts

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

package/dist/types/InAppMessaging/context/InAppMessagingProvider/InAppMessagingProvider.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export interface InAppMessagingProviderProps {
+    children: ReactNode;
+}
+export default function InAppMessagingProvider({ children, }: InAppMessagingProviderProps): JSX.Element;

package/dist/types/InAppMessaging/context/InAppMessagingProvider/__tests__/InAppMessagingProvider.spec.d.ts

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

package/dist/types/InAppMessaging/context/InAppMessagingProvider/index.d.ts

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

package/dist/types/InAppMessaging/context/index.d.ts

@@ -0,0 +1,2 @@
+export * from './InAppMessagingContext';
+export * from './InAppMessagingProvider';

package/dist/types/InAppMessaging/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useInAppMessaging';
+export * from './useMessage';

package/dist/types/InAppMessaging/hooks/useInAppMessaging/__tests__/useInAppMessaging.spec.d.ts

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

package/dist/types/InAppMessaging/hooks/useInAppMessaging/index.d.ts

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

package/dist/types/InAppMessaging/hooks/useInAppMessaging/useInAppMessaging.d.ts

@@ -0,0 +1,7 @@
+import { InAppMessagingContextType } from '../../context';
+/**
+ * Utility hook used to access the InAppMessagingContext values
+ *
+ * @returns {InAppMessagingContextType} InAppMessaging context values
+ */
+export default function useInAppMessaging(): InAppMessagingContextType;

package/dist/types/InAppMessaging/hooks/useMessage/__tests__/useMessage.spec.d.ts

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

package/dist/types/InAppMessaging/hooks/useMessage/__tests__/utils.spec.d.ts

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

package/dist/types/InAppMessaging/hooks/useMessage/index.d.ts

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

package/dist/types/InAppMessaging/hooks/useMessage/types.d.ts

@@ -0,0 +1,18 @@
+import { BannerMessageCommonProps, BannerMessageComponent, CarouselMessageCommonProps, CarouselMessageComponent, FullScreenMessageCommonProps, FullScreenMessageComponent, ModalMessageCommonProps, ModalMessageComponent, OnMessageAction } from '../../types';
+interface Components<PlatformStyleProps> {
+    BannerMessage: BannerMessageComponent<PlatformStyleProps>;
+    CarouselMessage: CarouselMessageComponent<PlatformStyleProps>;
+    FullScreenMessage: FullScreenMessageComponent<PlatformStyleProps>;
+    ModalMessage: ModalMessageComponent<PlatformStyleProps>;
+}
+export interface UseMessageParams<PlatformStyleProps> {
+    components: Components<PlatformStyleProps>;
+    onMessageAction: OnMessageAction;
+}
+declare type MessageComponent<PlatformStyleProps> = BannerMessageComponent<PlatformStyleProps> | CarouselMessageComponent<PlatformStyleProps> | FullScreenMessageComponent<PlatformStyleProps> | ModalMessageComponent<PlatformStyleProps>;
+declare type MessageProps<PlatformStyleProps> = BannerMessageCommonProps<PlatformStyleProps> | CarouselMessageCommonProps<PlatformStyleProps> | FullScreenMessageCommonProps<PlatformStyleProps> | ModalMessageCommonProps<PlatformStyleProps>;
+export interface UseMessage<PlatformStyleProps> {
+    Component: MessageComponent<PlatformStyleProps>;
+    props: MessageProps<PlatformStyleProps>;
+}
+export {};

package/dist/types/InAppMessaging/hooks/useMessage/useMessage.d.ts

@@ -0,0 +1,9 @@
+import { UseMessage, UseMessageParams } from './types';
+export declare const EMPTY_PROPS: Readonly<{}>;
+/**
+ * Utility hook for parsing a message and retrieving its corresponding UI component and props
+ *
+ * @param {UseMessageParams} props - platform specific UI components, action handler, and styles
+ * @returns {UseMessage} message UI component and props
+ */
+export default function useMessage<PlatformStyleProps>({ components, onMessageAction, }: UseMessageParams<PlatformStyleProps>): UseMessage<PlatformStyleProps>;

package/dist/types/InAppMessaging/hooks/useMessage/utils.d.ts

@@ -0,0 +1,9 @@
+import { BannerMessageLayouts, MessageAction, MessageComponentPosition, MessageContent, MessageContentProps, OnMessageAction } from '../../types';
+export declare const getPositionProp: (layout: BannerMessageLayouts) => MessageComponentPosition;
+export declare const getActionHandler: (actionParams: {
+    action: MessageAction;
+    url?: string;
+}, onMessageAction: OnMessageAction, onActionCallback: () => void) => {
+    onAction: () => void;
+};
+export declare const getContentProps: (content: MessageContent, onMessageAction: OnMessageAction, onActionCallback: () => void) => MessageContentProps;

package/dist/{esm/Authenticator/index.js → types/InAppMessaging/index.d.ts}

@@ -1,2 +1,4 @@
-export * from './context';
 export * from './hooks';
+export * from './context';
+export * from './types';
+export * from './utils';

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

@@ -0,0 +1,52 @@
+import React from 'react';
+import { InAppMessage, InAppMessageAction, InAppMessageButton, InAppMessageContent, InAppMessageImage, InAppMessageLayout, InAppMessageStyle, InAppMessageTextAlign } from '@aws-amplify/notifications';
+export declare type Message = InAppMessage;
+export declare type MessageAction = InAppMessageAction;
+export declare type MessageButton = InAppMessageButton;
+export declare type MessageContent = InAppMessageContent;
+export declare type MessageImage = InAppMessageImage;
+export declare type MessageLayout = InAppMessageLayout;
+export declare type MessageStyle = InAppMessageStyle;
+export declare type MessageTextAlign = InAppMessageTextAlign;
+export declare type OnMessageAction = (params: {
+    action: MessageAction;
+    url?: string | undefined;
+}) => void;
+export interface MessageButtonProps extends Omit<MessageButton, 'action' | 'url'> {
+    onAction: () => void;
+}
+export interface MessageContentProps extends Omit<MessageContent, 'primaryButton' | 'secondaryButton'> {
+    primaryButton?: MessageButtonProps;
+    secondaryButton?: MessageButtonProps;
+}
+export interface MessageComponentBaseProps<Style = unknown> extends MessageCommonProps<Style>, MessageContentProps {
+}
+export interface MessageCommonProps<PlatformStyleProps> {
+    layout: MessageLayout;
+    onClose?: () => void;
+    onDisplay?: () => void;
+    style?: PlatformStyleProps;
+}
+export declare type BannerMessageLayouts = 'BOTTOM_BANNER' | 'MIDDLE_BANNER' | 'TOP_BANNER';
+export declare type MessageComponentPosition = 'bottom' | 'middle' | 'top';
+export interface BannerMessageCommonProps<PlatformStyleProps> extends MessageCommonProps<PlatformStyleProps>, MessageContentProps {
+    position?: MessageComponentPosition;
+}
+export interface CarouselMessageCommonProps<PlatformStyleProps> extends MessageCommonProps<PlatformStyleProps> {
+    data?: MessageContentProps[];
+}
+export interface FullScreenMessageCommonProps<PlatformStyleProps> extends MessageCommonProps<PlatformStyleProps>, MessageContentProps {
+}
+export interface ModalMessageCommonProps<PlatformStyleProps> extends MessageCommonProps<PlatformStyleProps>, MessageContentProps {
+}
+export interface MessagePayloadStyle {
+    body?: MessageStyle;
+    container?: MessageStyle;
+    header?: MessageStyle;
+    primaryButton?: MessageStyle;
+    secondaryButton?: MessageStyle;
+}
+export declare type BannerMessageComponent<PlatformStyleProps> = React.ComponentType<BannerMessageCommonProps<PlatformStyleProps>>;
+export declare type CarouselMessageComponent<PlatformStyleProps> = React.ComponentType<CarouselMessageCommonProps<PlatformStyleProps>>;
+export declare type FullScreenMessageComponent<PlatformStyleProps> = React.ComponentType<FullScreenMessageCommonProps<PlatformStyleProps>>;
+export declare type ModalMessageComponent<PlatformStyleProps> = React.ComponentType<ModalMessageCommonProps<PlatformStyleProps>>;

package/dist/types/InAppMessaging/utils/__tests__/handleMessageAction.spec.d.ts

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

package/dist/types/InAppMessaging/utils/handleMessageAction.d.ts

@@ -0,0 +1,9 @@
+import { MessageAction } from '../types';
+export declare type HandleMessageLinkAction = (url: string) => void | Promise<void>;
+interface HandleMessageActionParams {
+    action: MessageAction;
+    handleMessageLinkAction: HandleMessageLinkAction;
+    url: string | undefined;
+}
+declare const handleMessageAction: ({ action, handleMessageLinkAction, url, }: HandleMessageActionParams) => void;
+export default handleMessageAction;

package/dist/types/InAppMessaging/utils/index.d.ts

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

package/dist/types/__tests__/index.spec.d.ts

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

package/dist/types/components/RenderNothing/RenderNothing.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Utility component for rendering nothing.
+ */
+export default function RenderNothng<Props>(_: Props): JSX.Element | null;

package/dist/types/components/RenderNothing/__tests__/RenderNothing.spec.d.ts

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

package/dist/types/components/RenderNothing/index.d.ts

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

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

@@ -0,0 +1 @@
+export { RenderNothing } from './RenderNothing';

package/dist/types/index.d.ts

@@ -1 +1,2 @@
 export { AuthenticatorProvider, useAuthenticator, UseAuthenticator, } from './Authenticator';
+export { BannerMessageCommonProps, BannerMessageComponent, CarouselMessageCommonProps, CarouselMessageComponent, FullScreenMessageCommonProps, FullScreenMessageComponent, handleMessageAction, HandleMessageLinkAction, InAppMessagingProvider, MessageButtonProps, MessageCommonProps, MessageComponentBaseProps, MessageContentProps, MessageImage, MessageLayout, MessagePayloadStyle, MessageTextAlign, ModalMessageCommonProps, ModalMessageComponent, OnMessageAction, useInAppMessaging, useMessage, } from './InAppMessaging';

package/dist/types/utils/__tests__/index.spec.d.ts

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

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "@aws-amplify/ui-react-core",
-  "version": "1.0.4",
+  "version": "2.0.0",
   "main": "dist/index.js",
   "module": "dist/esm/index.js",
+  "react-native": "dist/index.js",
   "exports": {
     ".": {
       "import": "./dist/esm/index.js",
@@ -19,25 +20,26 @@
   "scripts": {
     "clean": "rimraf dist node_modules",
     "prebuild": "rimraf dist",
-    "build": "yarn build:cjs && yarn build:esm",
-    "build:cjs": "tsc --project tsconfig.cjs.json",
-    "build:esm": "tsc --project tsconfig.esm.json",
+    "build": "rollup --config",
     "dev": "yarn build:esm --watch",
     "lint": "tsc --noEmit && eslint src",
     "test": "jest --coverage --verbose",
     "test:watch": "yarn test --watch"
   },
   "dependencies": {
-    "@aws-amplify/ui": "4.0.1",
+    "@aws-amplify/ui": "5.0.0",
     "@xstate/react": "3.0.1",
+    "lodash": "4.17.21",
     "xstate": "^4.33.6"
   },
   "peerDependencies": {
-    "aws-amplify": "3.x.x || 4.x.x",
-    "react": ">= 16.8.0",
-    "react-dom": ">= 16.8.0"
+    "aws-amplify": "5.x.x",
+    "react": ">= 16.14.0",
+    "react-dom": ">= 16.14.0"
   },
   "devDependencies": {
+    "@rollup/plugin-commonjs": "^22.0.1",
+    "@rollup/plugin-typescript": "^8.3.1",
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^7.0.2",
     "@types/jest": "^26.0.23",
@@ -60,8 +62,11 @@
     "react-dom": "^17.0.2",
     "react-test-renderer": "^17.0.2",
     "rimraf": "^3.0.2",
+    "rollup": "^2.70.0",
+    "rollup-plugin-node-externals": "^4.1.1",
     "ts-jest": "^27.1.3",
     "ts-node": "^10.2.1",
     "typescript": "^4.3.2"
-  }
+  },
+  "sideEffects": false
 }