@aws-amplify/ui-react-storage 3.2.1 → 3.3.1

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.
Files changed (71) hide show
  1. package/dist/esm/components/FileUploader/FileUploader.mjs +185 -0
  2. package/dist/esm/components/FileUploader/hooks/useFileUploader/actions.mjs +39 -0
  3. package/dist/esm/components/FileUploader/hooks/useFileUploader/reducer.mjs +93 -0
  4. package/dist/esm/components/FileUploader/hooks/useFileUploader/types.mjs +13 -0
  5. package/dist/esm/components/FileUploader/hooks/useFileUploader/useFileUploader.mjs +62 -0
  6. package/dist/esm/components/FileUploader/hooks/useUploadFiles/useUploadFiles.mjs +79 -0
  7. package/dist/esm/components/FileUploader/types.mjs +11 -0
  8. package/dist/esm/components/FileUploader/ui/Container/Container.mjs +8 -0
  9. package/dist/esm/components/FileUploader/ui/DropZone/DropZone.mjs +16 -0
  10. package/dist/esm/components/FileUploader/ui/FileList/FileControl.mjs +23 -0
  11. package/dist/esm/components/FileUploader/ui/FileList/FileDetails.mjs +12 -0
  12. package/dist/esm/components/FileUploader/ui/FileList/FileList.mjs +44 -0
  13. package/dist/esm/components/FileUploader/ui/FileList/FileRemoveButton.mjs +12 -0
  14. package/dist/esm/components/FileUploader/ui/FileList/FileStatusMessage.mjs +28 -0
  15. package/dist/esm/components/FileUploader/ui/FileList/FileThumbnail.mjs +12 -0
  16. package/dist/esm/components/FileUploader/ui/FileListFooter/FileListFooter.mjs +13 -0
  17. package/dist/esm/components/FileUploader/ui/FileListHeader/FileListHeader.mjs +14 -0
  18. package/dist/esm/components/FileUploader/ui/FilePicker/FilePicker.mjs +9 -0
  19. package/dist/esm/components/FileUploader/utils/checkMaxFileSize.mjs +12 -0
  20. package/dist/esm/components/FileUploader/utils/displayText.mjs +39 -0
  21. package/dist/esm/components/FileUploader/utils/filterAllowedFiles.mjs +27 -0
  22. package/dist/esm/components/FileUploader/utils/getInput.mjs +39 -0
  23. package/dist/esm/components/FileUploader/utils/resolveFile.mjs +20 -0
  24. package/dist/esm/components/FileUploader/utils/uploadFile.mjs +26 -0
  25. package/dist/esm/components/StorageManager/StorageManager.mjs +4 -0
  26. package/dist/esm/index.mjs +1 -0
  27. package/dist/esm/version.mjs +1 -1
  28. package/dist/index.js +721 -7
  29. package/dist/styles.css +250 -0
  30. package/dist/types/components/FileUploader/FileUploader.d.ts +15 -0
  31. package/dist/types/components/FileUploader/hooks/index.d.ts +2 -0
  32. package/dist/types/components/FileUploader/hooks/useFileUploader/actions.d.ts +22 -0
  33. package/dist/types/components/FileUploader/hooks/useFileUploader/index.d.ts +1 -0
  34. package/dist/types/components/FileUploader/hooks/useFileUploader/reducer.d.ts +2 -0
  35. package/dist/types/components/FileUploader/hooks/useFileUploader/types.d.ts +50 -0
  36. package/dist/types/components/FileUploader/hooks/useFileUploader/useFileUploader.d.ts +35 -0
  37. package/dist/types/components/FileUploader/hooks/useUploadFiles/index.d.ts +1 -0
  38. package/dist/types/components/FileUploader/hooks/useUploadFiles/useUploadFiles.d.ts +12 -0
  39. package/dist/types/components/FileUploader/index.d.ts +3 -0
  40. package/dist/types/components/FileUploader/types.d.ts +129 -0
  41. package/dist/types/components/FileUploader/ui/Container/Container.d.ts +6 -0
  42. package/dist/types/components/FileUploader/ui/Container/index.d.ts +1 -0
  43. package/dist/types/components/FileUploader/ui/DropZone/DropZone.d.ts +3 -0
  44. package/dist/types/components/FileUploader/ui/DropZone/index.d.ts +2 -0
  45. package/dist/types/components/FileUploader/ui/DropZone/types.d.ts +13 -0
  46. package/dist/types/components/FileUploader/ui/FileList/FileControl.d.ts +3 -0
  47. package/dist/types/components/FileUploader/ui/FileList/FileDetails.d.ts +3 -0
  48. package/dist/types/components/FileUploader/ui/FileList/FileList.d.ts +3 -0
  49. package/dist/types/components/FileUploader/ui/FileList/FileRemoveButton.d.ts +3 -0
  50. package/dist/types/components/FileUploader/ui/FileList/FileStatusMessage.d.ts +3 -0
  51. package/dist/types/components/FileUploader/ui/FileList/FileThumbnail.d.ts +3 -0
  52. package/dist/types/components/FileUploader/ui/FileList/index.d.ts +2 -0
  53. package/dist/types/components/FileUploader/ui/FileList/types.d.ts +51 -0
  54. package/dist/types/components/FileUploader/ui/FileListFooter/FileListFooter.d.ts +9 -0
  55. package/dist/types/components/FileUploader/ui/FileListFooter/index.d.ts +1 -0
  56. package/dist/types/components/FileUploader/ui/FileListHeader/FileListHeader.d.ts +10 -0
  57. package/dist/types/components/FileUploader/ui/FileListHeader/index.d.ts +1 -0
  58. package/dist/types/components/FileUploader/ui/FilePicker/FilePicker.d.ts +4 -0
  59. package/dist/types/components/FileUploader/ui/FilePicker/index.d.ts +1 -0
  60. package/dist/types/components/FileUploader/ui/index.d.ts +6 -0
  61. package/dist/types/components/FileUploader/utils/checkMaxFileSize.d.ts +5 -0
  62. package/dist/types/components/FileUploader/utils/displayText.d.ts +22 -0
  63. package/dist/types/components/FileUploader/utils/filterAllowedFiles.d.ts +1 -0
  64. package/dist/types/components/FileUploader/utils/getInput.d.ts +17 -0
  65. package/dist/types/components/FileUploader/utils/index.d.ts +5 -0
  66. package/dist/types/components/FileUploader/utils/resolveFile.d.ts +9 -0
  67. package/dist/types/components/FileUploader/utils/uploadFile.d.ts +32 -0
  68. package/dist/types/components/index.d.ts +1 -0
  69. package/dist/types/index.d.ts +1 -1
  70. package/dist/types/version.d.ts +1 -1
  71. package/package.json +17 -5
package/dist/styles.css CHANGED
@@ -83,6 +83,35 @@
83
83
  --amplify-components-autocomplete-menu-loading-gap: var(--amplify-space-xxxs);
84
84
  --amplify-components-autocomplete-menu-space-shared-padding-block: var(--amplify-space-xs);
85
85
  --amplify-components-autocomplete-menu-space-shared-padding-inline: var(--amplify-space-small);
86
+ --amplify-components-avatar-color: var(--amplify-colors-font-tertiary);
87
+ --amplify-components-avatar-line-height: 1;
88
+ --amplify-components-avatar-font-weight: var(--amplify-font-weights-semibold);
89
+ --amplify-components-avatar-font-size: var(--amplify-font-sizes-small);
90
+ --amplify-components-avatar-text-align: center;
91
+ --amplify-components-avatar-width: var(--amplify-font-sizes-xxl);
92
+ --amplify-components-avatar-height: var(--amplify-font-sizes-xxl);
93
+ --amplify-components-avatar-background-color: var(--amplify-colors-background-tertiary);
94
+ --amplify-components-avatar-border-radius: 100%;
95
+ --amplify-components-avatar-border-color: var(--amplify-colors-border-primary);
96
+ --amplify-components-avatar-border-width: var(--amplify-border-widths-medium);
97
+ --amplify-components-avatar-info-color: var(--amplify-colors-font-info);
98
+ --amplify-components-avatar-info-background-color: var(--amplify-colors-background-info);
99
+ --amplify-components-avatar-info-border-color: var(--amplify-colors-border-info);
100
+ --amplify-components-avatar-warning-color: var(--amplify-colors-font-warning);
101
+ --amplify-components-avatar-warning-background-color: var(--amplify-colors-background-warning);
102
+ --amplify-components-avatar-warning-border-color: var(--amplify-colors-border-warning);
103
+ --amplify-components-avatar-success-color: var(--amplify-colors-font-success);
104
+ --amplify-components-avatar-success-background-color: var(--amplify-colors-background-success);
105
+ --amplify-components-avatar-success-border-color: var(--amplify-colors-border-success);
106
+ --amplify-components-avatar-error-color: var(--amplify-colors-font-error);
107
+ --amplify-components-avatar-error-background-color: var(--amplify-colors-background-error);
108
+ --amplify-components-avatar-error-border-color: var(--amplify-colors-border-error);
109
+ --amplify-components-avatar-small-font-size: var(--amplify-font-sizes-xs);
110
+ --amplify-components-avatar-small-width: var(--amplify-font-sizes-xl);
111
+ --amplify-components-avatar-small-height: var(--amplify-font-sizes-xl);
112
+ --amplify-components-avatar-large-font-size: var(--amplify-font-sizes-medium);
113
+ --amplify-components-avatar-large-width: var(--amplify-font-sizes-xxxl);
114
+ --amplify-components-avatar-large-height: var(--amplify-font-sizes-xxxl);
86
115
  --amplify-components-badge-color: var(--amplify-colors-font-primary);
87
116
  --amplify-components-badge-line-height: 1;
88
117
  --amplify-components-badge-font-weight: var(--amplify-font-weights-semibold);
@@ -3421,6 +3450,118 @@ strong.amplify-text {
3421
3450
  gap: var(--amplify-space-medium);
3422
3451
  }
3423
3452
 
3453
+ .amplify-avatar {
3454
+ --avatar-color: var(--amplify-components-avatar-color);
3455
+ --avatar-background-color: var(--amplify-components-avatar-background-color);
3456
+ --avatar-filled-background-color: var(--amplify-components-avatar-color);
3457
+ --avatar-filled-color: var(--amplify-components-avatar-background-color);
3458
+ --avatar-border-color: var(--amplify-components-avatar-border-color);
3459
+ --avatar-size: var(--amplify-components-avatar-width);
3460
+ --amplify-components-icon-height: 100%;
3461
+ display: inline-flex;
3462
+ align-items: center;
3463
+ justify-content: center;
3464
+ color: var(--avatar-color);
3465
+ background-color: var(--avatar-background-color);
3466
+ font-weight: var(--amplify-components-avatar-font-weight);
3467
+ font-size: var(--amplify-components-avatar-font-size);
3468
+ width: var(--amplify-components-avatar-width);
3469
+ height: var(--amplify-components-avatar-height);
3470
+ overflow: hidden;
3471
+ border-radius: var(--amplify-components-avatar-border-radius);
3472
+ }
3473
+ .amplify-avatar--filled {
3474
+ background-color: var(--avatar-filled-background-color);
3475
+ color: var(--avatar-filled-color);
3476
+ }
3477
+ .amplify-avatar--outlined {
3478
+ border-width: var(--amplify-components-avatar-border-width);
3479
+ border-style: solid;
3480
+ padding: var(--amplify-components-avatar-border-width);
3481
+ border-color: var(--avatar-border-color);
3482
+ background-color: transparent;
3483
+ color: var(--avatar-color);
3484
+ }
3485
+ .amplify-avatar--small {
3486
+ --avatar-size: var(--amplify-components-avatar-small-width);
3487
+ width: var(--amplify-components-avatar-small-width);
3488
+ height: var(--amplify-components-avatar-small-height);
3489
+ font-size: var(--amplify-components-avatar-small-font-size);
3490
+ }
3491
+ .amplify-avatar--large {
3492
+ --avatar-size: var(--amplify-components-avatar-large-width);
3493
+ width: var(--amplify-components-avatar-large-width);
3494
+ height: var(--amplify-components-avatar-large-height);
3495
+ font-size: var(--amplify-components-avatar-large-font-size);
3496
+ }
3497
+ .amplify-avatar--warning {
3498
+ --avatar-border-color: var(
3499
+ --amplify-components-avatar-warning-border-color
3500
+ );
3501
+ --avatar-background-color: var(
3502
+ --amplify-components-avatar-warning-background-color
3503
+ );
3504
+ --avatar-color: var(--amplify-components-avatar-warning-color);
3505
+ --avatar-filled-background-color: var(
3506
+ --amplify-components-avatar-warning-color
3507
+ );
3508
+ --avatar-filled-color: var(
3509
+ --amplify-components-avatar-warning-background-color
3510
+ );
3511
+ }
3512
+ .amplify-avatar--error {
3513
+ --avatar-border-color: var(--amplify-components-avatar-error-border-color);
3514
+ --avatar-background-color: var(
3515
+ --amplify-components-avatar-error-background-color
3516
+ );
3517
+ --avatar-color: var(--amplify-components-avatar-error-color);
3518
+ --avatar-filled-background-color: var(
3519
+ --amplify-components-avatar-error-color
3520
+ );
3521
+ --avatar-filled-color: var(
3522
+ --amplify-components-avatar-error-background-color
3523
+ );
3524
+ }
3525
+ .amplify-avatar--info {
3526
+ --avatar-border-color: var(--amplify-components-avatar-info-border-color);
3527
+ --avatar-background-color: var(
3528
+ --amplify-components-avatar-info-background-color
3529
+ );
3530
+ --avatar-color: var(--amplify-components-avatar-info-color);
3531
+ --avatar-filled-background-color: var(
3532
+ --amplify-components-avatar-info-color
3533
+ );
3534
+ --avatar-filled-color: var(
3535
+ --amplify-components-avatar-info-background-color
3536
+ );
3537
+ }
3538
+ .amplify-avatar--success {
3539
+ --avatar-border-color: var(
3540
+ --amplify-components-avatar-success-border-color
3541
+ );
3542
+ --avatar-background-color: var(
3543
+ --amplify-components-avatar-success-background-color
3544
+ );
3545
+ --avatar-color: var(--amplify-components-avatar-success-color);
3546
+ --avatar-filled-background-color: var(
3547
+ --amplify-components-avatar-success-color
3548
+ );
3549
+ --avatar-filled-color: var(
3550
+ --amplify-components-avatar-success-background-color
3551
+ );
3552
+ }
3553
+ .amplify-avatar__icon {
3554
+ display: flex;
3555
+ font-size: calc(var(--avatar-size) * 0.6);
3556
+ }
3557
+ .amplify-avatar__image {
3558
+ width: 100%;
3559
+ height: 100%;
3560
+ -o-object-fit: cover;
3561
+ object-fit: cover;
3562
+ display: block;
3563
+ }
3564
+
3424
3565
  .amplify-breadcrumbs__list {
3425
3566
  display: flex;
3426
3567
  flex-wrap: var(--amplify-components-breadcrumbs-flex-wrap);
@@ -6184,6 +6325,115 @@ html[dir=rtl] .amplify-field-group__inner-start {
6184
6325
  gap: var(--amplify-space-small);
6185
6326
  }
6186
6327
 
6328
+ .amplify-ai-conversation {
6329
+ display: flex;
6330
+ flex-direction: column;
6331
+ height: 100%;
6332
+ }
6333
+ .amplify-ai-conversation__message {
6334
+ --content-bg: transparent;
6335
+ display: flex;
6336
+ flex-direction: var(--flex-direction);
6337
+ gap: var(--amplify-space-small);
6338
+ padding: var(--amplify-space-small);
6339
+ }
6340
+ .amplify-ai-conversation__message__list {
6341
+ display: flex;
6342
+ flex-direction: column;
6343
+ }
6344
+ .amplify-ai-conversation__message__avatar {
6345
+ flex-shrink: 0;
6346
+ }
6347
+ .amplify-ai-conversation__message__sender {
6348
+ display: flex;
6349
+ flex-direction: var(--flex-direction);
6350
+ align-items: center;
6351
+ height: var(--amplify-components-avatar-height);
6352
+ gap: var(--amplify-space-small);
6353
+ }
6354
+ .amplify-ai-conversation__message__sender__username {
6355
+ font-weight: bold;
6356
+ }
6357
+ .amplify-ai-conversation__message__sender__timestamp {
6358
+ color: var(--amplify-colors-font-tertiary);
6359
+ font-size: var(--amplify-font-sizes-small);
6360
+ }
6361
+ .amplify-ai-conversation__message__body {
6362
+ display: flex;
6363
+ flex-direction: column;
6364
+ align-items: var(--body-align-items);
6365
+ gap: var(--amplify-space-xs);
6366
+ }
6367
+ .amplify-ai-conversation__message__content {
6368
+ background-color: var(--content-bg);
6369
+ border-radius: var(--amplify-radii-medium);
6370
+ padding: var(--content-padding);
6371
+ }
6372
+ .amplify-ai-conversation__message__actions {
6373
+ display: flex;
6374
+ flex-direction: row;
6375
+ }
6376
+ .amplify-ai-conversation__message--bubble {
6377
+ --content-bg: var(--bg-color);
6378
+ --content-padding: var(--amplify-space-xxs) var(--amplify-space-xs);
6379
+ --flex-direction: row-reverse;
6380
+ --body-align-items: flex-end;
6381
+ }
6382
+ .amplify-ai-conversation__message--user {
6383
+ --bg-color: var(--amplify-colors-background-secondary);
6384
+ }
6385
+ .amplify-ai-conversation__message--assistant {
6386
+ --bg-color: var(--amplify-colors-primary-10);
6387
+ --flex-direction: row;
6388
+ --body-align-items: flex-start;
6389
+ }
6390
+ .amplify-ai-conversation__form {
6391
+ display: flex;
6392
+ flex-direction: row;
6393
+ align-items: flex-start;
6394
+ gap: var(--amplify-space-small);
6395
+ }
6396
+ .amplify-ai-conversation__form__dropzone {
6397
+ text-align: initial;
6398
+ border: none;
6399
+ padding: var(--amplify-space-xs);
6400
+ }
6401
+ .amplify-ai-conversation__attachment {
6402
+ display: flex;
6403
+ flex-direction: row;
6404
+ padding-block: var(--amplify-space-xxxs);
6405
+ padding-inline: var(--amplify-space-xs);
6406
+ border-width: var(--amplify-border-widths-small);
6407
+ border-style: solid;
6408
+ border-color: var(--amplify-colors-border-secondary);
6409
+ border-radius: var(--amplify-radii-small);
6410
+ align-items: center;
6411
+ gap: var(--amplify-space-xs);
6412
+ font-size: var(--amplify-font-sizes-small);
6413
+ }
6414
+ .amplify-ai-conversation__attachment__list {
6415
+ display: flex;
6416
+ flex-direction: row;
6417
+ flex-wrap: wrap;
6418
+ gap: var(--amplify-space-small);
6419
+ padding-block-start: var(--amplify-space-small);
6420
+ }
6421
+ .amplify-ai-conversation__attachment__image {
6422
+ width: 1rem;
6423
+ height: 1rem;
6424
+ -o-object-fit: cover;
6425
+ object-fit: cover;
6426
+ }
6427
+ .amplify-ai-conversation__attachment__size {
6428
+ color: var(--amplify-colors-font-tertiary);
6429
+ }
6430
+ .amplify-ai-conversation__attachment__remove {
6431
+ padding: var(--amplify-space-xxs);
6432
+ }
6433
+ .amplify-ai-conversation__prompt {
6434
+ font-weight: normal;
6435
+ }
6436
+
6187
6437
  .amplify-label-start {
6188
6438
  flex-direction: row;
6189
6439
  }
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ import { FileUploaderProps, FileUploaderPathProps, FileUploaderHandle } from './types';
3
+ import { Container, DropZone, FileList, FileListHeader, FileListFooter, FilePicker } from './ui';
4
+ export declare const MISSING_REQUIRED_PROPS_MESSAGE = "`FileUploader` requires a `maxFileCount` prop to be provided.";
5
+ export declare const ACCESS_LEVEL_WITH_PATH_CALLBACK_MESSAGE = "`FileUploader` does not allow usage of a `path` callback prop with an `accessLevel` prop.";
6
+ 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";
7
+ declare const FileUploader: React.ForwardRefExoticComponent<(FileUploaderProps | FileUploaderPathProps) & React.RefAttributes<FileUploaderHandle>> & {
8
+ Container: typeof Container;
9
+ DropZone: typeof DropZone;
10
+ FileList: typeof FileList;
11
+ FileListHeader: typeof FileListHeader;
12
+ FileListFooter: typeof FileListFooter;
13
+ FilePicker: typeof FilePicker;
14
+ };
15
+ export { FileUploader };
@@ -0,0 +1,2 @@
1
+ export { useFileUploader, UseFileUploader } from './useFileUploader';
2
+ export { useUploadFiles } from './useUploadFiles';
@@ -0,0 +1,22 @@
1
+ import { FileStatus } from '../../types';
2
+ import { Action, AddFilesActionParams } from './types';
3
+ import { TaskEvent } from '../../utils';
4
+ export declare const addFilesAction: ({ files, status, getFileErrorMessage, }: AddFilesActionParams) => Action;
5
+ export declare const clearFilesAction: () => Action;
6
+ export declare const queueFilesAction: () => Action;
7
+ export declare const setProcessedKeyAction: (input: {
8
+ id: string;
9
+ processedKey: string;
10
+ }) => Action;
11
+ export declare const setUploadingFileAction: ({ id, uploadTask, }: TaskEvent) => Action;
12
+ export declare const setUploadProgressAction: ({ id, progress, }: {
13
+ id: string;
14
+ progress: number;
15
+ }) => Action;
16
+ export declare const setUploadStatusAction: ({ id, status, }: {
17
+ id: string;
18
+ status: FileStatus;
19
+ }) => Action;
20
+ export declare const removeUploadAction: ({ id }: {
21
+ id: string;
22
+ }) => Action;
@@ -0,0 +1 @@
1
+ export { useFileUploader, UseFileUploader } from './useFileUploader';
@@ -0,0 +1,2 @@
1
+ import { Action, UseFileUploaderState } from './types';
2
+ export declare function fileUploaderStateReducer(state: UseFileUploaderState, action: Action): UseFileUploaderState;
@@ -0,0 +1,50 @@
1
+ import { FileStatus, StorageFiles } from '../../types';
2
+ import { UploadTask } from '../../utils';
3
+ export interface UseFileUploaderState {
4
+ files: StorageFiles;
5
+ }
6
+ export declare enum FileUploaderActionTypes {
7
+ ADD_FILES = "ADD_FILES",
8
+ CLEAR_FILES = "CLEAR_FILES",
9
+ QUEUE_FILES = "QUEUE_FILES",
10
+ SET_STATUS = "SET_STATUS",
11
+ SET_PROCESSED_FILE_KEY = "SET_PROCESSED_FILE_KEY",
12
+ SET_STATUS_UPLOADING = "SET_STATUS_UPLOADING",
13
+ SET_UPLOAD_PROGRESS = "SET_UPLOAD_PROGRESS",
14
+ REMOVE_UPLOAD = "REMOVE_UPLOAD"
15
+ }
16
+ export type GetFileErrorMessage = (file: File) => string;
17
+ export type Action = {
18
+ type: FileUploaderActionTypes.ADD_FILES;
19
+ files: File[];
20
+ status: FileStatus;
21
+ getFileErrorMessage: GetFileErrorMessage;
22
+ } | {
23
+ type: FileUploaderActionTypes.CLEAR_FILES;
24
+ } | {
25
+ type: FileUploaderActionTypes.SET_STATUS;
26
+ id: string;
27
+ status: FileStatus;
28
+ } | {
29
+ type: FileUploaderActionTypes.QUEUE_FILES;
30
+ } | {
31
+ type: FileUploaderActionTypes.SET_STATUS_UPLOADING;
32
+ id: string;
33
+ uploadTask?: UploadTask;
34
+ } | {
35
+ type: FileUploaderActionTypes.SET_UPLOAD_PROGRESS;
36
+ id: string;
37
+ progress: number;
38
+ } | {
39
+ type: FileUploaderActionTypes.SET_PROCESSED_FILE_KEY;
40
+ id: string;
41
+ processedKey: string;
42
+ } | {
43
+ type: FileUploaderActionTypes.REMOVE_UPLOAD;
44
+ id: string;
45
+ };
46
+ export interface AddFilesActionParams {
47
+ files: File[];
48
+ status: FileStatus;
49
+ getFileErrorMessage: GetFileErrorMessage;
50
+ }
@@ -0,0 +1,35 @@
1
+ import { StorageFiles, FileStatus, DefaultFile } from '../../types';
2
+ import { GetFileErrorMessage } from './types';
3
+ import { TaskHandler } from '../../utils';
4
+ export interface UseFileUploader {
5
+ addFiles: (params: {
6
+ files: File[];
7
+ status: FileStatus;
8
+ getFileErrorMessage: GetFileErrorMessage;
9
+ }) => void;
10
+ clearFiles: () => void;
11
+ queueFiles: () => void;
12
+ setUploadingFile: TaskHandler;
13
+ setProcessedKey: (params: {
14
+ id: string;
15
+ processedKey: string;
16
+ }) => void;
17
+ setUploadProgress: (params: {
18
+ id: string;
19
+ progress: number;
20
+ }) => void;
21
+ setUploadSuccess: (params: {
22
+ id: string;
23
+ }) => void;
24
+ setUploadResumed: (params: {
25
+ id: string;
26
+ }) => void;
27
+ setUploadPaused: (params: {
28
+ id: string;
29
+ }) => void;
30
+ removeUpload: (params: {
31
+ id: string;
32
+ }) => void;
33
+ files: StorageFiles;
34
+ }
35
+ export declare function useFileUploader(defaultFiles?: Array<DefaultFile>): UseFileUploader;
@@ -0,0 +1 @@
1
+ export { useUploadFiles, UseUploadFilesProps } from './useUploadFiles';
@@ -0,0 +1,12 @@
1
+ import { PathCallback } from '../../utils';
2
+ import { FileUploaderProps } from '../../types';
3
+ import { UseFileUploader } from '../useFileUploader';
4
+ export interface UseUploadFilesProps extends Pick<FileUploaderProps, 'isResumable' | 'onUploadSuccess' | 'onUploadError' | 'onUploadStart' | 'maxFileCount' | 'processFile' | 'useAccelerateEndpoint'>, Pick<UseFileUploader, 'setUploadingFile' | 'setUploadProgress' | 'setUploadSuccess' | 'files'> {
5
+ accessLevel?: FileUploaderProps['accessLevel'];
6
+ onProcessFileSuccess: (input: {
7
+ id: string;
8
+ processedKey: string;
9
+ }) => void;
10
+ path?: string | PathCallback;
11
+ }
12
+ export declare function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onProcessFileSuccess, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }: UseUploadFilesProps): void;
@@ -0,0 +1,3 @@
1
+ export { FileUploader } from './FileUploader';
2
+ export { FileUploaderProps } from './types';
3
+ export { DropZoneProps, ContainerProps, FileListProps, FilePickerProps, FileListHeaderProps, FileListFooterProps, } from './ui';
@@ -0,0 +1,129 @@
1
+ import * as React from 'react';
2
+ import type { StorageAccessLevel } from '@aws-amplify/core';
3
+ import { ContainerProps, DropZoneProps, FileListHeaderProps, FileListFooterProps, FileListProps, FilePickerProps } from './ui';
4
+ import { FileUploaderDisplayText, 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
+ export interface StorageFile {
14
+ id: string;
15
+ file?: File;
16
+ status: FileStatus;
17
+ progress: number;
18
+ processedKey?: string;
19
+ uploadTask?: UploadTask;
20
+ key: string;
21
+ error: string;
22
+ isImage: boolean;
23
+ }
24
+ export type StorageFiles = StorageFile[];
25
+ export type DefaultFile = Pick<StorageFile, 'key'>;
26
+ export interface ProcessFileParams extends Record<string, any> {
27
+ file: File;
28
+ key: string;
29
+ useAccelerateEndpoint?: boolean;
30
+ }
31
+ export type ProcessFile = (params: ProcessFileParams) => Promise<ProcessFileParams> | ProcessFileParams;
32
+ export interface FileUploaderHandle {
33
+ clearFiles: () => void;
34
+ }
35
+ export interface FileUploaderProps {
36
+ /**
37
+ * List of accepted File types, values of `['*']` or undefined allow any files
38
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept
39
+ */
40
+ acceptedFileTypes?: string[];
41
+ /**
42
+ * Access level for file uploads
43
+ * @see https://docs.amplify.aws/lib/storage/configureaccess/q/platform/js/
44
+ */
45
+ accessLevel: StorageAccessLevel;
46
+ /**
47
+ * Determines if the upload will automatically start after a file is selected, default value: true
48
+ */
49
+ autoUpload?: boolean;
50
+ /**
51
+ * Component overrides
52
+ */
53
+ components?: {
54
+ Container?: React.ComponentType<ContainerProps>;
55
+ DropZone?: React.ComponentType<DropZoneProps>;
56
+ FileList?: React.ComponentType<FileListProps>;
57
+ FilePicker?: React.ComponentType<FilePickerProps>;
58
+ FileListHeader?: React.ComponentType<FileListHeaderProps>;
59
+ FileListFooter?: React.ComponentType<FileListFooterProps>;
60
+ };
61
+ /**
62
+ * List of default files already uploaded
63
+ */
64
+ defaultFiles?: DefaultFile[];
65
+ /**
66
+ * Overrides default display text
67
+ */
68
+ displayText?: FileUploaderDisplayText;
69
+ /**
70
+ * Determines if upload can be paused / resumed
71
+ */
72
+ isResumable?: boolean;
73
+ /**
74
+ * Maximum total files to upload in each batch
75
+ */
76
+ maxFileCount: number;
77
+ /**
78
+ * Maximum file size in bytes
79
+ */
80
+ maxFileSize?: number;
81
+ /**
82
+ * When a file is removed
83
+ */
84
+ onFileRemove?: (file: {
85
+ key: string;
86
+ }) => void;
87
+ /**
88
+ * Monitor upload errors
89
+ */
90
+ onUploadError?: (error: string, file: {
91
+ key: string;
92
+ }) => void;
93
+ /**
94
+ * Monitor upload success
95
+ */
96
+ onUploadSuccess?: (event: {
97
+ key?: string;
98
+ }) => void;
99
+ /**
100
+ * When a file begins uploading
101
+ */
102
+ onUploadStart?: (event: {
103
+ key?: string;
104
+ }) => void;
105
+ /**
106
+ * Process file before upload
107
+ */
108
+ processFile?: ProcessFile;
109
+ /**
110
+ * Determines if thumbnails show for image files
111
+ */
112
+ showThumbnails?: boolean;
113
+ /**
114
+ * Provided value is prefixed to the file `key` for each file
115
+ */
116
+ path?: string;
117
+ useAccelerateEndpoint?: boolean;
118
+ }
119
+ export interface FileUploaderPathProps extends Omit<FileUploaderProps, 'accessLevel' | 'path'> {
120
+ /**
121
+ * S3 bucket key, allows either a `string` or a `PathCallback`:
122
+ * - `string`: `path` is prefixed to the file `key` for each file
123
+ * - `PathCallback`: callback provided an input containing the current `identityId`,
124
+ * resolved value is prefixed to the file `key` for each file
125
+ */
126
+ path: string | PathCallback;
127
+ accessLevel?: never;
128
+ useAccelerateEndpoint?: boolean;
129
+ }
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ export interface ContainerProps {
3
+ children: React.ReactNode;
4
+ className: string;
5
+ }
6
+ export declare function Container({ children, className, }: ContainerProps): JSX.Element;
@@ -0,0 +1 @@
1
+ export { Container, ContainerProps } from './Container';
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { DropZoneProps } from './types';
3
+ export declare function DropZone({ children, displayText, inDropZone, onDragEnter, onDragLeave, onDragOver, onDragStart, onDrop, testId, }: DropZoneProps): JSX.Element;
@@ -0,0 +1,2 @@
1
+ export { DropZone } from './DropZone';
2
+ export { DropZoneProps } from './types';
@@ -0,0 +1,13 @@
1
+ /// <reference types="react" />
2
+ import { FileUploaderDisplayText } from '../../utils/displayText';
3
+ export interface DropZoneProps {
4
+ children?: React.ReactNode;
5
+ displayText: FileUploaderDisplayText;
6
+ inDropZone: boolean;
7
+ onDragEnter: (event: React.DragEvent<HTMLDivElement>) => void;
8
+ onDragLeave: (event: React.DragEvent<HTMLDivElement>) => void;
9
+ onDragOver: (event: React.DragEvent<HTMLDivElement>) => void;
10
+ onDragStart: (event: React.DragEvent<HTMLDivElement>) => void;
11
+ onDrop: (event: React.DragEvent<HTMLDivElement>) => void;
12
+ testId?: string;
13
+ }
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { FileControlProps } from './types';
3
+ export declare function FileControl({ onPause, onResume, displayName, errorMessage, isImage, isResumable, loaderIsDeterminate, onRemove, progress, showThumbnails, size, status, displayText, thumbnailUrl, }: FileControlProps): JSX.Element;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { UploadDetailsProps } from './types';
3
+ export declare const UploadDetails: ({ displayName, fileSize, }: UploadDetailsProps) => JSX.Element;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { FileListProps } from './types';
3
+ export declare function FileList({ displayText, files, hasMaxFilesError, isResumable, onCancelUpload, onDeleteUpload, onResume, onPause, showThumbnails, maxFileCount, }: FileListProps): JSX.Element | null;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { FileRemoveButtonProps } from './types';
3
+ export declare const FileRemoveButton: ({ altText, onClick, }: FileRemoveButtonProps) => JSX.Element;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { FileStatusMessageProps } from './types';
3
+ export declare const FileStatusMessage: ({ errorMessage, getPausedText, getUploadingText, percentage, status, uploadSuccessfulText, }: FileStatusMessageProps) => JSX.Element | null;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { FileThumbnailProps } from './types';
3
+ export declare const FileThumbnail: ({ fileName, isImage, url, }: FileThumbnailProps) => JSX.Element;
@@ -0,0 +1,2 @@
1
+ export { FileList } from './FileList';
2
+ export { FileListProps } from './types';