@aws-amplify/ui 5.1.1 → 5.3.0

package/dist/types/theme/tokens/components/collection.d.ts

@@ -8,17 +8,17 @@ declare type PaginationTokens<Output> = {
     };
 };
 declare type SearchTokens<Output> = {
-    input: DesignTokenProperties<'color', Output>;
-    button: DesignTokenProperties<'color', Output> & {
-        _active: StateTokens<Output>;
-        _disabled: StateTokens<Output>;
-        _focus: StateTokens<Output>;
-        _hover: StateTokens<Output>;
+    input?: DesignTokenProperties<'color', Output>;
+    button?: DesignTokenProperties<'color', Output> & {
+        _active?: StateTokens<Output>;
+        _disabled?: StateTokens<Output>;
+        _focus?: StateTokens<Output>;
+        _hover?: StateTokens<Output>;
     };
 };
 export interface CollectionTokens<Output extends OutputVariantKey> {
-    pagination: PaginationTokens<Output>;
-    search: SearchTokens<Output>;
+    pagination?: PaginationTokens<Output>;
+    search?: SearchTokens<Output>;
 }
 export declare const collection: Required<CollectionTokens<'default'>>;
 export {};

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

@@ -0,0 +1,23 @@
+import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
+import { TypographyTokens } from '../types/typography';
+declare type BaseDropZoneTokens<OutputType> = DesignTokenProperties<'backgroundColor' | 'borderWidth' | 'borderStyle' | 'borderColor' | 'borderRadius', OutputType>;
+export interface FileUploaderTokens<OutputType extends OutputVariantKey> {
+    dropzone?: DesignTokenProperties<'gap' | 'paddingBlock' | 'paddingInline' | 'textAlign'> & BaseDropZoneTokens<OutputType> & {
+        _active?: BaseDropZoneTokens<OutputType>;
+        icon?: DesignTokenProperties<'fontSize' | 'color', OutputType>;
+        text?: TypographyTokens<OutputType>;
+    };
+    file?: DesignTokenProperties<'alignItems' | 'backgroundColor' | 'borderColor' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'gap' | 'paddingBlock' | 'paddingInline', OutputType> & {
+        name?: TypographyTokens<OutputType>;
+        size?: TypographyTokens<OutputType>;
+        image?: DesignTokenProperties<'backgroundColor' | 'borderRadius' | 'color' | 'height' | 'width', OutputType>;
+    };
+    loader?: DesignTokenProperties<'strokeWidth' | 'strokeFilled' | 'strokeEmpty' | 'strokeLinecap', OutputType>;
+    previewer?: DesignTokenProperties<'backgroundColor' | 'borderColor' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'maxHeight' | 'maxWidth' | 'paddingBlock' | 'paddingInline', OutputType> & {
+        text?: TypographyTokens<OutputType>;
+        body?: DesignTokenProperties<'gap' | 'paddingInline' | 'paddingBlock', OutputType>;
+        footer?: DesignTokenProperties<'borderColor' | 'borderStyle' | 'borderWidth' | 'justifyContent' | 'paddingBlock' | 'paddingInline', OutputType>;
+    };
+}
+export declare const fileuploader: Required<FileUploaderTokens<'default'>>;
+export {};

package/dist/types/theme/tokens/components/heading.d.ts

@@ -1,6 +1,6 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type HeadingLevelTokens<Output> = DesignTokenProperties<'fontSize' | 'fontWeight', Output>;
 declare type Level = 1 | 2 | 3 | 4 | 5 | 6;
-export declare type HeadingTokens<Output extends OutputVariantKey> = DesignTokenProperties<'color' | 'lineHeight'> & Record<Level, HeadingLevelTokens<Output>>;
+export declare type HeadingTokens<Output extends OutputVariantKey> = DesignTokenProperties<'color' | 'lineHeight', Output> & Partial<Record<Level, HeadingLevelTokens<Output>>>;
 export declare const heading: Required<HeadingTokens<'default'>>;
 export {};

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

@@ -15,6 +15,7 @@ import { FieldTokens } from './field';
 import { FieldControlTokens } from './fieldControl';
 import { FieldGroupTokens } from './fieldGroup';
 import { FieldMessagesTokens } from './fieldMessages';
+import { FileUploaderTokens } from './fileUploader';
 import { FlexTokens } from './flex';
 import { HeadingTokens } from './heading';
 import { HighlightMatchTokens } from './highlightMatch';
@@ -63,6 +64,7 @@ declare type BaseComponentTokens<Output extends OutputVariantKey> = {
     fieldcontrol?: FieldControlTokens<Output>;
     fieldgroup?: FieldGroupTokens<Output>;
     fieldmessages?: FieldMessagesTokens<Output>;
+    fileuploader?: FileUploaderTokens<Output>;
     flex?: FlexTokens<Output>;
     heading?: HeadingTokens<Output>;
     highlightmatch?: HighlightMatchTokens<Output>;

package/dist/types/theme/tokens/components/link.d.ts

@@ -1,5 +1,5 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type LinkState = 'active' | 'focus' | 'hover' | 'visited';
-export declare type LinkTokens<Output extends OutputVariantKey> = DesignTokenProperties<'color'> & Record<LinkState, DesignTokenProperties<'color', Output>>;
+export declare type LinkTokens<Output extends OutputVariantKey> = DesignTokenProperties<'color', Output> & Partial<Record<LinkState, DesignTokenProperties<'color', Output>>>;
 export declare const link: Required<LinkTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/rating.d.ts

@@ -1,8 +1,8 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 export declare type RatingTokens<Output extends OutputVariantKey> = {
-    large: DesignTokenProperties<'size', Output>;
-    default: DesignTokenProperties<'size', Output>;
-    small: DesignTokenProperties<'size', Output>;
+    large?: DesignTokenProperties<'size', Output>;
+    default?: DesignTokenProperties<'size', Output>;
+    small?: DesignTokenProperties<'size', Output>;
     filled?: DesignTokenProperties<'color', Output>;
     empty?: DesignTokenProperties<'color', Output>;
 };

package/dist/types/theme/tokens/components/select.d.ts

@@ -1,10 +1,10 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type SelectSizeTokens<Output> = DesignTokenProperties<'minWidth', Output>;
-export declare type SelectTokens<Output extends OutputVariantKey> = DesignTokenProperties<'paddingInlineEnd' | 'whiteSpace' | 'minWidth'> & {
-    wrapper?: DesignTokenProperties<'cursor' | 'display' | 'flex' | 'position'>;
-    iconWrapper?: DesignTokenProperties<'alignItems' | 'position' | 'top' | 'right' | 'transform' | 'pointerEvents'>;
-    option?: DesignTokenProperties<'backgroundColor' | 'color'> & {
-        _disabled?: DesignTokenProperties<'color'>;
+export declare type SelectTokens<Output extends OutputVariantKey> = DesignTokenProperties<'paddingInlineEnd' | 'whiteSpace' | 'minWidth', Output> & {
+    wrapper?: DesignTokenProperties<'cursor' | 'display' | 'flex' | 'position', Output>;
+    iconWrapper?: DesignTokenProperties<'alignItems' | 'position' | 'top' | 'right' | 'transform' | 'pointerEvents', Output>;
+    option?: DesignTokenProperties<'backgroundColor' | 'color', Output> & {
+        _disabled?: DesignTokenProperties<'color', Output>;
     };
     small?: SelectSizeTokens<Output>;
     large?: SelectSizeTokens<Output>;

package/dist/types/theme/tokens/components/stepperField.d.ts

@@ -1,6 +1,6 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type ButtonStateColorTokens<Output> = DesignTokenProperties<'backgroundColor' | 'color', Output>;
-export declare type StepperFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<'borderColor' | 'flexDirection'> & {
+export declare type StepperFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<'borderColor' | 'flexDirection', Output> & {
     input?: DesignTokenProperties<'textAlign' | 'color' | 'fontSize', Output>;
     button?: DesignTokenProperties<'backgroundColor' | 'color', Output> & {
         _active?: ButtonStateColorTokens<Output>;

package/dist/types/theme/tokens/components/switchField.d.ts

@@ -1,20 +1,20 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type SwitchFieldSizeTokens<OutputType> = DesignTokenProperties<'fontSize', OutputType>;
 declare type SwitchFieldTrackCheckedTokens<OutputType> = DesignTokenProperties<'backgroundColor', OutputType>;
-export declare type SwitchFieldTokens<OutputType extends OutputVariantKey> = DesignTokenProperties<'fontSize'> & {
+export declare type SwitchFieldTokens<OutputType extends OutputVariantKey> = DesignTokenProperties<'fontSize', OutputType> & {
     _disabled?: DesignTokenProperties<'opacity', OutputType>;
     _focused?: DesignTokenProperties<'shadow', OutputType>;
     large?: SwitchFieldSizeTokens<OutputType>;
     small?: SwitchFieldSizeTokens<OutputType>;
     label?: DesignTokenProperties<'padding', OutputType>;
     thumb?: DesignTokenProperties<'backgroundColor' | 'borderColor' | 'borderRadius' | 'width', OutputType> & {
-        checked: DesignTokenProperties<'transform', OutputType>;
-        transition: DesignTokenProperties<'duration', OutputType>;
+        checked?: DesignTokenProperties<'transform', OutputType>;
+        transition?: DesignTokenProperties<'duration', OutputType>;
     };
     track?: DesignTokenProperties<'backgroundColor' | 'borderRadius' | 'height' | 'width' | 'padding', OutputType> & {
-        checked: SwitchFieldTrackCheckedTokens<OutputType>;
-        transition: DesignTokenProperties<'duration', OutputType>;
-        _error: SwitchFieldTrackCheckedTokens<OutputType>;
+        checked?: SwitchFieldTrackCheckedTokens<OutputType>;
+        transition?: DesignTokenProperties<'duration', OutputType>;
+        _error?: SwitchFieldTrackCheckedTokens<OutputType>;
     };
 };
 export declare const switchfield: Required<SwitchFieldTokens<'default'>>;

package/dist/types/theme/tokens/components/table.d.ts

@@ -14,8 +14,8 @@ export declare type TableTokens<Output extends OutputVariantKey> = DesignTokenPr
         hover?: DesignTokenProperties<'backgroundColor', Output>;
         striped?: DesignTokenProperties<'backgroundColor', Output>;
     };
-    header: TableCellTokens<Output>;
-    data: TableCellTokens<Output>;
+    header?: TableCellTokens<Output>;
+    data?: TableCellTokens<Output>;
     caption?: DesignTokenProperties<'captionSide' | 'color' | 'display' | 'fontSize' | 'textAlign' | 'wordBreak', Output> & {
         large?: TableCaptionSizeTokens<Output>;
         small?: TableCaptionSizeTokens<Output>;

package/dist/types/theme/tokens/components/text.d.ts

@@ -2,6 +2,6 @@ import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type OrderVariantKey = 'primary' | 'secondary' | 'tertiary';
 declare type InformationVariantKey = 'info' | 'warning' | 'error' | 'success';
 declare type BaseTextTokens<Output> = DesignTokenProperties<'color', Output>;
-export declare type TextTokens<Output extends OutputVariantKey> = BaseTextTokens<Output> & Record<OrderVariantKey | InformationVariantKey, BaseTextTokens<Output>>;
+export declare type TextTokens<Output extends OutputVariantKey> = BaseTextTokens<Output> & Partial<Record<OrderVariantKey | InformationVariantKey, BaseTextTokens<Output>>>;
 export declare const text: Required<TextTokens<'default'>>;
 export {};

package/dist/types/theme/tokens/components/textAreaField.d.ts

@@ -1,6 +1,6 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
 declare type TokenKey = 'color' | 'borderColor' | 'fontSize';
-export declare type TextAreaFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<Output extends 'default' ? Exclude<TokenKey, 'fontSize'> : TokenKey> & {
+export declare type TextAreaFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<Output extends 'default' ? Exclude<TokenKey, 'fontSize'> : TokenKey, Output> & {
     _focus?: DesignTokenProperties<'borderColor', Output>;
 };
 export declare const textareafield: Required<TextAreaFieldTokens<'default'>>;

package/dist/types/theme/tokens/components/textField.d.ts

@@ -1,5 +1,5 @@
 import { DesignTokenProperties, OutputVariantKey } from '../types/designToken';
-export declare type TextFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<'color' | 'borderColor' | 'fontSize'> & {
+export declare type TextFieldTokens<Output extends OutputVariantKey> = DesignTokenProperties<'color' | 'borderColor' | 'fontSize', Output> & {
     _focus?: DesignTokenProperties<'borderColor', Output>;
 };
 export declare const textfield: Required<TextFieldTokens<'default'>>;

package/dist/types/theme/tokens/types/typography.d.ts

@@ -0,0 +1,2 @@
+import { DesignTokenProperties } from './designToken';
+export declare type TypographyTokens<OutputType> = DesignTokenProperties<'fontSize' | 'fontWeight' | 'color', OutputType>;

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

@@ -0,0 +1 @@
+export * from './validator';

package/dist/types/types/accountSettings/validator.d.ts

@@ -0,0 +1,14 @@
+export declare type InputEventType = 'blur' | 'change';
+export declare type ValidationMode = 'onBlur' | 'onChange' | 'onTouched';
+export interface ValidatorOptions {
+    validationMode: ValidationMode;
+    validator: (value: string) => boolean;
+    message: string;
+}
+export interface PasswordRequirement {
+    minLength?: number;
+    needsLowerCase?: boolean;
+    needsUpperCase?: boolean;
+    needsSpecialChar?: boolean;
+    needsNumber?: boolean;
+}

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

@@ -1,3 +1,4 @@
+export * from './accountSettings';
 export * from './authenticator';
 export * from './primitives';
 export * from './util';

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

@@ -53,6 +53,23 @@ export declare enum ComponentClassName {
     FieldGroupHasInnerStart = "amplify-field-group--has-inner-start",
     FieldShowPassword = "amplify-field__show-password",
     FieldGroupFieldWrapper = "amplify-field-group__field-wrapper",
+    FileUploaderDropZone = "amplify-fileuploader__dropzone",
+    FileUploaderDropZoneIcon = "amplify-fileuploader__dropzone__icon",
+    FileUploaderDropZoneText = "amplify-fileuploader__dropzone__text",
+    FileUploaderDropZoneButton = "amplify-fileuploader__dropzone__button",
+    FileUploaderFile = "amplify-fileuploader__file",
+    FileUploaderFileName = "amplify-fileuploader__file__name",
+    FileUploaderFileSize = "amplify-fileuploader__file__size",
+    FileUploaderFileInfo = "amplify-fileuploader__file__info",
+    FileUploaderFileImage = "amplify-fileuploader__file__image",
+    FileUploaderFileMain = "amplify-fileuploader__file__main",
+    FileUploaderFileStatus = "amplify-fileuploader__file__status",
+    FileUploaderLoader = "amplify-fileuploader__loader",
+    FileUploaderPreviewer = "amplify-fileuploader__previewer",
+    FileUploaderPreviewerText = "amplify-fileuploader__previewer__text",
+    FileUploaderPreviewerBody = "amplify-fileuploader__previewer__body",
+    FileUploaderPreviewerFooter = "amplify-fileuploader__previewer__footer",
+    FileUploaderPreviewerFooterActions = "amplify-fileuploader__previewer__footer__actions",
     Flex = "amplify-flex",
     Grid = "amplify-grid",
     Heading = "amplify-heading",

package/package.json

@@ -1,15 +1,17 @@
 {
   "name": "@aws-amplify/ui",
-  "version": "5.1.1",
+  "version": "5.3.0",
   "main": "dist/index.js",
   "module": "dist/esm/index.js",
   "exports": {
     ".": {
+      "types": "./dist/types/index.d.ts",
       "import": "./dist/esm/index.js",
       "require": "./dist/index.js"
     },
     "./package.json": "./package.json",
     "./styles.css": "./dist/styles.css",
+    "./dist/styles.css": "./dist/styles.css",
     "./theme.css": "./dist/theme.css",
     "./tokens.ts": "./dist/react-native/tokens.ts"
   },