You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
**What are the major benefits of the new version of Amplify UI?**
93
+
**What are the major benefits of Amplify UI?**
93
94
94
95
-**Better developer experience** Connected-components like Authenticator are being written with framework-specific implementations so that they follow framework conventions and are easier to integrate into your application.
95
96
-**Endlessly customizable** Every detail of Amplify UI is customizable to match your brand. Style all of Amplify UI with themes, override components with your own, or build your own UI and use Amplify for complex state management.
96
97
-**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.
97
98
-**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.
98
99
99
-
**Why are you building primitives?**
100
-
101
-
We are building more cloud-connected components and want to have consistency between them, while also allowing you to build your UI with the same primitives so you can have a consistent UI development experience.
102
-
103
100
**How does this compare to other UI libraries like Tailwind, Chakra, Supabase, or Material-UI?**
104
101
105
102
Amplify UI consists of both primitive components like Buttons, Badges, and Cards, as well as cloud-connected and data-bound components like the Authenticator. We are taking heavy inspiration from open-source frameworks like [Tailwind](https://tailwindcss.com/), [Chakra](https://chakra-ui.com/), [Supabase](https://ui.supabase.io/), [Radix](https://www.radix-ui.com/), [Adobe Spectrum](https://react-spectrum.adobe.com/), [Material-UI](https://material-ui.com/), and others. In fact, one of the core ideas with the new Amplify UI is the ability to integrate seamlessly into _any_ application, including ones using those UI frameworks. For example, you can use Tailwind classes to style Amplify UI components or Chakra components like buttons inside Amplify connected-components like the Authenticator.
@@ -112,6 +109,6 @@ You can also use the above link to report a bug or a feature request for previou
112
109
113
110
As we continue to work on the new Amplify UI we will move UI-related issues in the amplify-js repository over here to work on them. We will continue to maintain major bug and security fixes for all existing UI packages and versions. New development for UI components will happen in this repository and eventually be published under the `@react` npm tag.
114
111
115
-
## Contributing
112
+
## We love contributors!!
116
113
117
-
-[CONTRIBUTING.md](/CONTRIBUTING.md)
114
+
See our contributing guide [CONTRIBUTING.md](/CONTRIBUTING.md) to help us scale Amplify UI!
[](https://www.npmjs.com/package/@aws-amplify/ui-angular)[](https://www.npmjs.com/package/@aws-amplify/ui-angular)
2
4
3
-
# Amplify UI
5
+
The Angular package provides components and utilities for building Amplify connected applications on Angular.
6
+
7
+
## Contents
4
8
5
-
Amplify UI is an open-source UI library with cloud-connected components that are endlessly customizable, accessible, and can integrate into _any_ application. Amplify UI consists of:
9
+
### Authenticator Component
6
10
7
-
1. Connected components that simplify complex cloud-connected workflows, like Authenticator.
8
-
2. Primitive components that create consistency across Amplify UI and allow you to build complete applications that fit your brand, like Buttons and Badges.
9
-
3. Data-bound components that make it easy to display dynamic data, like DataStoreCollections.
10
-
4. Theming capabilities that allow you to customize the appearance of Amplify UI to match your brand.
11
+
- Authentication component for Angular applications
11
12
12
13
## Angular Documentation
13
14
14
15
-https://ui.docs.amplify.aws/angular
15
-
16
-
## Features 🚀
17
-
18
-
-**Better developer experience** Connected-components like Authenticator are being written with framework-specific implementations so that they follow framework conventions and are easier to integrate into your application.
19
-
-**Endlessly customizable** Every detail of Amplify UI is customizable to match your brand. Style all of Amplify UI with themes, override components with your own, or build your own UI and use Amplify for complex state management.
20
-
-**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.
21
-
-**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.
22
-
23
-
## We love contributors!!
24
-
25
-
See our contributing guide [CONTRIBUTING.md](/CONTRIBUTING.md) to help us scale Amplify UI!
Amplify UI is an open-source UI library with cloud-connected components that are endlessly customizable, accessible, and can integrate into _any_ application. Amplify UI consists of:
3
+
The React AI package provides components and utilities for AI-powered conversations and interactions in Amplify connected applications.
4
4
5
-
1. Connected components that simplify complex cloud-connected workflows, like Authenticator.
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
-
##React Documentation
7
+
### Core Components
11
8
12
-
-https://ui.docs.amplify.aws/react
9
+
-`AIConversation` - Component for AI-powered conversations
10
+
-`createAIConversation` - Factory function for creating AI conversation components
11
+
12
+
### Utility Functions
13
13
14
-
## Features 🚀
14
+
-`createAIHooks` - Factory function for creating AI-related hooks
15
15
16
-
-**Better developer experience** Connected-components like Authenticator are being written with framework-specific implementations so that they follow framework conventions and are easier to integrate into your application.
17
-
-**Endlessly customizable** Every detail of Amplify UI is customizable to match your brand. Style all of Amplify UI with themes, override components with your own, or build your own UI and use Amplify for complex state management.
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.
16
+
### Type Definitions
20
17
21
-
## We love contributors!!
18
+
-`Avatars` - Type for avatar configurations
19
+
-`CustomAction` - Type for custom actions
20
+
-`ResponseComponent` - Type for response components
21
+
-`SuggestedPrompt` - Type for suggested prompts
22
+
-`ConversationMessage` - Type for conversation messages
23
+
-`ConversationMessageContent` - Type for conversation message content
24
+
-`SendMessage` - Type for send message function
25
+
-`SendMesageParameters` - Type for send message parameters
22
26
23
-
See our contributing guide [CONTRIBUTING.md](/CONTRIBUTING.md) to help us scale Amplify UI!
`@aws-amplify/ui-react-core-notifications` is a React platform agnostic utility library for Amplify UI internal usage in the `@aws-amplify/ui-react-notifications` package.
4
+
5
+
## Contents
6
+
7
+
### Providers and Hooks
8
+
9
+
-`InAppMessagingProvider` - Provider component for in-app messaging context
10
+
-`useInAppMessaging` - Hook for accessing in-app messaging functionality
11
+
-`useMessage` - Hook for accessing message functionality
12
+
-`handleMessageAction` - Utility function for handling message actions
13
+
14
+
### Type Definitions
15
+
16
+
-`InAppMessage` - Core message type definition
17
+
-`InAppMessageAction` - Type for message actions
18
+
-`InAppMessageButton` - Type for message buttons
19
+
-`InAppMessageContent` - Type for message content
20
+
-`InAppMessageImage` - Type for message images
21
+
-`InAppMessageLayout` - Type for message layouts
22
+
-`InAppMessageStyle` - Type for message styling
23
+
-`InAppMessageTextAlign` - Type for text alignment options
24
+
25
+
### Message Component Types
26
+
27
+
-`BannerMessageComponent` - Type for banner message components
28
+
-`CarouselMessageComponent` - Type for carousel message components
29
+
-`FullScreenMessageComponent` - Type for full-screen message components
30
+
-`ModalMessageComponent` - Type for modal message components
31
+
-`MessageButtonProps` - Props for message buttons
32
+
-`MessageCommonProps` - Common props for messages
33
+
-`MessageComponentBaseProps` - Base props for message components
34
+
-`MessageContentProps` - Props for message content
35
+
-`MessagePayloadStyle` - Style for message payload
`@aws-amplify/ui-react-core` is a React platform agnostic utility library for Amplify UI internal usage in `@aws-amplify/ui-react*` and `@aws-amplify/ui-react-native*` namespaced packages.
4
+
5
+
## Contents
6
+
7
+
### Authenticator
8
+
9
+
-`AuthenticatorProvider` - Provider component for Authenticator context
10
+
-`useAuthenticator` - Hook for accessing Authenticator functionality
11
+
-`useAuthenticatorRoute` - Hook for accessing Authenticator route information
12
+
-`useAuthenticatorInitMachine` - Hook for initializing Authenticator state machine
13
+
-`isAuthenticatorComponentRouteKey` - Utility function for checking route keys
14
+
-`resolveAuthenticatorComponents` - Utility function for resolving Authenticator components
15
+
16
+
### Form Components and Hooks
17
+
18
+
-`FormProvider` - Provider component for form context
19
+
-`useField` - Hook for accessing form field functionality
20
+
-`useForm` - Hook for accessing form functionality
21
+
-`withFormProvider` - Higher-order component for adding form provider capabilities
22
+
-`RenderNothing` - Utility component for rendering nothing
23
+
24
+
### Utility Hooks
25
+
26
+
-`useAsyncReducer` - Hook for async state management
27
+
-`useControlledReducer` - Hook for controlled state management
28
+
-`useDeprecationWarning` - Hook for displaying deprecation warnings
29
+
-`useDropZone` - Hook for drag and drop functionality
30
+
-`useGetUrl` - Hook for getting URLs
31
+
-`useHasValueUpdated` - Hook for checking if a value has updated
32
+
-`usePreviousValue` - Hook for accessing previous value
33
+
-`useSetUserAgent` - Hook for setting user agent
34
+
-`useTimeout` - Hook for timeout functionality
35
+
36
+
### Utility Functions
37
+
38
+
-`createContextUtilities` - Utility function for creating context utilities
39
+
40
+
### Type Definitions
41
+
42
+
- Various type definitions for Authenticator, Form, and utility components
Amplify UI is an open-source UI library with cloud-connected components that are endlessly customizable, accessible, and can integrate into _any_ application. Amplify UI consists of:
3
+
The React Geo package provides geolocation and mapping components for Amplify connected applications.
4
4
5
-
1. Connected components that simplify complex cloud-connected workflows, like Authenticator.
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
-
## React Documentation
11
-
12
-
-https://ui.docs.amplify.aws/react
7
+
### Core Components
13
8
14
-
## Features 🚀
9
+
-`MapView` - Component for displaying maps
10
+
-`LocationSearch` - Component for location search functionality
15
11
16
-
-**Better developer experience** Connected-components like Authenticator are being written with framework-specific implementations so that they follow framework conventions and are easier to integrate into your application.
17
-
-**Endlessly customizable** Every detail of Amplify UI is customizable to match your brand. Style all of Amplify UI with themes, override components with your own, or build your own UI and use Amplify for complex state management.
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.
20
-
21
-
## We love contributors!!
12
+
## React Documentation
22
13
23
-
See our contributing guide [CONTRIBUTING.md](/CONTRIBUTING.md) to help us scale Amplify UI!
0 commit comments