@aws-amplify/ui-react-storage 3.2.0 → 3.3.0

package/dist/styles.css

@@ -1640,9 +1640,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
   );
@@ -2663,58 +2662,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);
@@ -2862,9 +2853,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
@@ -2947,9 +2937,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 {
@@ -3013,29 +3002,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 {
@@ -3466,16 +3450,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 {
@@ -5025,9 +5007,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/components/FileUploader/FileUploader.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { FileUploaderProps, FileUploaderPathProps, FileUploaderHandle } from './types';
+import { Container, DropZone, FileList, FileListHeader, FileListFooter, FilePicker } from './ui';
+export declare const MISSING_REQUIRED_PROPS_MESSAGE = "`FileUploader` requires a `maxFileCount` prop to be provided.";
+export declare const ACCESS_LEVEL_WITH_PATH_CALLBACK_MESSAGE = "`FileUploader` does not allow usage of a `path` callback prop with an `accessLevel` prop.";
+export declare const ACCESS_LEVEL_DEPRECATION_MESSAGE = "`accessLevel` has been deprecated and will be removed in a future major version. See migration notes at https://ui.docs.amplify.aws/react/connected-components/storage/FileUploader";
+declare const FileUploader: React.ForwardRefExoticComponent<(FileUploaderProps | FileUploaderPathProps) & React.RefAttributes<FileUploaderHandle>> & {
+    Container: typeof Container;
+    DropZone: typeof DropZone;
+    FileList: typeof FileList;
+    FileListHeader: typeof FileListHeader;
+    FileListFooter: typeof FileListFooter;
+    FilePicker: typeof FilePicker;
+};
+export { FileUploader };

package/dist/types/components/FileUploader/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { useFileUploader, UseFileUploader } from './useFileUploader';
+export { useUploadFiles } from './useUploadFiles';

package/dist/types/components/FileUploader/hooks/useFileUploader/actions.d.ts

@@ -0,0 +1,22 @@
+import { FileStatus } from '../../types';
+import { Action, AddFilesActionParams } from './types';
+import { TaskEvent } from '../../utils';
+export declare const addFilesAction: ({ files, status, getFileErrorMessage, }: AddFilesActionParams) => Action;
+export declare const clearFilesAction: () => Action;
+export declare const queueFilesAction: () => Action;
+export declare const setProcessedKeyAction: (input: {
+    id: string;
+    processedKey: string;
+}) => Action;
+export declare const setUploadingFileAction: ({ id, uploadTask, }: TaskEvent) => Action;
+export declare const setUploadProgressAction: ({ id, progress, }: {
+    id: string;
+    progress: number;
+}) => Action;
+export declare const setUploadStatusAction: ({ id, status, }: {
+    id: string;
+    status: FileStatus;
+}) => Action;
+export declare const removeUploadAction: ({ id }: {
+    id: string;
+}) => Action;

package/dist/types/components/FileUploader/hooks/useFileUploader/index.d.ts

@@ -0,0 +1 @@
+export { useFileUploader, UseFileUploader } from './useFileUploader';

package/dist/types/components/FileUploader/hooks/useFileUploader/reducer.d.ts

@@ -0,0 +1,2 @@
+import { Action, UseFileUploaderState } from './types';
+export declare function fileUploaderStateReducer(state: UseFileUploaderState, action: Action): UseFileUploaderState;

package/dist/types/components/FileUploader/hooks/useFileUploader/types.d.ts

@@ -0,0 +1,50 @@
+import { FileStatus, StorageFiles } from '../../types';
+import { UploadTask } from '../../utils';
+export interface UseFileUploaderState {
+    files: StorageFiles;
+}
+export declare enum FileUploaderActionTypes {
+    ADD_FILES = "ADD_FILES",
+    CLEAR_FILES = "CLEAR_FILES",
+    QUEUE_FILES = "QUEUE_FILES",
+    SET_STATUS = "SET_STATUS",
+    SET_PROCESSED_FILE_KEY = "SET_PROCESSED_FILE_KEY",
+    SET_STATUS_UPLOADING = "SET_STATUS_UPLOADING",
+    SET_UPLOAD_PROGRESS = "SET_UPLOAD_PROGRESS",
+    REMOVE_UPLOAD = "REMOVE_UPLOAD"
+}
+export type GetFileErrorMessage = (file: File) => string;
+export type Action = {
+    type: FileUploaderActionTypes.ADD_FILES;
+    files: File[];
+    status: FileStatus;
+    getFileErrorMessage: GetFileErrorMessage;
+} | {
+    type: FileUploaderActionTypes.CLEAR_FILES;
+} | {
+    type: FileUploaderActionTypes.SET_STATUS;
+    id: string;
+    status: FileStatus;
+} | {
+    type: FileUploaderActionTypes.QUEUE_FILES;
+} | {
+    type: FileUploaderActionTypes.SET_STATUS_UPLOADING;
+    id: string;
+    uploadTask?: UploadTask;
+} | {
+    type: FileUploaderActionTypes.SET_UPLOAD_PROGRESS;
+    id: string;
+    progress: number;
+} | {
+    type: FileUploaderActionTypes.SET_PROCESSED_FILE_KEY;
+    id: string;
+    processedKey: string;
+} | {
+    type: FileUploaderActionTypes.REMOVE_UPLOAD;
+    id: string;
+};
+export interface AddFilesActionParams {
+    files: File[];
+    status: FileStatus;
+    getFileErrorMessage: GetFileErrorMessage;
+}

package/dist/types/components/FileUploader/hooks/useFileUploader/useFileUploader.d.ts

@@ -0,0 +1,35 @@
+import { StorageFiles, FileStatus, DefaultFile } from '../../types';
+import { GetFileErrorMessage } from './types';
+import { TaskHandler } from '../../utils';
+export interface UseFileUploader {
+    addFiles: (params: {
+        files: File[];
+        status: FileStatus;
+        getFileErrorMessage: GetFileErrorMessage;
+    }) => void;
+    clearFiles: () => void;
+    queueFiles: () => void;
+    setUploadingFile: TaskHandler;
+    setProcessedKey: (params: {
+        id: string;
+        processedKey: string;
+    }) => void;
+    setUploadProgress: (params: {
+        id: string;
+        progress: number;
+    }) => void;
+    setUploadSuccess: (params: {
+        id: string;
+    }) => void;
+    setUploadResumed: (params: {
+        id: string;
+    }) => void;
+    setUploadPaused: (params: {
+        id: string;
+    }) => void;
+    removeUpload: (params: {
+        id: string;
+    }) => void;
+    files: StorageFiles;
+}
+export declare function useFileUploader(defaultFiles?: Array<DefaultFile>): UseFileUploader;

package/dist/types/components/FileUploader/hooks/useUploadFiles/index.d.ts

@@ -0,0 +1 @@
+export { useUploadFiles, UseUploadFilesProps } from './useUploadFiles';

package/dist/types/components/FileUploader/hooks/useUploadFiles/useUploadFiles.d.ts

@@ -0,0 +1,12 @@
+import { PathCallback } from '../../utils';
+import { FileUploaderProps } from '../../types';
+import { UseFileUploader } from '../useFileUploader';
+export interface UseUploadFilesProps extends Pick<FileUploaderProps, 'isResumable' | 'onUploadSuccess' | 'onUploadError' | 'onUploadStart' | 'maxFileCount' | 'processFile' | 'useAccelerateEndpoint'>, Pick<UseFileUploader, 'setUploadingFile' | 'setUploadProgress' | 'setUploadSuccess' | 'files'> {
+    accessLevel?: FileUploaderProps['accessLevel'];
+    onProcessFileSuccess: (input: {
+        id: string;
+        processedKey: string;
+    }) => void;
+    path?: string | PathCallback;
+}
+export declare function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onProcessFileSuccess, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }: UseUploadFilesProps): void;

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

@@ -0,0 +1,3 @@
+export { FileUploader } from './FileUploader';
+export { FileUploaderProps } from './types';
+export { DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './ui';

package/dist/types/components/FileUploader/types.d.ts

@@ -0,0 +1,129 @@
+import * as React from 'react';
+import type { StorageAccessLevel } from '@aws-amplify/core';
+import { ContainerProps, DropZoneProps, FileListHeaderProps, FileListFooterProps, FileListProps, FilePickerProps } from './ui';
+import { FileUploaderDisplayText, PathCallback, UploadTask } from './utils';
+export declare enum FileStatus {
+    ADDED = "added",
+    QUEUED = "queued",
+    UPLOADING = "uploading",
+    PAUSED = "paused",
+    ERROR = "error",
+    UPLOADED = "uploaded"
+}
+export interface StorageFile {
+    id: string;
+    file?: File;
+    status: FileStatus;
+    progress: number;
+    processedKey?: string;
+    uploadTask?: UploadTask;
+    key: string;
+    error: string;
+    isImage: boolean;
+}
+export type StorageFiles = StorageFile[];
+export type DefaultFile = Pick<StorageFile, 'key'>;
+export interface ProcessFileParams extends Record<string, any> {
+    file: File;
+    key: string;
+    useAccelerateEndpoint?: boolean;
+}
+export type ProcessFile = (params: ProcessFileParams) => Promise<ProcessFileParams> | ProcessFileParams;
+export interface FileUploaderHandle {
+    clearFiles: () => void;
+}
+export interface FileUploaderProps {
+    /**
+     * List of accepted File types, values of `['*']` or undefined allow any files
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept
+     */
+    acceptedFileTypes?: string[];
+    /**
+     * Access level for file uploads
+     * @see https://docs.amplify.aws/lib/storage/configureaccess/q/platform/js/
+     */
+    accessLevel: StorageAccessLevel;
+    /**
+     * Determines if the upload will automatically start after a file is selected, default value: true
+     */
+    autoUpload?: boolean;
+    /**
+     * Component overrides
+     */
+    components?: {
+        Container?: React.ComponentType<ContainerProps>;
+        DropZone?: React.ComponentType<DropZoneProps>;
+        FileList?: React.ComponentType<FileListProps>;
+        FilePicker?: React.ComponentType<FilePickerProps>;
+        FileListHeader?: React.ComponentType<FileListHeaderProps>;
+        FileListFooter?: React.ComponentType<FileListFooterProps>;
+    };
+    /**
+     * List of default files already uploaded
+     */
+    defaultFiles?: DefaultFile[];
+    /**
+     * Overrides default display text
+     */
+    displayText?: FileUploaderDisplayText;
+    /**
+     * Determines if upload can be paused / resumed
+     */
+    isResumable?: boolean;
+    /**
+     * Maximum total files to upload in each batch
+     */
+    maxFileCount: number;
+    /**
+     * Maximum file size in bytes
+     */
+    maxFileSize?: number;
+    /**
+     * When a file is removed
+     */
+    onFileRemove?: (file: {
+        key: string;
+    }) => void;
+    /**
+     * Monitor upload errors
+     */
+    onUploadError?: (error: string, file: {
+        key: string;
+    }) => void;
+    /**
+     * Monitor upload success
+     */
+    onUploadSuccess?: (event: {
+        key?: string;
+    }) => void;
+    /**
+     * When a file begins uploading
+     */
+    onUploadStart?: (event: {
+        key?: string;
+    }) => void;
+    /**
+     * Process file before upload
+     */
+    processFile?: ProcessFile;
+    /**
+     * Determines if thumbnails show for image files
+     */
+    showThumbnails?: boolean;
+    /**
+     * Provided value is prefixed to the file `key` for each file
+     */
+    path?: string;
+    useAccelerateEndpoint?: boolean;
+}
+export interface FileUploaderPathProps extends Omit<FileUploaderProps, 'accessLevel' | 'path'> {
+    /**
+     * S3 bucket key, allows either a `string` or a `PathCallback`:
+     * - `string`: `path` is prefixed to the file `key` for each file
+     * - `PathCallback`: callback provided an input containing the current `identityId`,
+     *    resolved value is prefixed to the file `key` for each file
+     */
+    path: string | PathCallback;
+    accessLevel?: never;
+    useAccelerateEndpoint?: boolean;
+}

package/dist/types/components/FileUploader/ui/Container/Container.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface ContainerProps {
+    children: React.ReactNode;
+    className: string;
+}
+export declare function Container({ children, className, }: ContainerProps): JSX.Element;

package/dist/types/components/FileUploader/ui/Container/index.d.ts

@@ -0,0 +1 @@
+export { Container, ContainerProps } from './Container';

package/dist/types/components/FileUploader/ui/DropZone/DropZone.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DropZoneProps } from './types';
+export declare function DropZone({ children, displayText, inDropZone, onDragEnter, onDragLeave, onDragOver, onDragStart, onDrop, testId, }: DropZoneProps): JSX.Element;

package/dist/types/components/FileUploader/ui/DropZone/index.d.ts

@@ -0,0 +1,2 @@
+export { DropZone } from './DropZone';
+export { DropZoneProps } from './types';

package/dist/types/components/FileUploader/ui/DropZone/types.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { FileUploaderDisplayText } from '../../utils/displayText';
+export interface DropZoneProps {
+    children?: React.ReactNode;
+    displayText: FileUploaderDisplayText;
+    inDropZone: boolean;
+    onDragEnter: (event: React.DragEvent<HTMLDivElement>) => void;
+    onDragLeave: (event: React.DragEvent<HTMLDivElement>) => void;
+    onDragOver: (event: React.DragEvent<HTMLDivElement>) => void;
+    onDragStart: (event: React.DragEvent<HTMLDivElement>) => void;
+    onDrop: (event: React.DragEvent<HTMLDivElement>) => void;
+    testId?: string;
+}

package/dist/types/components/FileUploader/ui/FileList/FileControl.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FileControlProps } from './types';
+export declare function FileControl({ onPause, onResume, displayName, errorMessage, isImage, isResumable, loaderIsDeterminate, onRemove, progress, showThumbnails, size, status, displayText, thumbnailUrl, }: FileControlProps): JSX.Element;

package/dist/types/components/FileUploader/ui/FileList/FileDetails.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { UploadDetailsProps } from './types';
+export declare const UploadDetails: ({ displayName, fileSize, }: UploadDetailsProps) => JSX.Element;

package/dist/types/components/FileUploader/ui/FileList/FileList.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FileListProps } from './types';
+export declare function FileList({ displayText, files, hasMaxFilesError, isResumable, onCancelUpload, onDeleteUpload, onResume, onPause, showThumbnails, maxFileCount, }: FileListProps): JSX.Element | null;

package/dist/types/components/FileUploader/ui/FileList/FileRemoveButton.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FileRemoveButtonProps } from './types';
+export declare const FileRemoveButton: ({ altText, onClick, }: FileRemoveButtonProps) => JSX.Element;

package/dist/types/components/FileUploader/ui/FileList/FileStatusMessage.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FileStatusMessageProps } from './types';
+export declare const FileStatusMessage: ({ errorMessage, getPausedText, getUploadingText, percentage, status, uploadSuccessfulText, }: FileStatusMessageProps) => JSX.Element | null;

package/dist/types/components/FileUploader/ui/FileList/FileThumbnail.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { FileThumbnailProps } from './types';
+export declare const FileThumbnail: ({ fileName, isImage, url, }: FileThumbnailProps) => JSX.Element;

package/dist/types/components/FileUploader/ui/FileList/index.d.ts

@@ -0,0 +1,2 @@
+export { FileList } from './FileList';
+export { FileListProps } from './types';

package/dist/types/components/FileUploader/ui/FileList/types.d.ts

@@ -0,0 +1,51 @@
+import { FileUploaderDisplayTextDefault, TaskHandler } from '../../utils';
+import { FileStatus, StorageFile } from '../../types';
+export interface FileListProps {
+    displayText: FileUploaderDisplayTextDefault;
+    files: StorageFile[];
+    isResumable: boolean;
+    onCancelUpload: TaskHandler;
+    onDeleteUpload: (params: {
+        id: string;
+    }) => void;
+    onPause: TaskHandler;
+    onResume: TaskHandler;
+    showThumbnails: boolean;
+    hasMaxFilesError: boolean;
+    maxFileCount: number;
+}
+export interface FileControlProps {
+    displayText: FileUploaderDisplayTextDefault;
+    displayName: string;
+    errorMessage: string;
+    isImage: boolean;
+    isResumable: boolean;
+    isUploading: boolean;
+    loaderIsDeterminate: boolean;
+    onRemove: () => void;
+    onPause: () => void;
+    onResume: () => void;
+    progress: number;
+    showThumbnails: boolean;
+    size?: number;
+    status: FileStatus;
+    thumbnailUrl: string;
+}
+export interface FileStatusMessageProps extends Pick<FileUploaderDisplayTextDefault, 'getUploadingText' | 'getPausedText' | 'uploadSuccessfulText'> {
+    status: FileStatus;
+    errorMessage: string;
+    percentage: number;
+}
+export interface UploadDetailsProps {
+    displayName: string;
+    fileSize?: number;
+}
+export interface FileThumbnailProps {
+    isImage: boolean;
+    fileName: string;
+    url: string;
+}
+export interface FileRemoveButtonProps {
+    altText: string;
+    onClick: () => void;
+}

package/dist/types/components/FileUploader/ui/FileListFooter/FileListFooter.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { FileUploaderDisplayTextDefault } from '../../utils';
+export interface FileListFooterProps {
+    remainingFilesCount: number;
+    displayText: FileUploaderDisplayTextDefault;
+    onClearAll: () => void;
+    onUploadAll: () => void;
+}
+export declare function FileListFooter({ displayText, remainingFilesCount, onClearAll, onUploadAll, }: FileListFooterProps): JSX.Element;

package/dist/types/components/FileUploader/ui/FileListFooter/index.d.ts

@@ -0,0 +1 @@
+export { FileListFooter, FileListFooterProps } from './FileListFooter';

package/dist/types/components/FileUploader/ui/FileListHeader/FileListHeader.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { FileUploaderDisplayTextDefault } from '../../utils';
+export interface FileListHeaderProps {
+    allUploadsSuccessful: boolean;
+    displayText: FileUploaderDisplayTextDefault;
+    fileCount: number;
+    remainingFilesCount: number;
+    selectedFilesCount?: number;
+}
+export declare function FileListHeader({ allUploadsSuccessful, displayText, fileCount, remainingFilesCount, selectedFilesCount, }: FileListHeaderProps): JSX.Element;

package/dist/types/components/FileUploader/ui/FileListHeader/index.d.ts

@@ -0,0 +1 @@
+export { FileListHeader, FileListHeaderProps } from './FileListHeader';

package/dist/types/components/FileUploader/ui/FilePicker/FilePicker.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { ButtonProps } from '@aws-amplify/ui-react';
+export type FilePickerProps = ButtonProps;
+export declare function FilePicker({ children, className, size, ...props }: FilePickerProps): JSX.Element;

package/dist/types/components/FileUploader/ui/FilePicker/index.d.ts

@@ -0,0 +1 @@
+export { FilePicker, FilePickerProps } from './FilePicker';

package/dist/types/components/FileUploader/ui/index.d.ts

@@ -0,0 +1,6 @@
+export { Container, ContainerProps } from './Container';
+export { DropZone, DropZoneProps } from './DropZone';
+export { FileList, FileListProps } from './FileList';
+export { FileListHeader, FileListHeaderProps } from './FileListHeader';
+export { FileListFooter, FileListFooterProps } from './FileListFooter';
+export { FilePicker, FilePickerProps } from './FilePicker';

package/dist/types/components/FileUploader/utils/checkMaxFileSize.d.ts

@@ -0,0 +1,5 @@
+export declare const checkMaxFileSize: ({ file, getFileSizeErrorText, maxFileSize, }: {
+    file: File;
+    getFileSizeErrorText: (sizeText: string) => string;
+    maxFileSize?: number | undefined;
+}) => string;