@aws-amplify/ui-react-notifications 2.2.8 → 2.2.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +25 -15
- package/dist/esm/version.mjs +1 -1
- package/dist/index.js +1 -1
- package/dist/types/components/InAppMessaging/Backdrop/Backdrop.d.ts +1 -1
- package/dist/types/components/InAppMessaging/Backdrop/types.d.ts +1 -1
- package/dist/types/components/InAppMessaging/Backdrop/withBackdrop.d.ts +1 -1
- package/dist/types/components/InAppMessaging/BannerMessage/BannerMessage.d.ts +1 -1
- package/dist/types/components/InAppMessaging/BannerMessage/index.d.ts +1 -1
- package/dist/types/components/InAppMessaging/BannerMessage/types.d.ts +2 -2
- package/dist/types/components/InAppMessaging/CloseIconButton/CloseIconButton.d.ts +1 -1
- package/dist/types/components/InAppMessaging/CloseIconButton/types.d.ts +1 -1
- package/dist/types/components/InAppMessaging/FullScreenMessage/FullScreenMessage.d.ts +1 -1
- package/dist/types/components/InAppMessaging/FullScreenMessage/index.d.ts +1 -1
- package/dist/types/components/InAppMessaging/FullScreenMessage/types.d.ts +2 -2
- package/dist/types/components/InAppMessaging/InAppMessageDisplay/InAppMessageDisplay.d.ts +1 -1
- package/dist/types/components/InAppMessaging/InAppMessageDisplay/handleMessageLinkAction.d.ts +1 -1
- package/dist/types/components/InAppMessaging/InAppMessageDisplay/index.d.ts +1 -1
- package/dist/types/components/InAppMessaging/InAppMessageDisplay/types.d.ts +4 -4
- package/dist/types/components/InAppMessaging/MessageLayout/MessageLayout.d.ts +1 -1
- package/dist/types/components/InAppMessaging/MessageLayout/types.d.ts +3 -3
- package/dist/types/components/InAppMessaging/MessageLayout/utils.d.ts +2 -2
- package/dist/types/components/InAppMessaging/ModalMessage/ModalMessage.d.ts +1 -1
- package/dist/types/components/InAppMessaging/ModalMessage/index.d.ts +1 -1
- package/dist/types/components/InAppMessaging/ModalMessage/types.d.ts +2 -2
- package/dist/types/components/InAppMessaging/hooks/index.d.ts +2 -1
- package/dist/types/components/InAppMessaging/hooks/useMessageImage/useMessageImage.d.ts +2 -2
- package/dist/types/components/InAppMessaging/hooks/useMessageProps/index.d.ts +1 -1
- package/dist/types/components/InAppMessaging/hooks/useMessageProps/types.d.ts +1 -1
- package/dist/types/components/InAppMessaging/hooks/useMessageProps/useMessageProps.d.ts +2 -2
- package/dist/types/components/InAppMessaging/hooks/useMessageProps/utils.d.ts +2 -2
- package/dist/types/components/InAppMessaging/index.d.ts +7 -5
- package/dist/types/components/InAppMessaging/withInAppMessaging/withInAppMessaging.d.ts +1 -1
- package/dist/types/version.d.ts +1 -1
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -1,23 +1,33 @@
|
|
|
1
|
-
# Amplify UI
|
|
1
|
+
# Amplify UI React Notifications
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
The React Notifications package provides components for in-app messaging in Amplify connected applications.
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
2. Primitive components that create consistency across Amplify UI and allow you to build complete applications that fit your brand, like Buttons and Badges.
|
|
7
|
-
3. Data-bound components that make it easy to display dynamic data, like DataStoreCollections.
|
|
8
|
-
4. Theming capabilities that allow you to customize the appearance of Amplify UI to match your brand.
|
|
5
|
+
## Contents
|
|
9
6
|
|
|
10
|
-
|
|
7
|
+
### Core Components
|
|
11
8
|
|
|
12
|
-
-
|
|
9
|
+
- `InAppMessageDisplay` - Component for displaying in-app messages
|
|
10
|
+
- `withInAppMessaging` - Higher-order component for adding in-app messaging capabilities
|
|
13
11
|
|
|
14
|
-
|
|
12
|
+
### Providers and Hooks
|
|
15
13
|
|
|
16
|
-
-
|
|
17
|
-
-
|
|
18
|
-
- **Accessible** Amplify UI components follow [WCAG](https://www.w3.org/WAI/standards-guidelines/wcag/) and [WAI-ARIA](https://www.w3.org/TR/wai-aria-1.2/) best practices and guidelines such as color contrast, keyboard navigation, accessible labels, and focus management.
|
|
19
|
-
- **Primitive components (React only right now)** Primitive components are used in the connected components, like Authenticator, you can also customize them and use them to build the rest of your UI.
|
|
14
|
+
- `InAppMessagingProvider` - Provider component for in-app messaging context
|
|
15
|
+
- `useInAppMessaging` - Hook for accessing in-app messaging functionality
|
|
20
16
|
|
|
21
|
-
|
|
17
|
+
### Props Types
|
|
22
18
|
|
|
23
|
-
|
|
19
|
+
- `BannerMessageProps` - Props for banner style messages
|
|
20
|
+
- `FullScreenMessageProps` - Props for full-screen style messages
|
|
21
|
+
- `ModalMessageProps` - Props for modal style messages
|
|
22
|
+
- `MessageComponents` - Types for message components
|
|
23
|
+
|
|
24
|
+
### Type Definitions
|
|
25
|
+
|
|
26
|
+
- `InAppMessage` - Core message type definition
|
|
27
|
+
- `InAppMessageAction` - Type for message actions
|
|
28
|
+
- `InAppMessageButton` - Type for message buttons
|
|
29
|
+
- `InAppMessageContent` - Type for message content
|
|
30
|
+
- `InAppMessageImage` - Type for message images
|
|
31
|
+
- `InAppMessageLayout` - Type for message layouts
|
|
32
|
+
- `InAppMessageStyle` - Type for message styling
|
|
33
|
+
- `InAppMessageTextAlign` - Type for text alignment options
|
package/dist/esm/version.mjs
CHANGED
package/dist/index.js
CHANGED
|
@@ -332,7 +332,7 @@ const handleMessageLinkAction = (input) => {
|
|
|
332
332
|
window.open(input);
|
|
333
333
|
};
|
|
334
334
|
|
|
335
|
-
const VERSION = '2.2.
|
|
335
|
+
const VERSION = '2.2.9';
|
|
336
336
|
|
|
337
337
|
// TODO: replace below components incrementally as they become available
|
|
338
338
|
function CarouselMessage(_) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { BackdropProps } from './types';
|
|
2
|
+
import type { BackdropProps } from './types';
|
|
3
3
|
export declare const BACKDROP_TEST_ID = "inappmessaging-backdrop";
|
|
4
4
|
export declare function Backdrop({ onClick, ...rest }: BackdropProps): React.JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { BannerMessage } from './BannerMessage';
|
|
2
|
-
export { BannerMessageProps } from './types';
|
|
2
|
+
export type { BannerMessageProps } from './types';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { BannerMessageCommonProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { MessageOverrideStyle } from '../hooks';
|
|
1
|
+
import type { BannerMessageCommonProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { MessageOverrideStyle } from '../hooks';
|
|
3
3
|
type BannerMessageAlignment = 'left' | 'center' | 'right';
|
|
4
4
|
export interface BannerMessageProps extends BannerMessageCommonProps<MessageOverrideStyle | undefined> {
|
|
5
5
|
alignment?: BannerMessageAlignment;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { CloseIconButtonProps } from './types';
|
|
2
|
+
import type { CloseIconButtonProps } from './types';
|
|
3
3
|
export declare function CloseIconButton({ className, dismissButtonLabel, onClick, style, ...rest }: CloseIconButtonProps): React.JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { FullScreenMessage } from './FullScreenMessage';
|
|
2
|
-
export { FullScreenMessageProps } from './types';
|
|
2
|
+
export type { FullScreenMessageProps } from './types';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FullScreenMessageCommonProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { MessageOverrideStyle } from '../hooks';
|
|
1
|
+
import type { FullScreenMessageCommonProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { MessageOverrideStyle } from '../hooks';
|
|
3
3
|
export interface FullScreenMessageProps extends FullScreenMessageCommonProps<MessageOverrideStyle | undefined> {
|
|
4
4
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { InAppMessageDisplayProps } from './types';
|
|
2
|
+
import type { InAppMessageDisplayProps } from './types';
|
|
3
3
|
declare function InAppMessageDisplay({ components: overrideComponents, }: InAppMessageDisplayProps): React.JSX.Element;
|
|
4
4
|
declare namespace InAppMessageDisplay {
|
|
5
5
|
var BannerMessage: typeof import("../BannerMessage").BannerMessage;
|
package/dist/types/components/InAppMessaging/InAppMessageDisplay/handleMessageLinkAction.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { HandleMessageLinkAction } from '@aws-amplify/ui-react-core-notifications';
|
|
1
|
+
import type { HandleMessageLinkAction } from '@aws-amplify/ui-react-core-notifications';
|
|
2
2
|
declare const handleMessageLinkAction: HandleMessageLinkAction;
|
|
3
3
|
export default handleMessageLinkAction;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { default as InAppMessageDisplay } from './InAppMessageDisplay';
|
|
2
|
-
export { MessageComponents } from './types';
|
|
2
|
+
export type { MessageComponents } from './types';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { BannerMessageComponent, CarouselMessageComponent, FullScreenMessageComponent, ModalMessageComponent } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { BannerMessageProps } from '../BannerMessage';
|
|
3
|
-
import { FullScreenMessageProps } from '../FullScreenMessage';
|
|
4
|
-
import { ModalMessageProps } from '../ModalMessage';
|
|
1
|
+
import type { BannerMessageComponent, CarouselMessageComponent, FullScreenMessageComponent, ModalMessageComponent } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { BannerMessageProps } from '../BannerMessage';
|
|
3
|
+
import type { FullScreenMessageProps } from '../FullScreenMessage';
|
|
4
|
+
import type { ModalMessageProps } from '../ModalMessage';
|
|
5
5
|
type BannerStyle = BannerMessageProps['style'];
|
|
6
6
|
type CarouselStyle = any;
|
|
7
7
|
type FullScreenStyle = FullScreenMessageProps['style'];
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { MessageLayoutProps } from './types';
|
|
2
|
+
import type { MessageLayoutProps } from './types';
|
|
3
3
|
export declare function MessageLayout({ body, buttonSize, hasRenderableImage, header, image, onClose, orientation, primaryButton, secondaryButton, styles, }: MessageLayoutProps): React.JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { MessageComponentBaseProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { ButtonProps } from '@aws-amplify/ui-react';
|
|
3
|
-
import { MessageComponentStyles, MessageOverrideStyle, UseMessageProps } from '../hooks';
|
|
1
|
+
import type { MessageComponentBaseProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { ButtonProps } from '@aws-amplify/ui-react';
|
|
3
|
+
import type { MessageComponentStyles, MessageOverrideStyle, UseMessageProps } from '../hooks';
|
|
4
4
|
type MessageLayoutOrientation = 'horizontal' | 'vertical';
|
|
5
5
|
export type MessageLayoutButtonModifier = 'dark' | 'light';
|
|
6
6
|
export interface MessageLayoutProps extends Omit<MessageComponentBaseProps<MessageOverrideStyle>, 'style'>, Omit<UseMessageProps, 'shouldRenderMessage' | 'styles'> {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { MessageComponentStyles } from '../hooks/useMessageProps';
|
|
2
|
-
import { MessageLayoutButtonModifier } from './types';
|
|
1
|
+
import type { MessageComponentStyles } from '../hooks/useMessageProps';
|
|
2
|
+
import type { MessageLayoutButtonModifier } from './types';
|
|
3
3
|
/**
|
|
4
4
|
* Utility for determining the class modifier for an In-App Messaging button
|
|
5
5
|
* based on its background color
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { ModalMessage } from './ModalMessage';
|
|
2
|
-
export { ModalMessageProps } from './types';
|
|
2
|
+
export type { ModalMessageProps } from './types';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ModalMessageCommonProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { MessageOverrideStyle } from '../hooks';
|
|
1
|
+
import type { ModalMessageCommonProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { MessageOverrideStyle } from '../hooks';
|
|
3
3
|
export interface ModalMessageProps extends ModalMessageCommonProps<MessageOverrideStyle | undefined> {
|
|
4
4
|
}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export { useMessageImage } from './useMessageImage';
|
|
2
|
-
export { MessageComponentStyles, MessageOverrideStyle,
|
|
2
|
+
export type { MessageComponentStyles, MessageOverrideStyle, UseMessageProps, } from './useMessageProps';
|
|
3
|
+
export { useMessageProps } from './useMessageProps';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { InAppMessageImage } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { UseMessageImage } from './types';
|
|
1
|
+
import type { InAppMessageImage } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { UseMessageImage } from './types';
|
|
3
3
|
/**
|
|
4
4
|
* Handles prefetching for message images
|
|
5
5
|
*
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { default as useMessageProps } from './useMessageProps';
|
|
2
|
-
export { MessageComponentStyles, MessageOverrideStyle, UseMessageProps, } from './types';
|
|
2
|
+
export type { MessageComponentStyles, MessageOverrideStyle, UseMessageProps, } from './types';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { MessageComponentBaseProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { MessageOverrideStyle, UseMessageProps } from './types';
|
|
1
|
+
import type { MessageComponentBaseProps } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { MessageOverrideStyle, UseMessageProps } from './types';
|
|
3
3
|
/**
|
|
4
4
|
* Handle common message UI component prop logic including render booleans, and
|
|
5
5
|
* style resolving
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { MessageComponentBaseProps, MessagePayloadStyle } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
-
import { MessageComponentStyles, MessageStyleParams } from './types';
|
|
1
|
+
import type { MessageComponentBaseProps, MessagePayloadStyle } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
import type { MessageComponentStyles, MessageStyleParams } from './types';
|
|
3
3
|
/**
|
|
4
4
|
* Utility for extracting message payload style
|
|
5
5
|
*
|
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
export { InAppMessage, InAppMessageAction, InAppMessageButton, InAppMessageContent, InAppMessageImage, InAppMessageLayout,
|
|
2
|
-
export {
|
|
3
|
-
export {
|
|
4
|
-
export {
|
|
5
|
-
export {
|
|
1
|
+
export type { InAppMessage, InAppMessageAction, InAppMessageButton, InAppMessageContent, InAppMessageImage, InAppMessageLayout, InAppMessageStyle, InAppMessageTextAlign, } from '@aws-amplify/ui-react-core-notifications';
|
|
2
|
+
export { InAppMessagingProvider, useInAppMessaging, } from '@aws-amplify/ui-react-core-notifications';
|
|
3
|
+
export type { BannerMessageProps } from './BannerMessage';
|
|
4
|
+
export type { FullScreenMessageProps } from './FullScreenMessage';
|
|
5
|
+
export type { MessageComponents } from './InAppMessageDisplay';
|
|
6
|
+
export { InAppMessageDisplay } from './InAppMessageDisplay';
|
|
7
|
+
export type { ModalMessageProps } from './ModalMessage';
|
|
6
8
|
export { withInAppMessaging } from './withInAppMessaging';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { MessageComponents } from '../InAppMessageDisplay';
|
|
2
|
+
import type { MessageComponents } from '../InAppMessageDisplay';
|
|
3
3
|
export default function withInAppMessaging<Props = {}>(Component: React.ComponentType<Props>, options?: {
|
|
4
4
|
components?: MessageComponents;
|
|
5
5
|
}): (props: Props) => React.JSX.Element;
|
package/dist/types/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const VERSION = "2.2.
|
|
1
|
+
export declare const VERSION = "2.2.9";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aws-amplify/ui-react-notifications",
|
|
3
|
-
"version": "2.2.
|
|
3
|
+
"version": "2.2.9",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"module": "dist/esm/index.mjs",
|
|
6
6
|
"exports": {
|
|
@@ -39,10 +39,10 @@
|
|
|
39
39
|
"typecheck": "tsc --noEmit"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@aws-amplify/ui": "6.10.
|
|
43
|
-
"@aws-amplify/ui-react": "6.11.
|
|
44
|
-
"@aws-amplify/ui-react-core": "3.4.
|
|
45
|
-
"@aws-amplify/ui-react-core-notifications": "2.2.
|
|
42
|
+
"@aws-amplify/ui": "6.10.3",
|
|
43
|
+
"@aws-amplify/ui-react": "6.11.2",
|
|
44
|
+
"@aws-amplify/ui-react-core": "3.4.3",
|
|
45
|
+
"@aws-amplify/ui-react-core-notifications": "2.2.9",
|
|
46
46
|
"tinycolor2": "1.4.2"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|