@aws-amplify/ui 6.1.0 → 6.3.0

package/dist/styles.layer.css

@@ -1641,9 +1641,8 @@ strong.amplify-text {
   padding-inline-start: var(--amplify-components-button-padding-inline-start);
   padding-inline-end: var(--amplify-components-button-padding-inline-end);
   transition: all var(--amplify-components-button-transition-duration);
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
+  -moz-user-select: none;
+       user-select: none;
   --amplify-internal-button-disabled-color: var(
     --amplify-components-button-disabled-color
   );
@@ -2664,58 +2663,50 @@ strong.amplify-text {
   background-color: var(--amplify-internal-button-disabled-background-color);
   border-color: var(--amplify-internal-button-disabled-border-color);
   color: var(--amplify-internal-button-disabled-color);
-  -webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
-          text-decoration: var(--amplify-internal-button-disabled-text-decoration);
+  text-decoration: var(--amplify-internal-button-disabled-text-decoration);
   cursor: not-allowed;
 }
 .amplify-button--disabled:hover {
   background-color: var(--amplify-internal-button-disabled-background-color);
   border-color: var(--amplify-internal-button-disabled-border-color);
   color: var(--amplify-internal-button-disabled-color);
-  -webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
-          text-decoration: var(--amplify-internal-button-disabled-text-decoration);
+  text-decoration: var(--amplify-internal-button-disabled-text-decoration);
 }
 .amplify-button--disabled :focus {
   background-color: var(--amplify-internal-button-disabled-background-color);
   border-color: var(--amplify-internal-button-disabled-border-color);
   color: var(--amplify-internal-button-disabled-color);
-  -webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
-          text-decoration: var(--amplify-internal-button-disabled-text-decoration);
+  text-decoration: var(--amplify-internal-button-disabled-text-decoration);
 }
 .amplify-button--disabled:active {
   background-color: var(--amplify-internal-button-disabled-background-color);
   border-color: var(--amplify-internal-button-disabled-border-color);
   color: var(--amplify-internal-button-disabled-color);
-  -webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
-          text-decoration: var(--amplify-internal-button-disabled-text-decoration);
+  text-decoration: var(--amplify-internal-button-disabled-text-decoration);
 }
 .amplify-button--loading {
   background-color: var(--amplify-internal-button-loading-background-color);
   border-color: var(--amplify-internal-button-loading-border-color);
   color: var(--amplify-components-button-loading-color);
-  -webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
-          text-decoration: var(--amplify-internal-button-loading-text-decoration);
+  text-decoration: var(--amplify-internal-button-loading-text-decoration);
 }
 .amplify-button--loading:hover {
   background-color: var(--amplify-internal-button-loading-background-color);
   border-color: var(--amplify-internal-button-loading-border-color);
   color: var(--amplify-components-button-loading-color);
-  -webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
-          text-decoration: var(--amplify-internal-button-loading-text-decoration);
+  text-decoration: var(--amplify-internal-button-loading-text-decoration);
 }
 .amplify-button--loading:focus {
   background-color: var(--amplify-internal-button-loading-background-color);
   border-color: var(--amplify-internal-button-loading-border-color);
   color: var(--amplify-components-button-loading-color);
-  -webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
-          text-decoration: var(--amplify-internal-button-loading-text-decoration);
+  text-decoration: var(--amplify-internal-button-loading-text-decoration);
 }
 .amplify-button--loading:active {
   background-color: var(--amplify-internal-button-loading-background-color);
   border-color: var(--amplify-internal-button-loading-border-color);
   color: var(--amplify-components-button-loading-color);
-  -webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
-          text-decoration: var(--amplify-internal-button-loading-text-decoration);
+  text-decoration: var(--amplify-internal-button-loading-text-decoration);
 }
 .amplify-button__loader-wrapper {
   align-items: var(--amplify-components-button-loader-wrapper-align-items);
@@ -2863,9 +2854,8 @@ strong.amplify-text {
   outline-style: var(--amplify-components-fieldcontrol-outline-style);
   outline-width: var(--amplify-components-fieldcontrol-outline-width);
   outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
-  -webkit-user-select: text;
-     -moz-user-select: text;
-          user-select: text;
+  -moz-user-select: text;
+       user-select: text;
   display: inline-block;
   --amplify-components-fieldcontrol-color: var(
     --amplify-components-input-color
@@ -2948,9 +2938,8 @@ strong.amplify-text {
   outline-style: var(--amplify-components-fieldcontrol-outline-style);
   outline-width: var(--amplify-components-fieldcontrol-outline-width);
   outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
-  -webkit-user-select: text;
-     -moz-user-select: text;
-          user-select: text;
+  -moz-user-select: text;
+       user-select: text;
   white-space: pre-wrap;
 }
 .amplify-textarea:focus {
@@ -3014,29 +3003,24 @@ strong.amplify-text {
 
 .amplify-link {
   color: var(--amplify-components-link-color);
-  -webkit-text-decoration: var(--amplify-components-link-text-decoration);
-          text-decoration: var(--amplify-components-link-text-decoration);
+  text-decoration: var(--amplify-components-link-text-decoration);
   cursor: pointer;
 }
 .amplify-link:visited {
   color: var(--amplify-components-link-visited-color);
-  -webkit-text-decoration: var(--amplify-components-link-visited-text-decoration);
-          text-decoration: var(--amplify-components-link-visited-text-decoration);
+  text-decoration: var(--amplify-components-link-visited-text-decoration);
 }
 .amplify-link:active {
   color: var(--amplify-components-link-active-color);
-  -webkit-text-decoration: var(--amplify-components-link-active-text-decoration);
-          text-decoration: var(--amplify-components-link-active-text-decoration);
+  text-decoration: var(--amplify-components-link-active-text-decoration);
 }
 .amplify-link:focus {
   color: var(--amplify-components-link-focus-color);
-  -webkit-text-decoration: var(--amplify-components-link-focus-text-decoration);
-          text-decoration: var(--amplify-components-link-focus-text-decoration);
+  text-decoration: var(--amplify-components-link-focus-text-decoration);
 }
 .amplify-link:hover {
   color: var(--amplify-components-link-hover-color);
-  -webkit-text-decoration: var(--amplify-components-link-hover-text-decoration);
-          text-decoration: var(--amplify-components-link-hover-text-decoration);
+  text-decoration: var(--amplify-components-link-hover-text-decoration);
 }
 
 .amplify-loader {
@@ -3467,16 +3451,14 @@ strong.amplify-text {
   font-weight: var(--amplify-components-breadcrumbs-link-font-weight);
   padding-inline: var(--amplify-components-breadcrumbs-link-padding-inline);
   padding-block: var(--amplify-components-breadcrumbs-link-padding-block);
-  -webkit-text-decoration: var(--amplify-components-breadcrumbs-link-text-decoration);
-          text-decoration: var(--amplify-components-breadcrumbs-link-text-decoration);
+  text-decoration: var(--amplify-components-breadcrumbs-link-text-decoration);
 }
 
 .amplify-breadcrumbs__link--current {
   color: var(--amplify-components-breadcrumbs-link-current-color);
   font-size: var(--amplify-components-breadcrumbs-link-current-font-size);
   font-weight: var(--amplify-components-breadcrumbs-link-current-font-weight);
-  -webkit-text-decoration: var(--amplify-components-breadcrumbs-link-current-text-decoration);
-          text-decoration: var(--amplify-components-breadcrumbs-link-current-text-decoration);
+  text-decoration: var(--amplify-components-breadcrumbs-link-current-text-decoration);
 }
 
 .amplify-card {
@@ -5026,9 +5008,8 @@ html[dir=rtl] .amplify-field-group__inner-start {
   padding-block: var(--amplify-components-sliderfield-padding-block);
   position: relative;
   touch-action: none;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
+  -moz-user-select: none;
+       user-select: none;
   --amplify-internal-sliderfield-root-height: var(
     --amplify-components-sliderfield-thumb-height
   );

package/dist/types/i18n/dictionaries/authenticator/index.d.ts

@@ -16,4 +16,5 @@ export { trDict } from './tr';
 export { ruDict } from './ru';
 export { heDict } from './he';
 export { uaDict } from './ua';
+export { thDict } from './th';
 export { defaultTexts } from './defaultTexts';

package/dist/types/i18n/dictionaries/authenticator/th.d.ts

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

package/dist/types/i18n/dictionaries/index.d.ts

@@ -934,6 +934,58 @@ export declare const uaDict: {
     "Verify Contact": string;
     Verify: string;
 };
+export declare const thDict: {
+    [x: string]: string;
+    Email: string;
+    "Phone Number": string;
+    "Account recovery requires verified contact information": string;
+    "Back to Sign In": string;
+    "Change Password": string;
+    Changing: string;
+    Code: string;
+    "Confirm Password": string;
+    "Confirm Sign Up": string;
+    "Confirm SMS Code": string;
+    "Confirm TOTP Code": string;
+    Confirm: string;
+    "Confirmation Code": string;
+    Confirming: string;
+    "Create a new account": string;
+    "Create Account": string;
+    "Creating Account": string;
+    "Dismiss alert": string;
+    "Enter your code": string;
+    "Enter your Email": string;
+    "Enter your phone number": string;
+    "Enter your username": string;
+    "Forgot your password?": string;
+    "Hide password": string;
+    Loading: string;
+    "New password": string;
+    Password: string;
+    "Resend Code": string;
+    "Reset your password": string;
+    "Reset your Password": string;
+    "Send code": string;
+    "Send Code": string;
+    Sending: string;
+    "Setup TOTP": string;
+    "Show password": string;
+    "Sign in to your account": string;
+    "Sign In with Amazon": string;
+    "Sign In with Apple": string;
+    "Sign In with Facebook": string;
+    "Sign In with Google": string;
+    "Sign in": string;
+    "Sign In": string;
+    "Signing in": string;
+    Skip: string;
+    Submit: string;
+    Submitting: string;
+    Username: string;
+    "Verify Contact": string;
+    Verify: string;
+};
 export declare const defaultTexts: {
     ADD_PROFILE: string;
     ADD_WEBSITE: string;

package/dist/types/theme/components/fileUploader.d.ts

@@ -0,0 +1,20 @@
+import { Modifiers, ComponentStyles, Elements, ColorTheme } from './utils';
+export type FileUploaderTheme<Required extends boolean = false> = ComponentStyles & Modifiers<ColorTheme, Required> & Elements<{
+    dropzone?: ComponentStyles & Modifiers<'active' | 'small', Required>;
+    dropzone__icon?: ComponentStyles;
+    dropzone__text?: ComponentStyles;
+    file?: ComponentStyles;
+    file__picker?: ComponentStyles;
+    file__wrapper?: ComponentStyles;
+    file__name?: ComponentStyles;
+    file__size?: ComponentStyles;
+    file__list?: ComponentStyles;
+    file__main?: ComponentStyles;
+    file__image?: ComponentStyles;
+    file__status?: ComponentStyles & Modifiers<'error' | 'success', Required>;
+    loader?: ComponentStyles;
+    previewer?: ComponentStyles;
+    previewer__text?: ComponentStyles;
+    previewer__footer?: ComponentStyles;
+    previewer__actions?: ComponentStyles;
+}, Required>;

package/dist/types/types/primitives/componentClassName.d.ts

@@ -59,6 +59,25 @@ export declare const ComponentClassName: {
     readonly FieldGroupFieldWrapper: "amplify-field-group__field-wrapper";
     readonly Fieldset: "amplify-fieldset";
     readonly FieldsetLegend: "amplify-fieldset__legend";
+    readonly FileUploader: "amplify-fileuploader";
+    readonly FileUploaderDropZone: "amplify-fileuploader__dropzone";
+    readonly FileUploaderDropZoneIcon: "amplify-fileuploader__dropzone__icon";
+    readonly FileUploaderDropZoneText: "amplify-fileuploader__dropzone__text";
+    readonly FileUploaderFilePicker: "amplify-fileuploader__file__picker";
+    readonly FileUploaderFile: "amplify-fileuploader__file";
+    readonly FileUploaderFileWrapper: "amplify-fileuploader__file__wrapper";
+    readonly FileUploaderFileList: "amplify-fileuploader__file__list";
+    readonly FileUploaderFileName: "amplify-fileuploader__file__name";
+    readonly FileUploaderFileSize: "amplify-fileuploader__file__size";
+    readonly FileUploaderFileInfo: "amplify-fileuploader__file__info";
+    readonly FileUploaderFileImage: "amplify-fileuploader__file__image";
+    readonly FileUploaderFileMain: "amplify-fileuploader__file__main";
+    readonly FileUploaderFileStatus: "amplify-fileuploader__file__status";
+    readonly FileUploaderLoader: "amplify-fileuploader__loader";
+    readonly FileUploaderPreviewer: "amplify-fileuploader__previewer";
+    readonly FileUploaderPreviewerText: "amplify-fileuploader__previewer__text";
+    readonly FileUploaderPreviewerActions: "amplify-fileuploader__previewer__actions";
+    readonly FileUploaderPreviewerFooter: "amplify-fileuploader__previewer__footer";
     readonly Flex: "amplify-flex";
     readonly Grid: "amplify-grid";
     readonly Heading: "amplify-heading";

package/dist/types/utils/humanFileSize.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Format bytes as human-readable text.
+ *
+ * @param bytes Number of bytes.
+ * @param si True to use metric (SI) units, aka powers of 1000. False to use
+ *           binary (IEC), aka powers of 1024.
+ * @param dp Number of decimal places to display.
+ *
+ * @return Formatted string.
+ */
+export declare function humanFileSize(bytes: number, si?: boolean, dp?: number): string;

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

@@ -1,3 +1,4 @@
 export { setUserAgent, SetUserAgentOptions } from './setUserAgent';
 export * from './utils';
 export { classNames, ClassNamesArgs } from './classNames';
+export { humanFileSize } from './humanFileSize';

package/dist/types/utils/setUserAgent/constants.d.ts

@@ -1,6 +1,7 @@
 import { AuthUserAgentInput, GeoUserAgentInput, InAppMessagingUserAgentInput, StorageUserAgentInput } from '@aws-amplify/core/internals/utils';
 export declare const ACCOUNT_SETTINGS_INPUT_BASE: Omit<AuthUserAgentInput, 'additionalDetails'>;
 export declare const AUTHENTICATOR_INPUT_BASE: Omit<AuthUserAgentInput, 'additionalDetails'>;
+export declare const FILE_UPLOADER_BASE_INPUT: Omit<StorageUserAgentInput, 'additionalDetails'>;
 export declare const IN_APP_MESSAGING_INPUT_BASE: Omit<InAppMessagingUserAgentInput, 'additionalDetails'>;
 export declare const LOCATION_SEARCH_INPUT_BASE: Omit<GeoUserAgentInput, 'additionalDetails'>;
 export declare const MAP_VIEW_INPUT_BASE: Omit<GeoUserAgentInput, 'additionalDetails'>;

package/dist/types/utils/setUserAgent/setUserAgent.d.ts

@@ -1,5 +1,5 @@
 export type PackageName = 'angular' | 'react' | 'react-auth' | 'react-geo' | 'react-liveness' | 'react-native' | 'react-native-auth' | 'react-notifications' | 'react-storage' | 'vue';
-export type ComponentName = 'Authenticator' | 'ChangePassword' | 'DeleteUser' | 'FaceLivenessDetector' | 'InAppMessaging' | 'LocationSearch' | 'MapView' | 'StorageManager' | 'StorageImage';
+export type ComponentName = 'Authenticator' | 'ChangePassword' | 'DeleteUser' | 'FaceLivenessDetector' | 'FileUploader' | 'InAppMessaging' | 'LocationSearch' | 'MapView' | 'StorageManager' | 'StorageImage';
 export type Version = `${string}.${string}.${string}`;
 export interface SetUserAgentOptions {
     componentName: ComponentName;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/ui",
-  "version": "6.1.0",
+  "version": "6.3.0",
   "main": "dist/index.js",
   "module": "dist/esm/index.mjs",
   "exports": {