@aws-amplify/ui-react-storage 3.3.3 → 3.3.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/components/FileUploader/FileUploader.mjs +2 -4
- package/dist/esm/components/FileUploader/hooks/useFileUploader/actions.mjs +8 -5
- package/dist/esm/components/FileUploader/hooks/useFileUploader/reducer.mjs +16 -28
- package/dist/esm/components/FileUploader/hooks/useFileUploader/types.mjs +9 -8
- package/dist/esm/components/FileUploader/hooks/useFileUploader/useFileUploader.mjs +31 -44
- package/dist/esm/components/FileUploader/hooks/useUploadFiles/useUploadFiles.mjs +5 -9
- package/dist/esm/components/FileUploader/utils/getInput.mjs +1 -5
- package/dist/esm/components/StorageManager/StorageManager.mjs +9 -11
- package/dist/esm/components/StorageManager/ui/FileList/FileControl.mjs +1 -1
- package/dist/esm/components/StorageManager/ui/FileList/FileList.mjs +1 -1
- package/dist/esm/components/StorageManager/ui/FileList/FileStatusMessage.mjs +1 -1
- package/dist/esm/version.mjs +1 -1
- package/dist/index.js +115 -569
- package/dist/styles.css +42 -23
- package/dist/types/components/FileUploader/hooks/useFileUploader/actions.d.ts +4 -4
- package/dist/types/components/FileUploader/hooks/useFileUploader/types.d.ts +12 -10
- package/dist/types/components/FileUploader/hooks/useFileUploader/useFileUploader.d.ts +7 -10
- package/dist/types/components/FileUploader/hooks/useUploadFiles/useUploadFiles.d.ts +1 -5
- package/dist/types/components/FileUploader/index.d.ts +1 -1
- package/dist/types/components/FileUploader/types.d.ts +1 -1
- package/dist/types/components/FileUploader/utils/getInput.d.ts +1 -4
- package/dist/types/components/StorageManager/index.d.ts +1 -1
- package/dist/types/components/StorageManager/types.d.ts +2 -9
- package/dist/types/components/StorageManager/ui/DropZone/types.d.ts +1 -1
- package/dist/types/components/StorageManager/ui/FileList/types.d.ts +2 -2
- package/dist/types/components/StorageManager/ui/FileListFooter/FileListFooter.d.ts +1 -1
- package/dist/types/components/StorageManager/ui/FileListHeader/FileListHeader.d.ts +1 -1
- package/dist/types/components/index.d.ts +2 -2
- package/dist/types/index.d.ts +1 -1
- package/dist/types/version.d.ts +1 -1
- package/package.json +6 -5
- package/dist/esm/components/StorageManager/hooks/useStorageManager/actions.mjs +0 -39
- package/dist/esm/components/StorageManager/hooks/useStorageManager/reducer.mjs +0 -93
- package/dist/esm/components/StorageManager/hooks/useStorageManager/types.mjs +0 -13
- package/dist/esm/components/StorageManager/hooks/useStorageManager/useStorageManager.mjs +0 -62
- package/dist/esm/components/StorageManager/hooks/useUploadFiles/useUploadFiles.mjs +0 -79
- package/dist/esm/components/StorageManager/types.mjs +0 -11
- package/dist/esm/components/StorageManager/utils/checkMaxFileSize.mjs +0 -12
- package/dist/esm/components/StorageManager/utils/displayText.mjs +0 -39
- package/dist/esm/components/StorageManager/utils/filterAllowedFiles.mjs +0 -27
- package/dist/esm/components/StorageManager/utils/getInput.mjs +0 -39
- package/dist/esm/components/StorageManager/utils/resolveFile.mjs +0 -20
- package/dist/esm/components/StorageManager/utils/uploadFile.mjs +0 -26
- package/dist/types/components/StorageManager/hooks/index.d.ts +0 -2
- package/dist/types/components/StorageManager/hooks/useStorageManager/actions.d.ts +0 -22
- package/dist/types/components/StorageManager/hooks/useStorageManager/index.d.ts +0 -1
- package/dist/types/components/StorageManager/hooks/useStorageManager/reducer.d.ts +0 -2
- package/dist/types/components/StorageManager/hooks/useStorageManager/types.d.ts +0 -50
- package/dist/types/components/StorageManager/hooks/useStorageManager/useStorageManager.d.ts +0 -35
- package/dist/types/components/StorageManager/hooks/useUploadFiles/index.d.ts +0 -1
- package/dist/types/components/StorageManager/hooks/useUploadFiles/useUploadFiles.d.ts +0 -12
- package/dist/types/components/StorageManager/utils/checkMaxFileSize.d.ts +0 -5
- package/dist/types/components/StorageManager/utils/displayText.d.ts +0 -22
- package/dist/types/components/StorageManager/utils/filterAllowedFiles.d.ts +0 -1
- package/dist/types/components/StorageManager/utils/getInput.d.ts +0 -17
- package/dist/types/components/StorageManager/utils/index.d.ts +0 -5
- package/dist/types/components/StorageManager/utils/resolveFile.d.ts +0 -9
- package/dist/types/components/StorageManager/utils/uploadFile.d.ts +0 -32
package/dist/styles.css
CHANGED
|
@@ -1730,8 +1730,9 @@ strong.amplify-text {
|
|
|
1730
1730
|
padding-inline-start: var(--amplify-components-button-padding-inline-start);
|
|
1731
1731
|
padding-inline-end: var(--amplify-components-button-padding-inline-end);
|
|
1732
1732
|
transition: all var(--amplify-components-button-transition-duration);
|
|
1733
|
-
-
|
|
1734
|
-
|
|
1733
|
+
-webkit-user-select: none;
|
|
1734
|
+
-moz-user-select: none;
|
|
1735
|
+
user-select: none;
|
|
1735
1736
|
--amplify-internal-button-disabled-color: var(
|
|
1736
1737
|
--amplify-components-button-disabled-color
|
|
1737
1738
|
);
|
|
@@ -2752,50 +2753,58 @@ strong.amplify-text {
|
|
|
2752
2753
|
background-color: var(--amplify-internal-button-disabled-background-color);
|
|
2753
2754
|
border-color: var(--amplify-internal-button-disabled-border-color);
|
|
2754
2755
|
color: var(--amplify-internal-button-disabled-color);
|
|
2755
|
-
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2756
|
+
-webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2757
|
+
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2756
2758
|
cursor: not-allowed;
|
|
2757
2759
|
}
|
|
2758
2760
|
.amplify-button--disabled:hover {
|
|
2759
2761
|
background-color: var(--amplify-internal-button-disabled-background-color);
|
|
2760
2762
|
border-color: var(--amplify-internal-button-disabled-border-color);
|
|
2761
2763
|
color: var(--amplify-internal-button-disabled-color);
|
|
2762
|
-
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2764
|
+
-webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2765
|
+
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2763
2766
|
}
|
|
2764
2767
|
.amplify-button--disabled :focus {
|
|
2765
2768
|
background-color: var(--amplify-internal-button-disabled-background-color);
|
|
2766
2769
|
border-color: var(--amplify-internal-button-disabled-border-color);
|
|
2767
2770
|
color: var(--amplify-internal-button-disabled-color);
|
|
2768
|
-
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2771
|
+
-webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2772
|
+
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2769
2773
|
}
|
|
2770
2774
|
.amplify-button--disabled:active {
|
|
2771
2775
|
background-color: var(--amplify-internal-button-disabled-background-color);
|
|
2772
2776
|
border-color: var(--amplify-internal-button-disabled-border-color);
|
|
2773
2777
|
color: var(--amplify-internal-button-disabled-color);
|
|
2774
|
-
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2778
|
+
-webkit-text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2779
|
+
text-decoration: var(--amplify-internal-button-disabled-text-decoration);
|
|
2775
2780
|
}
|
|
2776
2781
|
.amplify-button--loading {
|
|
2777
2782
|
background-color: var(--amplify-internal-button-loading-background-color);
|
|
2778
2783
|
border-color: var(--amplify-internal-button-loading-border-color);
|
|
2779
2784
|
color: var(--amplify-components-button-loading-color);
|
|
2780
|
-
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2785
|
+
-webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2786
|
+
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2781
2787
|
}
|
|
2782
2788
|
.amplify-button--loading:hover {
|
|
2783
2789
|
background-color: var(--amplify-internal-button-loading-background-color);
|
|
2784
2790
|
border-color: var(--amplify-internal-button-loading-border-color);
|
|
2785
2791
|
color: var(--amplify-components-button-loading-color);
|
|
2786
|
-
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2792
|
+
-webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2793
|
+
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2787
2794
|
}
|
|
2788
2795
|
.amplify-button--loading:focus {
|
|
2789
2796
|
background-color: var(--amplify-internal-button-loading-background-color);
|
|
2790
2797
|
border-color: var(--amplify-internal-button-loading-border-color);
|
|
2791
2798
|
color: var(--amplify-components-button-loading-color);
|
|
2792
|
-
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2799
|
+
-webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2800
|
+
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2793
2801
|
}
|
|
2794
2802
|
.amplify-button--loading:active {
|
|
2795
2803
|
background-color: var(--amplify-internal-button-loading-background-color);
|
|
2796
2804
|
border-color: var(--amplify-internal-button-loading-border-color);
|
|
2797
2805
|
color: var(--amplify-components-button-loading-color);
|
|
2798
|
-
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2806
|
+
-webkit-text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2807
|
+
text-decoration: var(--amplify-internal-button-loading-text-decoration);
|
|
2799
2808
|
}
|
|
2800
2809
|
.amplify-button__loader-wrapper {
|
|
2801
2810
|
align-items: var(--amplify-components-button-loader-wrapper-align-items);
|
|
@@ -2943,8 +2952,9 @@ strong.amplify-text {
|
|
|
2943
2952
|
outline-style: var(--amplify-components-fieldcontrol-outline-style);
|
|
2944
2953
|
outline-width: var(--amplify-components-fieldcontrol-outline-width);
|
|
2945
2954
|
outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
|
|
2946
|
-
-
|
|
2947
|
-
|
|
2955
|
+
-webkit-user-select: text;
|
|
2956
|
+
-moz-user-select: text;
|
|
2957
|
+
user-select: text;
|
|
2948
2958
|
display: inline-block;
|
|
2949
2959
|
--amplify-components-fieldcontrol-color: var(
|
|
2950
2960
|
--amplify-components-input-color
|
|
@@ -3027,8 +3037,9 @@ strong.amplify-text {
|
|
|
3027
3037
|
outline-style: var(--amplify-components-fieldcontrol-outline-style);
|
|
3028
3038
|
outline-width: var(--amplify-components-fieldcontrol-outline-width);
|
|
3029
3039
|
outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
|
|
3030
|
-
-
|
|
3031
|
-
|
|
3040
|
+
-webkit-user-select: text;
|
|
3041
|
+
-moz-user-select: text;
|
|
3042
|
+
user-select: text;
|
|
3032
3043
|
white-space: pre-wrap;
|
|
3033
3044
|
}
|
|
3034
3045
|
.amplify-textarea:focus {
|
|
@@ -3092,24 +3103,29 @@ strong.amplify-text {
|
|
|
3092
3103
|
|
|
3093
3104
|
.amplify-link {
|
|
3094
3105
|
color: var(--amplify-components-link-color);
|
|
3095
|
-
text-decoration: var(--amplify-components-link-text-decoration);
|
|
3106
|
+
-webkit-text-decoration: var(--amplify-components-link-text-decoration);
|
|
3107
|
+
text-decoration: var(--amplify-components-link-text-decoration);
|
|
3096
3108
|
cursor: pointer;
|
|
3097
3109
|
}
|
|
3098
3110
|
.amplify-link:visited {
|
|
3099
3111
|
color: var(--amplify-components-link-visited-color);
|
|
3100
|
-
text-decoration: var(--amplify-components-link-visited-text-decoration);
|
|
3112
|
+
-webkit-text-decoration: var(--amplify-components-link-visited-text-decoration);
|
|
3113
|
+
text-decoration: var(--amplify-components-link-visited-text-decoration);
|
|
3101
3114
|
}
|
|
3102
3115
|
.amplify-link:active {
|
|
3103
3116
|
color: var(--amplify-components-link-active-color);
|
|
3104
|
-
text-decoration: var(--amplify-components-link-active-text-decoration);
|
|
3117
|
+
-webkit-text-decoration: var(--amplify-components-link-active-text-decoration);
|
|
3118
|
+
text-decoration: var(--amplify-components-link-active-text-decoration);
|
|
3105
3119
|
}
|
|
3106
3120
|
.amplify-link:focus {
|
|
3107
3121
|
color: var(--amplify-components-link-focus-color);
|
|
3108
|
-
text-decoration: var(--amplify-components-link-focus-text-decoration);
|
|
3122
|
+
-webkit-text-decoration: var(--amplify-components-link-focus-text-decoration);
|
|
3123
|
+
text-decoration: var(--amplify-components-link-focus-text-decoration);
|
|
3109
3124
|
}
|
|
3110
3125
|
.amplify-link:hover {
|
|
3111
3126
|
color: var(--amplify-components-link-hover-color);
|
|
3112
|
-
text-decoration: var(--amplify-components-link-hover-text-decoration);
|
|
3127
|
+
-webkit-text-decoration: var(--amplify-components-link-hover-text-decoration);
|
|
3128
|
+
text-decoration: var(--amplify-components-link-hover-text-decoration);
|
|
3113
3129
|
}
|
|
3114
3130
|
|
|
3115
3131
|
.amplify-loader {
|
|
@@ -3672,14 +3688,16 @@ strong.amplify-text {
|
|
|
3672
3688
|
font-weight: var(--amplify-components-breadcrumbs-link-font-weight);
|
|
3673
3689
|
padding-inline: var(--amplify-components-breadcrumbs-link-padding-inline);
|
|
3674
3690
|
padding-block: var(--amplify-components-breadcrumbs-link-padding-block);
|
|
3675
|
-
text-decoration: var(--amplify-components-breadcrumbs-link-text-decoration);
|
|
3691
|
+
-webkit-text-decoration: var(--amplify-components-breadcrumbs-link-text-decoration);
|
|
3692
|
+
text-decoration: var(--amplify-components-breadcrumbs-link-text-decoration);
|
|
3676
3693
|
}
|
|
3677
3694
|
|
|
3678
3695
|
.amplify-breadcrumbs__link--current {
|
|
3679
3696
|
color: var(--amplify-components-breadcrumbs-link-current-color);
|
|
3680
3697
|
font-size: var(--amplify-components-breadcrumbs-link-current-font-size);
|
|
3681
3698
|
font-weight: var(--amplify-components-breadcrumbs-link-current-font-weight);
|
|
3682
|
-
text-decoration: var(--amplify-components-breadcrumbs-link-current-text-decoration);
|
|
3699
|
+
-webkit-text-decoration: var(--amplify-components-breadcrumbs-link-current-text-decoration);
|
|
3700
|
+
text-decoration: var(--amplify-components-breadcrumbs-link-current-text-decoration);
|
|
3683
3701
|
}
|
|
3684
3702
|
|
|
3685
3703
|
.amplify-card {
|
|
@@ -5229,8 +5247,9 @@ html[dir=rtl] .amplify-field-group__inner-start {
|
|
|
5229
5247
|
padding-block: var(--amplify-components-sliderfield-padding-block);
|
|
5230
5248
|
position: relative;
|
|
5231
5249
|
touch-action: none;
|
|
5232
|
-
-
|
|
5233
|
-
|
|
5250
|
+
-webkit-user-select: none;
|
|
5251
|
+
-moz-user-select: none;
|
|
5252
|
+
user-select: none;
|
|
5234
5253
|
--amplify-internal-sliderfield-root-height: var(
|
|
5235
5254
|
--amplify-components-sliderfield-thumb-height
|
|
5236
5255
|
);
|
|
@@ -4,10 +4,6 @@ import { TaskEvent } from '../../utils';
|
|
|
4
4
|
export declare const addFilesAction: ({ files, status, getFileErrorMessage, }: AddFilesActionParams) => Action;
|
|
5
5
|
export declare const clearFilesAction: () => Action;
|
|
6
6
|
export declare const queueFilesAction: () => Action;
|
|
7
|
-
export declare const setProcessedKeyAction: (input: {
|
|
8
|
-
id: string;
|
|
9
|
-
processedKey: string;
|
|
10
|
-
}) => Action;
|
|
11
7
|
export declare const setUploadingFileAction: ({ id, uploadTask, }: TaskEvent) => Action;
|
|
12
8
|
export declare const setUploadProgressAction: ({ id, progress, }: {
|
|
13
9
|
id: string;
|
|
@@ -17,6 +13,10 @@ export declare const setUploadStatusAction: ({ id, status, }: {
|
|
|
17
13
|
id: string;
|
|
18
14
|
status: FileStatus;
|
|
19
15
|
}) => Action;
|
|
16
|
+
export declare const setUploadSuccessAction: ({ id, resolvedKey, }: {
|
|
17
|
+
id: string;
|
|
18
|
+
resolvedKey: string;
|
|
19
|
+
}) => Action;
|
|
20
20
|
export declare const removeUploadAction: ({ id }: {
|
|
21
21
|
id: string;
|
|
22
22
|
}) => Action;
|
|
@@ -4,14 +4,15 @@ export interface UseFileUploaderState {
|
|
|
4
4
|
files: StorageFiles;
|
|
5
5
|
}
|
|
6
6
|
export declare enum FileUploaderActionTypes {
|
|
7
|
-
ADD_FILES =
|
|
8
|
-
CLEAR_FILES =
|
|
9
|
-
QUEUE_FILES =
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
7
|
+
ADD_FILES = 0,
|
|
8
|
+
CLEAR_FILES = 1,
|
|
9
|
+
QUEUE_FILES = 2,
|
|
10
|
+
REMOVE_UPLOAD = 3,
|
|
11
|
+
SET_STATUS = 4,
|
|
12
|
+
SET_PROCESSED_FILE_KEY = 5,
|
|
13
|
+
SET_STATUS_UPLOADED = 6,
|
|
14
|
+
SET_STATUS_UPLOADING = 7,
|
|
15
|
+
SET_UPLOAD_PROGRESS = 8
|
|
15
16
|
}
|
|
16
17
|
export type GetFileErrorMessage = (file: File) => string;
|
|
17
18
|
export type Action = {
|
|
@@ -36,9 +37,10 @@ export type Action = {
|
|
|
36
37
|
id: string;
|
|
37
38
|
progress: number;
|
|
38
39
|
} | {
|
|
39
|
-
type: FileUploaderActionTypes.
|
|
40
|
+
type: FileUploaderActionTypes.SET_STATUS_UPLOADED;
|
|
40
41
|
id: string;
|
|
41
|
-
|
|
42
|
+
resolvedKey: string;
|
|
43
|
+
status: FileStatus.UPLOADED;
|
|
42
44
|
} | {
|
|
43
45
|
type: FileUploaderActionTypes.REMOVE_UPLOAD;
|
|
44
46
|
id: string;
|
|
@@ -8,28 +8,25 @@ export interface UseFileUploader {
|
|
|
8
8
|
getFileErrorMessage: GetFileErrorMessage;
|
|
9
9
|
}) => void;
|
|
10
10
|
clearFiles: () => void;
|
|
11
|
+
files: StorageFiles;
|
|
11
12
|
queueFiles: () => void;
|
|
13
|
+
removeUpload: (params: {
|
|
14
|
+
id: string;
|
|
15
|
+
}) => void;
|
|
12
16
|
setUploadingFile: TaskHandler;
|
|
13
|
-
|
|
17
|
+
setUploadPaused: (params: {
|
|
14
18
|
id: string;
|
|
15
|
-
processedKey: string;
|
|
16
19
|
}) => void;
|
|
17
20
|
setUploadProgress: (params: {
|
|
18
21
|
id: string;
|
|
19
22
|
progress: number;
|
|
20
23
|
}) => void;
|
|
21
|
-
setUploadSuccess: (params: {
|
|
22
|
-
id: string;
|
|
23
|
-
}) => void;
|
|
24
24
|
setUploadResumed: (params: {
|
|
25
25
|
id: string;
|
|
26
26
|
}) => void;
|
|
27
|
-
|
|
28
|
-
id: string;
|
|
29
|
-
}) => void;
|
|
30
|
-
removeUpload: (params: {
|
|
27
|
+
setUploadSuccess: (params: {
|
|
31
28
|
id: string;
|
|
29
|
+
resolvedKey: string;
|
|
32
30
|
}) => void;
|
|
33
|
-
files: StorageFiles;
|
|
34
31
|
}
|
|
35
32
|
export declare function useFileUploader(defaultFiles?: Array<DefaultFile>): UseFileUploader;
|
|
@@ -3,10 +3,6 @@ import { FileUploaderProps } from '../../types';
|
|
|
3
3
|
import { UseFileUploader } from '../useFileUploader';
|
|
4
4
|
export interface UseUploadFilesProps extends Pick<FileUploaderProps, 'isResumable' | 'onUploadSuccess' | 'onUploadError' | 'onUploadStart' | 'maxFileCount' | 'processFile' | 'useAccelerateEndpoint'>, Pick<UseFileUploader, 'setUploadingFile' | 'setUploadProgress' | 'setUploadSuccess' | 'files'> {
|
|
5
5
|
accessLevel?: FileUploaderProps['accessLevel'];
|
|
6
|
-
onProcessFileSuccess: (input: {
|
|
7
|
-
id: string;
|
|
8
|
-
processedKey: string;
|
|
9
|
-
}) => void;
|
|
10
6
|
path?: string | PathCallback;
|
|
11
7
|
}
|
|
12
|
-
export declare function useUploadFiles({ accessLevel, files, isResumable, maxFileCount,
|
|
8
|
+
export declare function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }: UseUploadFilesProps): void;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export { FileUploader } from './FileUploader';
|
|
2
|
-
export { FileUploaderProps } from './types';
|
|
2
|
+
export { FileUploaderHandle, FileUploaderProps } from './types';
|
|
3
3
|
export { DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './ui';
|
|
@@ -6,12 +6,9 @@ export interface GetInputParams {
|
|
|
6
6
|
accessLevel: StorageAccessLevel | undefined;
|
|
7
7
|
file: File;
|
|
8
8
|
key: string;
|
|
9
|
-
onProcessFileSuccess: (input: {
|
|
10
|
-
processedKey: string;
|
|
11
|
-
}) => void;
|
|
12
9
|
onProgress: NonNullable<UploadDataWithPathInput['options']>['onProgress'];
|
|
13
10
|
path: string | PathCallback | undefined;
|
|
14
11
|
processFile: ProcessFile | undefined;
|
|
15
12
|
useAccelerateEndpoint?: boolean;
|
|
16
13
|
}
|
|
17
|
-
export declare const getInput: ({ accessLevel, file, key,
|
|
14
|
+
export declare const getInput: ({ accessLevel, file, key, onProgress, path, processFile, useAccelerateEndpoint, }: GetInputParams) => () => Promise<PathInput | UploadDataInput>;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export { StorageManager } from './StorageManager';
|
|
2
|
-
export { StorageManagerProps } from './types';
|
|
2
|
+
export { StorageManagerHandle, StorageManagerProps } from './types';
|
|
3
3
|
export { DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './ui';
|
|
@@ -1,15 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import type { StorageAccessLevel } from '@aws-amplify/core';
|
|
3
|
+
import { FileStatus } from '../FileUploader/types';
|
|
4
|
+
import { FileUploaderDisplayText as StorageManagerDisplayText, PathCallback, UploadTask } from '../FileUploader/utils';
|
|
3
5
|
import { ContainerProps, DropZoneProps, FileListHeaderProps, FileListFooterProps, FileListProps, FilePickerProps } from './ui';
|
|
4
|
-
import { StorageManagerDisplayText, PathCallback, UploadTask } from './utils';
|
|
5
|
-
export declare enum FileStatus {
|
|
6
|
-
ADDED = "added",
|
|
7
|
-
QUEUED = "queued",
|
|
8
|
-
UPLOADING = "uploading",
|
|
9
|
-
PAUSED = "paused",
|
|
10
|
-
ERROR = "error",
|
|
11
|
-
UPLOADED = "uploaded"
|
|
12
|
-
}
|
|
13
6
|
export interface StorageFile {
|
|
14
7
|
id: string;
|
|
15
8
|
file?: File;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { StorageManagerDisplayText } from '
|
|
2
|
+
import { FileUploaderDisplayText as StorageManagerDisplayText } from '../../../FileUploader/utils/displayText';
|
|
3
3
|
export interface DropZoneProps {
|
|
4
4
|
children?: React.ReactNode;
|
|
5
5
|
displayText: StorageManagerDisplayText;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { StorageManagerDisplayTextDefault, TaskHandler } from '
|
|
2
|
-
import { FileStatus, StorageFile } from '
|
|
1
|
+
import { FileUploaderDisplayTextDefault as StorageManagerDisplayTextDefault, TaskHandler } from '../../../FileUploader/utils';
|
|
2
|
+
import { FileStatus, StorageFile } from '../../../FileUploader/types';
|
|
3
3
|
export interface FileListProps {
|
|
4
4
|
displayText: StorageManagerDisplayTextDefault;
|
|
5
5
|
files: StorageFile[];
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { StorageManagerDisplayTextDefault } from '
|
|
2
|
+
import { FileUploaderDisplayTextDefault as StorageManagerDisplayTextDefault } from '../../../FileUploader/utils';
|
|
3
3
|
export interface FileListFooterProps {
|
|
4
4
|
remainingFilesCount: number;
|
|
5
5
|
displayText: StorageManagerDisplayTextDefault;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { StorageManagerDisplayTextDefault } from '
|
|
2
|
+
import { FileUploaderDisplayTextDefault as StorageManagerDisplayTextDefault } from '../../../FileUploader/utils';
|
|
3
3
|
export interface FileListHeaderProps {
|
|
4
4
|
allUploadsSuccessful: boolean;
|
|
5
5
|
displayText: StorageManagerDisplayTextDefault;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { FileUploader, FileUploaderProps } from './FileUploader';
|
|
1
|
+
export { FileUploader, FileUploaderHandle, FileUploaderProps, } from './FileUploader';
|
|
2
2
|
export { StorageImage, StorageImageProps } from './StorageImage';
|
|
3
|
-
export { StorageManager, StorageManagerProps, DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './StorageManager';
|
|
3
|
+
export { StorageManager, StorageManagerHandle, StorageManagerProps, DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './StorageManager';
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { FileUploader, FileUploaderProps, StorageImage, StorageImageProps, StorageManager, StorageManagerProps, DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './components';
|
|
1
|
+
export { FileUploader, FileUploaderHandle, FileUploaderProps, StorageImage, StorageImageProps, StorageManager, StorageManagerHandle, StorageManagerProps, DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './components';
|
package/dist/types/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const VERSION = "3.3.
|
|
1
|
+
export declare const VERSION = "3.3.5";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aws-amplify/ui-react-storage",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.5",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"module": "dist/esm/index.mjs",
|
|
6
6
|
"exports": {
|
|
@@ -39,14 +39,15 @@
|
|
|
39
39
|
"typecheck": "tsc --noEmit"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@aws-amplify/ui": "6.
|
|
43
|
-
"@aws-amplify/ui-react": "6.
|
|
44
|
-
"@aws-amplify/ui-react-core": "3.0.
|
|
42
|
+
"@aws-amplify/ui": "6.6.1",
|
|
43
|
+
"@aws-amplify/ui-react": "6.5.1",
|
|
44
|
+
"@aws-amplify/ui-react-core": "3.0.25",
|
|
45
45
|
"lodash": "4.17.21",
|
|
46
46
|
"tslib": "^2.5.2"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
|
-
"aws-amplify": "^6.
|
|
49
|
+
"@aws-amplify/core": "^6.4.0",
|
|
50
|
+
"aws-amplify": "^6.6.0",
|
|
50
51
|
"react": "^16.14.0 || ^17.0 || ^18.0",
|
|
51
52
|
"react-dom": "^16.14.0 || ^17.0 || ^18.0"
|
|
52
53
|
},
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { StorageManagerActionTypes } from './types.mjs';
|
|
2
|
-
|
|
3
|
-
const addFilesAction = ({ files, status, getFileErrorMessage, }) => ({
|
|
4
|
-
type: StorageManagerActionTypes.ADD_FILES,
|
|
5
|
-
files,
|
|
6
|
-
status,
|
|
7
|
-
getFileErrorMessage,
|
|
8
|
-
});
|
|
9
|
-
const clearFilesAction = () => ({
|
|
10
|
-
type: StorageManagerActionTypes.CLEAR_FILES,
|
|
11
|
-
});
|
|
12
|
-
const queueFilesAction = () => ({
|
|
13
|
-
type: StorageManagerActionTypes.QUEUE_FILES,
|
|
14
|
-
});
|
|
15
|
-
const setProcessedKeyAction = (input) => ({
|
|
16
|
-
...input,
|
|
17
|
-
type: StorageManagerActionTypes.SET_PROCESSED_FILE_KEY,
|
|
18
|
-
});
|
|
19
|
-
const setUploadingFileAction = ({ id, uploadTask, }) => ({
|
|
20
|
-
type: StorageManagerActionTypes.SET_STATUS_UPLOADING,
|
|
21
|
-
id,
|
|
22
|
-
uploadTask,
|
|
23
|
-
});
|
|
24
|
-
const setUploadProgressAction = ({ id, progress, }) => ({
|
|
25
|
-
type: StorageManagerActionTypes.SET_UPLOAD_PROGRESS,
|
|
26
|
-
id,
|
|
27
|
-
progress,
|
|
28
|
-
});
|
|
29
|
-
const setUploadStatusAction = ({ id, status, }) => ({
|
|
30
|
-
type: StorageManagerActionTypes.SET_STATUS,
|
|
31
|
-
id,
|
|
32
|
-
status,
|
|
33
|
-
});
|
|
34
|
-
const removeUploadAction = ({ id }) => ({
|
|
35
|
-
type: StorageManagerActionTypes.REMOVE_UPLOAD,
|
|
36
|
-
id,
|
|
37
|
-
});
|
|
38
|
-
|
|
39
|
-
export { addFilesAction, clearFilesAction, queueFilesAction, removeUploadAction, setProcessedKeyAction, setUploadProgressAction, setUploadStatusAction, setUploadingFileAction };
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
import { FileStatus } from '../../types.mjs';
|
|
2
|
-
import { StorageManagerActionTypes } from './types.mjs';
|
|
3
|
-
|
|
4
|
-
const updateFiles = (files, nextFileData) => files.reduce((files, currentFile) => {
|
|
5
|
-
if (currentFile.id === nextFileData.id) {
|
|
6
|
-
return [...files, { ...currentFile, ...nextFileData }];
|
|
7
|
-
}
|
|
8
|
-
return [...files, currentFile];
|
|
9
|
-
}, []);
|
|
10
|
-
function storageManagerStateReducer(state, action) {
|
|
11
|
-
switch (action.type) {
|
|
12
|
-
case StorageManagerActionTypes.ADD_FILES: {
|
|
13
|
-
const { files, status } = action;
|
|
14
|
-
const newUploads = files.map((file) => {
|
|
15
|
-
const errorText = action.getFileErrorMessage(file);
|
|
16
|
-
return {
|
|
17
|
-
// make sure id is unique,
|
|
18
|
-
// we only use it internally and don't send it to Storage
|
|
19
|
-
id: `${Date.now()}-${file.name}`,
|
|
20
|
-
file,
|
|
21
|
-
error: errorText,
|
|
22
|
-
key: file.name,
|
|
23
|
-
status: errorText ? FileStatus.ERROR : status,
|
|
24
|
-
isImage: file.type.startsWith('image/'),
|
|
25
|
-
progress: -1,
|
|
26
|
-
};
|
|
27
|
-
});
|
|
28
|
-
const newFiles = [...state.files, ...newUploads];
|
|
29
|
-
return { ...state, files: newFiles };
|
|
30
|
-
}
|
|
31
|
-
case StorageManagerActionTypes.CLEAR_FILES: {
|
|
32
|
-
return { ...state, files: [] };
|
|
33
|
-
}
|
|
34
|
-
case StorageManagerActionTypes.QUEUE_FILES: {
|
|
35
|
-
const { files } = state;
|
|
36
|
-
const newFiles = files.reduce((files, currentFile) => {
|
|
37
|
-
return [
|
|
38
|
-
...files,
|
|
39
|
-
{
|
|
40
|
-
...currentFile,
|
|
41
|
-
...(currentFile.status === FileStatus.ADDED
|
|
42
|
-
? { status: FileStatus.QUEUED }
|
|
43
|
-
: {}),
|
|
44
|
-
},
|
|
45
|
-
];
|
|
46
|
-
}, []);
|
|
47
|
-
return {
|
|
48
|
-
...state,
|
|
49
|
-
files: newFiles,
|
|
50
|
-
};
|
|
51
|
-
}
|
|
52
|
-
case StorageManagerActionTypes.SET_STATUS_UPLOADING: {
|
|
53
|
-
const { id, uploadTask } = action;
|
|
54
|
-
const status = FileStatus.UPLOADING;
|
|
55
|
-
const progress = 0;
|
|
56
|
-
const nextFileData = { status, progress, id, uploadTask };
|
|
57
|
-
const files = updateFiles(state.files, nextFileData);
|
|
58
|
-
return { ...state, files };
|
|
59
|
-
}
|
|
60
|
-
case StorageManagerActionTypes.SET_PROCESSED_FILE_KEY: {
|
|
61
|
-
const { processedKey, id } = action;
|
|
62
|
-
const files = updateFiles(state.files, { processedKey, id });
|
|
63
|
-
return { files };
|
|
64
|
-
}
|
|
65
|
-
case StorageManagerActionTypes.SET_UPLOAD_PROGRESS: {
|
|
66
|
-
const { id, progress } = action;
|
|
67
|
-
const files = updateFiles(state.files, { id, progress });
|
|
68
|
-
return { ...state, files };
|
|
69
|
-
}
|
|
70
|
-
case StorageManagerActionTypes.SET_STATUS: {
|
|
71
|
-
const { id, status } = action;
|
|
72
|
-
const files = updateFiles(state.files, { id, status });
|
|
73
|
-
return { ...state, files };
|
|
74
|
-
}
|
|
75
|
-
case StorageManagerActionTypes.REMOVE_UPLOAD: {
|
|
76
|
-
const { id } = action;
|
|
77
|
-
const { files } = state;
|
|
78
|
-
const newFiles = files.reduce((files, currentFile) => {
|
|
79
|
-
if (currentFile.id === id) {
|
|
80
|
-
// remove by not returning currentFile
|
|
81
|
-
return [...files];
|
|
82
|
-
}
|
|
83
|
-
return [...files, currentFile];
|
|
84
|
-
}, []);
|
|
85
|
-
return {
|
|
86
|
-
...state,
|
|
87
|
-
files: newFiles,
|
|
88
|
-
};
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
export { storageManagerStateReducer };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
var StorageManagerActionTypes;
|
|
2
|
-
(function (StorageManagerActionTypes) {
|
|
3
|
-
StorageManagerActionTypes["ADD_FILES"] = "ADD_FILES";
|
|
4
|
-
StorageManagerActionTypes["CLEAR_FILES"] = "CLEAR_FILES";
|
|
5
|
-
StorageManagerActionTypes["QUEUE_FILES"] = "QUEUE_FILES";
|
|
6
|
-
StorageManagerActionTypes["SET_STATUS"] = "SET_STATUS";
|
|
7
|
-
StorageManagerActionTypes["SET_PROCESSED_FILE_KEY"] = "SET_PROCESSED_FILE_KEY";
|
|
8
|
-
StorageManagerActionTypes["SET_STATUS_UPLOADING"] = "SET_STATUS_UPLOADING";
|
|
9
|
-
StorageManagerActionTypes["SET_UPLOAD_PROGRESS"] = "SET_UPLOAD_PROGRESS";
|
|
10
|
-
StorageManagerActionTypes["REMOVE_UPLOAD"] = "REMOVE_UPLOAD";
|
|
11
|
-
})(StorageManagerActionTypes || (StorageManagerActionTypes = {}));
|
|
12
|
-
|
|
13
|
-
export { StorageManagerActionTypes };
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
import React__default from 'react';
|
|
2
|
-
import { isObject } from '@aws-amplify/ui';
|
|
3
|
-
import { FileStatus } from '../../types.mjs';
|
|
4
|
-
import { storageManagerStateReducer } from './reducer.mjs';
|
|
5
|
-
import { addFilesAction, clearFilesAction, queueFilesAction, setUploadingFileAction, setProcessedKeyAction, setUploadProgressAction, setUploadStatusAction, removeUploadAction } from './actions.mjs';
|
|
6
|
-
|
|
7
|
-
const isDefaultFile = (file) => !!(isObject(file) && file.key);
|
|
8
|
-
const createFileFromDefault = (file) => isDefaultFile(file)
|
|
9
|
-
? { ...file, id: file.key, status: FileStatus.UPLOADED }
|
|
10
|
-
: undefined;
|
|
11
|
-
function useStorageManager(defaultFiles = []) {
|
|
12
|
-
const [{ files }, dispatch] = React__default.useReducer(storageManagerStateReducer, {
|
|
13
|
-
files: (Array.isArray(defaultFiles)
|
|
14
|
-
? defaultFiles.map(createFileFromDefault).filter((file) => !!file)
|
|
15
|
-
: []),
|
|
16
|
-
});
|
|
17
|
-
const addFiles = ({ files, status, getFileErrorMessage, }) => {
|
|
18
|
-
dispatch(addFilesAction({ files, status, getFileErrorMessage }));
|
|
19
|
-
};
|
|
20
|
-
const clearFiles = () => {
|
|
21
|
-
dispatch(clearFilesAction());
|
|
22
|
-
};
|
|
23
|
-
const queueFiles = () => {
|
|
24
|
-
dispatch(queueFilesAction());
|
|
25
|
-
};
|
|
26
|
-
const setUploadingFile = ({ uploadTask, id, }) => {
|
|
27
|
-
dispatch(setUploadingFileAction({ id, uploadTask }));
|
|
28
|
-
};
|
|
29
|
-
const setProcessedKey = (input) => {
|
|
30
|
-
dispatch(setProcessedKeyAction(input));
|
|
31
|
-
};
|
|
32
|
-
const setUploadProgress = ({ progress, id, }) => {
|
|
33
|
-
dispatch(setUploadProgressAction({ id, progress }));
|
|
34
|
-
};
|
|
35
|
-
const setUploadSuccess = ({ id }) => {
|
|
36
|
-
dispatch(setUploadStatusAction({ id, status: FileStatus.UPLOADED }));
|
|
37
|
-
};
|
|
38
|
-
const setUploadPaused = ({ id }) => {
|
|
39
|
-
dispatch(setUploadStatusAction({ id, status: FileStatus.PAUSED }));
|
|
40
|
-
};
|
|
41
|
-
const setUploadResumed = ({ id }) => {
|
|
42
|
-
dispatch(setUploadStatusAction({ id, status: FileStatus.UPLOADING }));
|
|
43
|
-
};
|
|
44
|
-
const removeUpload = ({ id }) => {
|
|
45
|
-
dispatch(removeUploadAction({ id }));
|
|
46
|
-
};
|
|
47
|
-
return {
|
|
48
|
-
removeUpload,
|
|
49
|
-
setProcessedKey,
|
|
50
|
-
setUploadPaused,
|
|
51
|
-
setUploadProgress,
|
|
52
|
-
setUploadResumed,
|
|
53
|
-
setUploadSuccess,
|
|
54
|
-
setUploadingFile,
|
|
55
|
-
queueFiles,
|
|
56
|
-
addFiles,
|
|
57
|
-
clearFiles,
|
|
58
|
-
files,
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
export { useStorageManager };
|