-
Notifications
You must be signed in to change notification settings - Fork 301
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #4709 from aws-amplify/next-release/main
Merge next-release/main to main
- Loading branch information
Showing
1,594 changed files
with
60,039 additions
and
66,147 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| --- | ||
| "@aws-amplify/ui-react": major | ||
| --- | ||
|
|
||
| BREAKING: | ||
| * Removing stylistic data-attributes from React primitives | ||
| * Update SwitchField classnames to be BEM | ||
| * Removing remnants of "countryCode" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| --- | ||
| "@aws-amplify/ui-react": major | ||
| "@aws-amplify/ui": major | ||
| --- | ||
|
|
||
| breaking: refactoring Tabs component to remove Radix dependency and allow more composability and customization. | ||
|
|
||
| ```diff | ||
| - import { Tabs, TabItem } from '@aws-amplify/ui-react' | ||
| + import { Tabs } from '@aws-amplify/ui-react' | ||
|
|
||
| - <Tabs> | ||
| - <TabItem title="Tab 1"> | ||
| - Tab 1 Content | ||
| - </TabItem> | ||
|
|
||
| + <Tabs.Container defaultValue="Tab 1"> | ||
| + <Tabs.List> | ||
| + <Tabs.Item value="Tab 1">Tab 1</Tabs.Item> | ||
| + </Tabs.List> | ||
| + <Tabs.Panel value="Tab 1"> | ||
| + Tab 1 Content | ||
| + </Tabs.Panel> | ||
| + </Tabs.Container> | ||
| ``` | ||
|
|
||
|
|
||
| You can also use the Tabs in a uncomposed way too: | ||
|
|
||
| ```jsx | ||
| <Tabs | ||
| defaultValue={'Tab 1'} | ||
| items={[ | ||
| { label: 'Tab 1', value: 'Tab 1', content: 'Tab content #1' }, | ||
| { label: 'Tab 2', value: 'Tab 2', content: 'Tab content #2' }, | ||
| { label: 'Tab 3', value: 'Tab 3', content: 'Tab content #3' }, | ||
| ]} | ||
| /> | ||
| ``` | ||
|
|
||
| Some notable differences: | ||
| * Instead of providing a `defaultIndex` or `currentIndex` you provide a `defaultValue` or `value`. Each Tabs.Item and Tabs.Panel should have a `value` that matches with the corresponding element. | ||
| * `onChange` becomes `onValueChange` | ||
| * You should supply a `defaultValue` or `value` or else there will be no default selected tab. Previously the Tabs component would default to the first tab. | ||
|
|
||
| There are also more design tokens and better CSS classes for easier customization. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| --- | ||
| "@aws-amplify/ui-react-native": minor | ||
| "@aws-amplify/ui-react": minor | ||
| "@aws-amplify/ui": minor | ||
| --- | ||
|
|
||
| feat: allow themes to have arbitrary tokens |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| --- | ||
| "@aws-amplify/ui-react-storage": patch | ||
| --- | ||
|
|
||
| fix(react-storage): StorageImage now fires onStorageGetError when an object is not found | ||
|
|
||
| StorageImage now has a prop called `validateObjectExistence` which is default to `true`. This checks if there is a file at the given path before adding it as the `src` on an image. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| --- | ||
| "@aws-amplify/ui-react": major | ||
| "@aws-amplify/ui": major | ||
| --- | ||
|
|
||
| breaking: updating classnames for better BEM syntax | ||
|
|
||
| * `amplify-loader__percentage-text` -> `amplify-loader__label` | ||
| * `amplify-menu-content-wrapper` -> `amplify-menu__wrapper` | ||
| * `amplify-menu-trigger` -> `amplify-menu__trigger` | ||
| * `amplify-menu-content` -> `amplify-menu__content` | ||
| * `amplify-menu-content__item` -> `amplify-menu__content__item` | ||
| * `amplify-pagination__item-button` -> `amplify-pagination__item` | ||
| * `amplify-pagination__item-current` -> `amplify-pagination__item--current` | ||
| * `amplify-pagination__item-ellipsis` -> `amplify-pagination__item--ellipsis` | ||
| * `amplify-rating-icon-container` -> `amplify-rating__item` | ||
| * `amplify-rating-icon` -> `amplify-rating__icon` | ||
| * `amplify-rating-icon-filled` -> `amplify-rating__icon--filled` | ||
| * `amplify-rating-icon-empty` -> `amplify-rating__icon--empty` | ||
| * `amplify-select__icon-wrapper` -> `amplify-select__icon` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| --- | ||
| "@aws-amplify/ui": major | ||
| "@aws-amplify/ui-react": major | ||
| --- | ||
|
|
||
| breaking: renaming Expander to Accordion and removing Radix dependency. The Accordion component is now built with `<details>` and `<summary>` elements to handle showing/hiding content. | ||
|
|
||
| ```jsx | ||
| <Accordion.Container> | ||
| <Accordion.Item value="item-1"> | ||
| <Accordion.Trigger> | ||
| Click me first! | ||
| <Accordion.Icon /> | ||
| </Accordion.Trigger> | ||
| <Accordion.Content> | ||
| Now when you click the second item, this item will automatically collapse. | ||
| </Accordion.Content> | ||
| </Accordion.Item> | ||
| <Accordion.Item value="item-2"> | ||
| <Accordion.Trigger> | ||
| Then click me! | ||
| <Accordion.Icon /> | ||
| </Accordion.Trigger> | ||
| <Accordion.Content> | ||
| Notice how only one item can be open at a time for the single Accordion type. | ||
| </Accordion.Content> | ||
| </Accordion.Item> | ||
| </Accordion.Container> | ||
| ``` | ||
|
|
||
| The Accordion can be controlled or uncontrolled (with a default value) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| --- | ||
| "@aws-amplify/ui": major | ||
| "@aws-amplify/ui-react": major | ||
| --- | ||
|
|
||
| breaking(theme): removing brand namespace from the theme tokens | ||
|
|
||
| ```diff | ||
| - tokens.colors.brand.primary[10] | ||
| + tokens.colors.primary[10] | ||
| ``` | ||
|
|
||
|
|
||
| ```diff | ||
| const theme = createTheme({ | ||
| tokens: { | ||
| colors: { | ||
| - brand: { | ||
| primary: { | ||
| //... | ||
| } | ||
| - } | ||
| } | ||
| } | ||
| }) | ||
| ``` | ||
|
|
||
| We also added the ability to easily set the entire range of primary and secondary colors at the theme level | ||
|
|
||
| ```ts | ||
| const theme = createTheme({ | ||
| primaryColor: 'red', | ||
| secondaryColor: 'green' | ||
| }); | ||
| ``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| --- | ||
| "@aws-amplify/ui-react": patch | ||
| --- | ||
|
|
||
| refactor(ui): update RadioGroupField to use Fieldset | ||
|
|
||
| Update to `RadioGroupField` component props: | ||
| - `legend` replaces `label` | ||
| - `legendHidden` replaces `labelHidden` | ||
|
|
||
| Example usage: | ||
| ``` <RadioGroupField legend="Language" legendHidden /> ``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| --- | ||
| "@aws-amplify/ui-react": minor | ||
| "@aws-amplify/ui": minor | ||
| --- | ||
|
|
||
| feat: add CSS layers support and CSS file splitting. The default style import '@aws-amplify/ui-react/styles.css' remains unchanged so these features are opt-in. | ||
| We are now exposing each different component CSS file if you want fine-grained control over what CSS is loaded. Additionally, we will have a CSS reset and a base CSS file. | ||
| If you only wanted the button CSS you could do this: | ||
|
|
||
| ```javascript | ||
| import '@aws-amplify/ui-react/styles/reset.css' | ||
| import '@aws-amplify/ui-react/styles/base.css' | ||
| import '@aws-amplify/ui-react/styles/button.css' | ||
| ``` | ||
|
|
||
| You can also use the main 'styles.css' import with the new reset file too. | ||
|
|
||
| To use CSS layers, replace '.css' with '.layer.css' for any CSS import. | ||
|
|
||
| ```diff | ||
| - import '@aws-amplify/ui-react/styles.css' | ||
| + import '@aws-amplify/ui-react/styles.layer.css' | ||
| ``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.