@aws-amplify/ui-react-storage 3.7.2 → 3.8.1

package/dist/browser.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var createAmplifyAuthAdapter = require('./createAmplifyAuthAdapter-C0qoSzPO.js');
+var createAmplifyAuthAdapter = require('./createAmplifyAuthAdapter-D6jJJVE_.js');
 var internals = require('@aws-amplify/storage/internals');
 require('@aws-amplify/ui');
 require('aws-amplify/storage');

package/dist/{createAmplifyAuthAdapter-C0qoSzPO.js → createAmplifyAuthAdapter-D6jJJVE_.js}

@@ -32,7 +32,7 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-const VERSION = '3.7.2';
+const VERSION = '3.8.1';
 
 const constructBucket = ({ bucket: bucketName, region, }) => ({ bucketName, region });
 const parseAccessGrantLocation = (location) => {
@@ -845,7 +845,7 @@ const CheckboxHeader = ({ content, }) => {
     return (React__namespace["default"].createElement(uiReact.Checkbox, { name: label ?? '', checked: checked, labelHidden: true, label: label, onChange: onSelect, id: id }));
 };
 
-const DataTable = ({ headers, rows, }) => {
+const DataTable = ({ headers, isLoading, rows, }) => {
     const mappedHeaders = headers.map(({ key, content, type }) => {
         switch (type) {
             case 'checkbox': {
@@ -869,44 +869,46 @@ const DataTable = ({ headers, rows, }) => {
             }
         }
     });
-    const mappedRows = rows.map(({ key, content }) => ({
-        key,
-        content: content.map(({ key, content, type }) => {
-            switch (type) {
-                case 'button': {
-                    return {
-                        key,
-                        content: React__namespace["default"].createElement(ButtonDataCell, { content: content }),
-                    };
-                }
-                case 'checkbox': {
-                    return {
-                        key,
-                        content: React__namespace["default"].createElement(CheckboxDataCell, { content: content }),
-                    };
-                }
-                case 'date': {
-                    return {
-                        key,
-                        content: React__namespace["default"].createElement(DateDataCell, { content: content }),
-                    };
-                }
-                case 'number': {
-                    return {
-                        key,
-                        content: React__namespace["default"].createElement(NumberDataCell, { content: content }),
-                    };
-                }
-                case 'text':
-                default: {
-                    return {
-                        key,
-                        content: React__namespace["default"].createElement(TextDataCell, { content: content }),
-                    };
+    const mappedRows = isLoading
+        ? []
+        : rows.map(({ key, content }) => ({
+            key,
+            content: content.map(({ key, content, type }) => {
+                switch (type) {
+                    case 'button': {
+                        return {
+                            key,
+                            content: React__namespace["default"].createElement(ButtonDataCell, { content: content }),
+                        };
+                    }
+                    case 'checkbox': {
+                        return {
+                            key,
+                            content: React__namespace["default"].createElement(CheckboxDataCell, { content: content }),
+                        };
+                    }
+                    case 'date': {
+                        return {
+                            key,
+                            content: React__namespace["default"].createElement(DateDataCell, { content: content }),
+                        };
+                    }
+                    case 'number': {
+                        return {
+                            key,
+                            content: React__namespace["default"].createElement(NumberDataCell, { content: content }),
+                        };
+                    }
+                    case 'text':
+                    default: {
+                        return {
+                            key,
+                            content: React__namespace["default"].createElement(TextDataCell, { content: content }),
+                        };
+                    }
                 }
-            }
-        }),
-    }));
+            }),
+        }));
     return React__namespace["default"].createElement(Table, { headers: mappedHeaders, rows: mappedRows });
 };
 
@@ -2291,7 +2293,7 @@ const GROUP_ORDER = [
 const UNSORTABLE_GROUPS = ['checkbox'];
 const useDataTable = () => {
     const { data } = useControlsContext();
-    const { tableData } = data;
+    const { isLoading, tableData } = data;
     const defaultSortIndex = React__namespace["default"].useMemo(() => tableData?.headers?.findIndex(({ type }) => type === 'sort') ?? -1, [tableData]);
     const [sortState, setSortState] = React__namespace["default"].useState({
         index: defaultSortIndex,
@@ -2375,6 +2377,7 @@ const useDataTable = () => {
     }, [sortState, tableData]);
     return {
         headers: mappedHeaders ?? [],
+        isLoading,
         rows: sortedRows ?? [],
     };
 };
@@ -2624,7 +2627,7 @@ const getActionViewTableData = ({ tasks, displayText, isProcessing, locationKey,
                                 value: progress,
                                 displayValue: `${getPercentValue(
                                 // Default progress to 100% if progress value is unavailable but status is recognized as complete
-                                progress ?? status === 'COMPLETE' ? 1 : 0)}%`,
+                                progress ?? (status === 'COMPLETE' ? 1 : 0))}%`,
                             },
                         };
                     }
@@ -4187,15 +4190,15 @@ const useLocationDetailView = (options) => {
 };
 
 const LOCATION_DETAIL_VIEW_HEADERS = [
-    { key: 'checkbox', type: 'text', content: { text: '' } },
-    { key: 'name', type: 'sort', content: { label: 'Name' } },
-    { key: 'type', type: 'sort', content: { label: 'Type' } },
-    { key: 'last-modified', type: 'sort', content: { label: 'Last modified' } },
-    { key: 'size', type: 'sort', content: { label: 'Size' } },
-    { key: 'download', type: 'text', content: { text: '' } },
+    'checkbox',
+    'name',
+    'type',
+    'last-modified',
+    'size',
+    'download',
 ];
 
-const getFileRowContent = ({ permissions, isSelected, itemLocationKey, getDateDisplayValue, lastModified, rowId, rowKey, selectFileLabel, size, onDownload, onSelect, }) => LOCATION_DETAIL_VIEW_HEADERS.map(({ key: columnKey }) => {
+const getFileRowContent = ({ permissions, isSelected, itemLocationKey, getDateDisplayValue, lastModified, rowId, rowKey, selectFileLabel, size, onDownload, onSelect, }) => LOCATION_DETAIL_VIEW_HEADERS.map((columnKey) => {
     const key = `${columnKey}-${rowId}`;
     switch (columnKey) {
         case 'checkbox': {
@@ -4267,7 +4270,7 @@ const getFileRowContent = ({ permissions, isSelected, itemLocationKey, getDateDi
     }
 });
 
-const getFolderRowContent = ({ itemSubPath, rowId, onNavigate, }) => LOCATION_DETAIL_VIEW_HEADERS.map(({ key: columnKey }) => {
+const getFolderRowContent = ({ itemSubPath, rowId, onNavigate, }) => LOCATION_DETAIL_VIEW_HEADERS.map((columnKey) => {
     const key = `${columnKey}-${rowId}`;
     switch (columnKey) {
         case 'checkbox': {
@@ -4296,20 +4299,83 @@ const getFolderRowContent = ({ itemSubPath, rowId, onNavigate, }) => LOCATION_DE
     }
 });
 
-const getLocationDetailViewTableData = ({ areAllFilesSelected, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }) => {
-    const headerCheckbox = {
-        key: 'checkbox',
-        type: 'checkbox',
-        content: {
-            checked: areAllFilesSelected,
-            label: selectAllFilesLabel,
-            onSelect: onSelectAll,
-            id: 'header-checkbox',
-        },
-    };
-    const headers = hasFiles
-        ? [headerCheckbox, ...LOCATION_DETAIL_VIEW_HEADERS.slice(1)]
-        : LOCATION_DETAIL_VIEW_HEADERS;
+const getHeaders$1 = ({ tableColumnLastModifiedHeader, tableColumnNameHeader, tableColumnSizeHeader, tableColumnTypeHeader, areAllFilesSelected, selectAllFilesLabel, onSelectAll, hasFiles, }) => LOCATION_DETAIL_VIEW_HEADERS.map((key) => {
+    switch (key) {
+        case 'checkbox': {
+            if (hasFiles) {
+                return {
+                    key,
+                    type: 'checkbox',
+                    content: {
+                        checked: areAllFilesSelected,
+                        label: selectAllFilesLabel,
+                        id: 'header-checkbox',
+                        onSelect: onSelectAll,
+                    },
+                };
+            }
+            else {
+                return {
+                    key,
+                    type: 'text',
+                    content: { text: '' },
+                };
+            }
+        }
+        case 'name': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnNameHeader,
+                },
+            };
+        }
+        case 'type': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnTypeHeader,
+                },
+            };
+        }
+        case 'last-modified': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnLastModifiedHeader,
+                },
+            };
+        }
+        case 'size': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnSizeHeader,
+                },
+            };
+        }
+        case 'download': {
+            return { key, type: 'text', content: { text: '' } };
+        }
+    }
+});
+
+const getLocationDetailViewTableData = ({ areAllFilesSelected, displayText, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }) => {
+    const { tableColumnLastModifiedHeader, tableColumnNameHeader, tableColumnSizeHeader, tableColumnTypeHeader, } = displayText;
+    const headers = getHeaders$1({
+        areAllFilesSelected,
+        selectAllFilesLabel,
+        hasFiles,
+        onSelectAll,
+        tableColumnLastModifiedHeader,
+        tableColumnNameHeader,
+        tableColumnSizeHeader,
+        tableColumnTypeHeader,
+    });
     const rows = pageItems.map((locationItem) => {
         const { id, key, type } = locationItem;
         switch (type) {
@@ -4365,6 +4431,7 @@ const getLocationDetailViewTableData = ({ areAllFilesSelected, location, fileDat
 };
 
 function LocationDetailViewProvider({ children, ...props }) {
+    const { LocationDetailView: displayText } = useDisplayText();
     const { LocationDetailView: { loadingIndicatorLabel, searchSubfoldersToggleLabel, selectFileLabel, selectAllFilesLabel, searchPlaceholder, searchSubmitLabel, searchClearLabel, getActionListItemLabel, getDateDisplayValue, getTitle, getListItemsResultMessage, }, } = useDisplayText();
     const { actionItems, page, pageItems, hasNextPage, highestPageVisited, isLoading, isSearchSubfoldersEnabled, location, fileDataItems, hasError, hasDownloadError, message, downloadErrorMessage, searchQuery, hasExhaustedSearch, onActionSelect, onDropFiles, onRefresh, onPaginate, onDownload, onNavigate, onNavigateHome, onSelect, onToggleSelectAll, onSearch, onSearchQueryChange, onSearchClear, onToggleSearchSubfolders, } = props;
     const actionsWithDisplayText = actionItems.map((item) => ({
@@ -4404,6 +4471,7 @@ function LocationDetailViewProvider({ children, ...props }) {
             searchQuery,
             tableData: getLocationDetailViewTableData({
                 areAllFilesSelected,
+                displayText,
                 location,
                 fileDataItems,
                 getDateDisplayValue,

package/dist/esm/components/FileUploader/FileUploader.mjs

@@ -21,8 +21,8 @@ import { VERSION } from '../../version.mjs';
 const logger = getLogger('Storage');
 const MISSING_REQUIRED_PROPS_MESSAGE = '`FileUploader` requires a `maxFileCount` prop to be provided.';
 const ACCESS_LEVEL_WITH_PATH_CALLBACK_MESSAGE = '`FileUploader` does not allow usage of a `path` callback prop with an `accessLevel` prop.';
-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';
-const FileUploaderBase = React.forwardRef(function FileUploader({ acceptedFileTypes = [], accessLevel, autoUpload = true, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
+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#deprecated-props';
+const FileUploaderBase = React.forwardRef(function FileUploader({ acceptedFileTypes = [], accessLevel, autoUpload = true, bucket, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
     if (!maxFileCount) {
         // eslint-disable-next-line no-console
         console.warn(MISSING_REQUIRED_PROPS_MESSAGE);
@@ -77,6 +77,7 @@ const FileUploaderBase = React.forwardRef(function FileUploader({ acceptedFileTy
     });
     useUploadFiles({
         accessLevel,
+        bucket,
         files,
         isResumable,
         maxFileCount,

package/dist/esm/components/FileUploader/hooks/useUploadFiles/useUploadFiles.mjs

@@ -4,7 +4,7 @@ import { getInput } from '../../utils/getInput.mjs';
 import { uploadFile } from '../../utils/uploadFile.mjs';
 import { FileStatus } from '../../types.mjs';
 
-function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }) {
+function useUploadFiles({ accessLevel, bucket, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }) {
     React.useEffect(() => {
         const filesReadyToUpload = files.filter((file) => file.status === FileStatus.QUEUED);
         if (filesReadyToUpload.length > maxFileCount) {
@@ -24,6 +24,7 @@ function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploa
             if (file) {
                 const input = getInput({
                     accessLevel,
+                    bucket,
                     file,
                     key,
                     onProgress,
@@ -58,6 +59,7 @@ function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploa
     }, [
         files,
         accessLevel,
+        bucket,
         isResumable,
         setUploadProgress,
         setUploadingFile,

package/dist/esm/components/FileUploader/utils/getInput.mjs

@@ -2,7 +2,7 @@ import { fetchAuthSession } from 'aws-amplify/auth';
 import { isFunction, isString } from '@aws-amplify/ui';
 import { resolveFile } from './resolveFile.mjs';
 
-const getInput = ({ accessLevel, file, key, onProgress, path, processFile, useAccelerateEndpoint, }) => {
+const getInput = ({ accessLevel, bucket, file, key, onProgress, path, processFile, useAccelerateEndpoint, }) => {
     return async () => {
         const hasCallbackPath = isFunction(path);
         const hasStringPath = isString(path);
@@ -10,7 +10,13 @@ const getInput = ({ accessLevel, file, key, onProgress, path, processFile, useAc
         const { file: data, key: processedKey, ...rest } = await resolveFile({ file, key, processFile });
         const contentType = file.type || 'binary/octet-stream';
         // IMPORTANT: always pass `...rest` here for backwards compatibility
-        const options = { contentType, onProgress, useAccelerateEndpoint, ...rest };
+        const options = {
+            bucket,
+            contentType,
+            onProgress,
+            useAccelerateEndpoint,
+            ...rest,
+        };
         let inputResult;
         if (hasKeyInput) {
             // legacy handling of `path` is to prefix to `fileKey`

package/dist/esm/components/StorageBrowser/composables/DataTable/DataTable.mjs

@@ -9,7 +9,7 @@ import { CheckboxDataCell } from './dataCells/CheckboxDataCell.mjs';
 import { TextDataCell } from './dataCells/TextDataCell.mjs';
 import { CheckboxHeader } from './headers/CheckboxHeader.mjs';
 
-const DataTable = ({ headers, rows, }) => {
+const DataTable = ({ headers, isLoading, rows, }) => {
     const mappedHeaders = headers.map(({ key, content, type }) => {
         switch (type) {
             case 'checkbox': {
@@ -33,44 +33,46 @@ const DataTable = ({ headers, rows, }) => {
             }
         }
     });
-    const mappedRows = rows.map(({ key, content }) => ({
-        key,
-        content: content.map(({ key, content, type }) => {
-            switch (type) {
-                case 'button': {
-                    return {
-                        key,
-                        content: React__default.createElement(ButtonDataCell, { content: content }),
-                    };
+    const mappedRows = isLoading
+        ? []
+        : rows.map(({ key, content }) => ({
+            key,
+            content: content.map(({ key, content, type }) => {
+                switch (type) {
+                    case 'button': {
+                        return {
+                            key,
+                            content: React__default.createElement(ButtonDataCell, { content: content }),
+                        };
+                    }
+                    case 'checkbox': {
+                        return {
+                            key,
+                            content: React__default.createElement(CheckboxDataCell, { content: content }),
+                        };
+                    }
+                    case 'date': {
+                        return {
+                            key,
+                            content: React__default.createElement(DateDataCell, { content: content }),
+                        };
+                    }
+                    case 'number': {
+                        return {
+                            key,
+                            content: React__default.createElement(NumberDataCell, { content: content }),
+                        };
+                    }
+                    case 'text':
+                    default: {
+                        return {
+                            key,
+                            content: React__default.createElement(TextDataCell, { content: content }),
+                        };
+                    }
                 }
-                case 'checkbox': {
-                    return {
-                        key,
-                        content: React__default.createElement(CheckboxDataCell, { content: content }),
-                    };
-                }
-                case 'date': {
-                    return {
-                        key,
-                        content: React__default.createElement(DateDataCell, { content: content }),
-                    };
-                }
-                case 'number': {
-                    return {
-                        key,
-                        content: React__default.createElement(NumberDataCell, { content: content }),
-                    };
-                }
-                case 'text':
-                default: {
-                    return {
-                        key,
-                        content: React__default.createElement(TextDataCell, { content: content }),
-                    };
-                }
-            }
-        }),
-    }));
+            }),
+        }));
     return React__default.createElement(Table, { headers: mappedHeaders, rows: mappedRows });
 };
 

package/dist/esm/components/StorageBrowser/controls/hooks/useDataTable.mjs

@@ -15,7 +15,7 @@ const GROUP_ORDER = [
 const UNSORTABLE_GROUPS = ['checkbox'];
 const useDataTable = () => {
     const { data } = useControlsContext();
-    const { tableData } = data;
+    const { isLoading, tableData } = data;
     const defaultSortIndex = React__default.useMemo(() => tableData?.headers?.findIndex(({ type }) => type === 'sort') ?? -1, [tableData]);
     const [sortState, setSortState] = React__default.useState({
         index: defaultSortIndex,
@@ -99,6 +99,7 @@ const useDataTable = () => {
     }, [sortState, tableData]);
     return {
         headers: mappedHeaders ?? [],
+        isLoading,
         rows: sortedRows ?? [],
     };
 };

package/dist/esm/components/StorageBrowser/views/LocationActionView/getActionViewTableData.mjs

@@ -118,7 +118,7 @@ const getActionViewTableData = ({ tasks, displayText, isProcessing, locationKey,
                                 value: progress,
                                 displayValue: `${getPercentValue(
                                 // Default progress to 100% if progress value is unavailable but status is recognized as complete
-                                progress ?? status === 'COMPLETE' ? 1 : 0)}%`,
+                                progress ?? (status === 'COMPLETE' ? 1 : 0))}%`,
                             },
                         };
                     }

package/dist/esm/components/StorageBrowser/views/LocationDetailView/LocationDetailViewProvider.mjs

@@ -5,6 +5,7 @@ import '@aws-amplify/ui';
 import { getLocationDetailViewTableData } from './getLocationDetailViewTableData/getLocationDetailViewTableData.mjs';
 
 function LocationDetailViewProvider({ children, ...props }) {
+    const { LocationDetailView: displayText } = useDisplayText();
     const { LocationDetailView: { loadingIndicatorLabel, searchSubfoldersToggleLabel, selectFileLabel, selectAllFilesLabel, searchPlaceholder, searchSubmitLabel, searchClearLabel, getActionListItemLabel, getDateDisplayValue, getTitle, getListItemsResultMessage, }, } = useDisplayText();
     const { actionItems, page, pageItems, hasNextPage, highestPageVisited, isLoading, isSearchSubfoldersEnabled, location, fileDataItems, hasError, hasDownloadError, message, downloadErrorMessage, searchQuery, hasExhaustedSearch, onActionSelect, onDropFiles, onRefresh, onPaginate, onDownload, onNavigate, onNavigateHome, onSelect, onToggleSelectAll, onSearch, onSearchQueryChange, onSearchClear, onToggleSearchSubfolders, } = props;
     const actionsWithDisplayText = actionItems.map((item) => ({
@@ -44,6 +45,7 @@ function LocationDetailViewProvider({ children, ...props }) {
             searchQuery,
             tableData: getLocationDetailViewTableData({
                 areAllFilesSelected,
+                displayText,
                 location,
                 fileDataItems,
                 getDateDisplayValue,

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/constants.mjs

@@ -1,10 +1,10 @@
 const LOCATION_DETAIL_VIEW_HEADERS = [
-    { key: 'checkbox', type: 'text', content: { text: '' } },
-    { key: 'name', type: 'sort', content: { label: 'Name' } },
-    { key: 'type', type: 'sort', content: { label: 'Type' } },
-    { key: 'last-modified', type: 'sort', content: { label: 'Last modified' } },
-    { key: 'size', type: 'sort', content: { label: 'Size' } },
-    { key: 'download', type: 'text', content: { text: '' } },
+    'checkbox',
+    'name',
+    'type',
+    'last-modified',
+    'size',
+    'download',
 ];
 
 export { LOCATION_DETAIL_VIEW_HEADERS };

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getFileRowContent.mjs

@@ -1,7 +1,7 @@
 import { humanFileSize } from '@aws-amplify/ui';
 import { LOCATION_DETAIL_VIEW_HEADERS } from './constants.mjs';
 
-const getFileRowContent = ({ permissions, isSelected, itemLocationKey, getDateDisplayValue, lastModified, rowId, rowKey, selectFileLabel, size, onDownload, onSelect, }) => LOCATION_DETAIL_VIEW_HEADERS.map(({ key: columnKey }) => {
+const getFileRowContent = ({ permissions, isSelected, itemLocationKey, getDateDisplayValue, lastModified, rowId, rowKey, selectFileLabel, size, onDownload, onSelect, }) => LOCATION_DETAIL_VIEW_HEADERS.map((columnKey) => {
     const key = `${columnKey}-${rowId}`;
     switch (columnKey) {
         case 'checkbox': {

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getFolderRowContent.mjs

@@ -1,6 +1,6 @@
 import { LOCATION_DETAIL_VIEW_HEADERS } from './constants.mjs';
 
-const getFolderRowContent = ({ itemSubPath, rowId, onNavigate, }) => LOCATION_DETAIL_VIEW_HEADERS.map(({ key: columnKey }) => {
+const getFolderRowContent = ({ itemSubPath, rowId, onNavigate, }) => LOCATION_DETAIL_VIEW_HEADERS.map((columnKey) => {
     const key = `${columnKey}-${rowId}`;
     switch (columnKey) {
         case 'checkbox': {

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getHeaders.mjs

@@ -0,0 +1,68 @@
+import { LOCATION_DETAIL_VIEW_HEADERS } from './constants.mjs';
+
+const getHeaders = ({ tableColumnLastModifiedHeader, tableColumnNameHeader, tableColumnSizeHeader, tableColumnTypeHeader, areAllFilesSelected, selectAllFilesLabel, onSelectAll, hasFiles, }) => LOCATION_DETAIL_VIEW_HEADERS.map((key) => {
+    switch (key) {
+        case 'checkbox': {
+            if (hasFiles) {
+                return {
+                    key,
+                    type: 'checkbox',
+                    content: {
+                        checked: areAllFilesSelected,
+                        label: selectAllFilesLabel,
+                        id: 'header-checkbox',
+                        onSelect: onSelectAll,
+                    },
+                };
+            }
+            else {
+                return {
+                    key,
+                    type: 'text',
+                    content: { text: '' },
+                };
+            }
+        }
+        case 'name': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnNameHeader,
+                },
+            };
+        }
+        case 'type': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnTypeHeader,
+                },
+            };
+        }
+        case 'last-modified': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnLastModifiedHeader,
+                },
+            };
+        }
+        case 'size': {
+            return {
+                key,
+                type: 'sort',
+                content: {
+                    label: tableColumnSizeHeader,
+                },
+            };
+        }
+        case 'download': {
+            return { key, type: 'text', content: { text: '' } };
+        }
+    }
+});
+
+export { getHeaders };

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getLocationDetailViewTableData.mjs

@@ -5,22 +5,20 @@ import 'aws-amplify/storage';
 import '../../../actions/configs/context.mjs';
 import { getFileRowContent } from './getFileRowContent.mjs';
 import { getFolderRowContent } from './getFolderRowContent.mjs';
-import { LOCATION_DETAIL_VIEW_HEADERS } from './constants.mjs';
+import { getHeaders } from './getHeaders.mjs';
 
-const getLocationDetailViewTableData = ({ areAllFilesSelected, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }) => {
-    const headerCheckbox = {
-        key: 'checkbox',
-        type: 'checkbox',
-        content: {
-            checked: areAllFilesSelected,
-            label: selectAllFilesLabel,
-            onSelect: onSelectAll,
-            id: 'header-checkbox',
-        },
-    };
-    const headers = hasFiles
-        ? [headerCheckbox, ...LOCATION_DETAIL_VIEW_HEADERS.slice(1)]
-        : LOCATION_DETAIL_VIEW_HEADERS;
+const getLocationDetailViewTableData = ({ areAllFilesSelected, displayText, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }) => {
+    const { tableColumnLastModifiedHeader, tableColumnNameHeader, tableColumnSizeHeader, tableColumnTypeHeader, } = displayText;
+    const headers = getHeaders({
+        areAllFilesSelected,
+        selectAllFilesLabel,
+        hasFiles,
+        onSelectAll,
+        tableColumnLastModifiedHeader,
+        tableColumnNameHeader,
+        tableColumnSizeHeader,
+        tableColumnTypeHeader,
+    });
     const rows = pageItems.map((locationItem) => {
         const { id, key, type } = locationItem;
         switch (type) {

package/dist/esm/components/StorageImage/StorageImage.mjs

@@ -22,7 +22,7 @@ const getDeprecationMessage = ({ hasImgkey, hasPath, hasDeprecatedOptions, }) =>
     }
     return message;
 };
-const StorageImage = ({ accessLevel, className, fallbackSrc, identityId, imgKey, path, onStorageGetError, onGetUrlError, validateObjectExistence = true, ...rest }) => {
+const StorageImage = ({ accessLevel, bucket, className, fallbackSrc, identityId, imgKey, path, onStorageGetError, onGetUrlError, validateObjectExistence = true, ...rest }) => {
     const hasImgkey = !!imgKey;
     const hasPath = !!path;
     const hasDeprecatedOptions = !!accessLevel || !!identityId;
@@ -46,10 +46,19 @@ const StorageImage = ({ accessLevel, className, fallbackSrc, identityId, imgKey,
         onError,
         options: {
             accessLevel,
+            bucket,
             targetIdentityId: identityId,
             validateObjectExistence,
         },
-    }), [accessLevel, imgKey, identityId, onError, path, validateObjectExistence]);
+    }), [
+        accessLevel,
+        bucket,
+        imgKey,
+        identityId,
+        onError,
+        path,
+        validateObjectExistence,
+    ]);
     const { url } = useGetUrl(input);
     return (React.createElement(Image, { ...rest, className: classNames(ComponentClassName.StorageImage, className), src: url?.toString() ?? fallbackSrc }));
 };

package/dist/esm/components/StorageManager/StorageManager.mjs

@@ -22,7 +22,7 @@ const logger = getLogger('Storage');
 const MISSING_REQUIRED_PROPS_MESSAGE = '`StorageManager` requires a `maxFileCount` prop to be provided.';
 const ACCESS_LEVEL_WITH_PATH_CALLBACK_MESSAGE = '`StorageManager` does not allow usage of a `path` callback prop with an `accessLevel` prop.';
 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/storagemanager';
-const StorageManagerBase = React.forwardRef(function StorageManager({ acceptedFileTypes = [], accessLevel, autoUpload = true, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
+const StorageManagerBase = React.forwardRef(function StorageManager({ acceptedFileTypes = [], accessLevel, autoUpload = true, bucket, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
     useDeprecationWarning({
         message: 'The `StorageManager` component has been renamed as the `FileUploader` component.',
         shouldWarn: false,
@@ -81,6 +81,7 @@ const StorageManagerBase = React.forwardRef(function StorageManager({ acceptedFi
     });
     useUploadFiles({
         accessLevel,
+        bucket,
         files,
         isResumable,
         maxFileCount,

package/dist/esm/version.mjs

@@ -1,3 +1,3 @@
-const VERSION = '3.7.2';
+const VERSION = '3.8.1';
 
 export { VERSION };

package/dist/index.js

@@ -9,7 +9,7 @@ var uiReactCore = require('@aws-amplify/ui-react-core');
 var auth = require('aws-amplify/auth');
 var storage = require('aws-amplify/storage');
 var internal = require('@aws-amplify/ui-react/internal');
-var createAmplifyAuthAdapter = require('./createAmplifyAuthAdapter-C0qoSzPO.js');
+var createAmplifyAuthAdapter = require('./createAmplifyAuthAdapter-D6jJJVE_.js');
 require('@aws-amplify/storage/internals');
 require('@aws-amplify/ui-react-core/elements');
 require('aws-amplify');
@@ -305,7 +305,7 @@ const resolveFile = ({ processFile, ...input }) => {
     });
 };
 
-const getInput = ({ accessLevel, file, key, onProgress, path, processFile, useAccelerateEndpoint, }) => {
+const getInput = ({ accessLevel, bucket, file, key, onProgress, path, processFile, useAccelerateEndpoint, }) => {
     return async () => {
         const hasCallbackPath = ui.isFunction(path);
         const hasStringPath = ui.isString(path);
@@ -313,7 +313,13 @@ const getInput = ({ accessLevel, file, key, onProgress, path, processFile, useAc
         const { file: data, key: processedKey, ...rest } = await resolveFile({ file, key, processFile });
         const contentType = file.type || 'binary/octet-stream';
         // IMPORTANT: always pass `...rest` here for backwards compatibility
-        const options = { contentType, onProgress, useAccelerateEndpoint, ...rest };
+        const options = {
+            bucket,
+            contentType,
+            onProgress,
+            useAccelerateEndpoint,
+            ...rest,
+        };
         let inputResult;
         if (hasKeyInput) {
             // legacy handling of `path` is to prefix to `fileKey`
@@ -357,7 +363,7 @@ async function uploadFile({ input, onError, onStart, onComplete, }) {
     return uploadTask;
 }
 
-function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }) {
+function useUploadFiles({ accessLevel, bucket, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }) {
     React__namespace.useEffect(() => {
         const filesReadyToUpload = files.filter((file) => file.status === FileStatus.QUEUED);
         if (filesReadyToUpload.length > maxFileCount) {
@@ -377,6 +383,7 @@ function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploa
             if (file) {
                 const input = getInput({
                     accessLevel,
+                    bucket,
                     file,
                     key,
                     onProgress,
@@ -411,6 +418,7 @@ function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploa
     }, [
         files,
         accessLevel,
+        bucket,
         isResumable,
         setUploadProgress,
         setUploadingFile,
@@ -554,8 +562,8 @@ function FilePicker$1({ children, className = ui.ComponentClassName.FileUploader
 const logger$1 = ui.getLogger('Storage');
 const MISSING_REQUIRED_PROPS_MESSAGE$1 = '`FileUploader` requires a `maxFileCount` prop to be provided.';
 const ACCESS_LEVEL_WITH_PATH_CALLBACK_MESSAGE$1 = '`FileUploader` does not allow usage of a `path` callback prop with an `accessLevel` prop.';
-const ACCESS_LEVEL_DEPRECATION_MESSAGE$1 = '`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';
-const FileUploaderBase = React__namespace.forwardRef(function FileUploader({ acceptedFileTypes = [], accessLevel, autoUpload = true, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
+const ACCESS_LEVEL_DEPRECATION_MESSAGE$1 = '`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#deprecated-props';
+const FileUploaderBase = React__namespace.forwardRef(function FileUploader({ acceptedFileTypes = [], accessLevel, autoUpload = true, bucket, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
     if (!maxFileCount) {
         // eslint-disable-next-line no-console
         console.warn(MISSING_REQUIRED_PROPS_MESSAGE$1);
@@ -610,6 +618,7 @@ const FileUploaderBase = React__namespace.forwardRef(function FileUploader({ acc
     });
     useUploadFiles({
         accessLevel,
+        bucket,
         files,
         isResumable,
         maxFileCount,
@@ -729,7 +738,7 @@ const getDeprecationMessage = ({ hasImgkey, hasPath, hasDeprecatedOptions, }) =>
     }
     return message;
 };
-const StorageImage = ({ accessLevel, className, fallbackSrc, identityId, imgKey, path, onStorageGetError, onGetUrlError, validateObjectExistence = true, ...rest }) => {
+const StorageImage = ({ accessLevel, bucket, className, fallbackSrc, identityId, imgKey, path, onStorageGetError, onGetUrlError, validateObjectExistence = true, ...rest }) => {
     const hasImgkey = !!imgKey;
     const hasPath = !!path;
     const hasDeprecatedOptions = !!accessLevel || !!identityId;
@@ -753,10 +762,19 @@ const StorageImage = ({ accessLevel, className, fallbackSrc, identityId, imgKey,
         onError,
         options: {
             accessLevel,
+            bucket,
             targetIdentityId: identityId,
             validateObjectExistence,
         },
-    }), [accessLevel, imgKey, identityId, onError, path, validateObjectExistence]);
+    }), [
+        accessLevel,
+        bucket,
+        imgKey,
+        identityId,
+        onError,
+        path,
+        validateObjectExistence,
+    ]);
     const { url } = uiReactCore.useGetUrl(input);
     return (React__namespace.createElement(uiReact.Image, { ...rest, className: ui.classNames(ui.ComponentClassName.StorageImage, className), src: url?.toString() ?? fallbackSrc }));
 };
@@ -891,7 +909,7 @@ const logger = ui.getLogger('Storage');
 const MISSING_REQUIRED_PROPS_MESSAGE = '`StorageManager` requires a `maxFileCount` prop to be provided.';
 const ACCESS_LEVEL_WITH_PATH_CALLBACK_MESSAGE = '`StorageManager` does not allow usage of a `path` callback prop with an `accessLevel` prop.';
 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/storagemanager';
-const StorageManagerBase = React__namespace.forwardRef(function StorageManager({ acceptedFileTypes = [], accessLevel, autoUpload = true, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
+const StorageManagerBase = React__namespace.forwardRef(function StorageManager({ acceptedFileTypes = [], accessLevel, autoUpload = true, bucket, components, defaultFiles, displayText: overrideDisplayText, isResumable = false, maxFileCount, maxFileSize, onFileRemove, onUploadError, onUploadStart, onUploadSuccess, path, processFile, showThumbnails = true, useAccelerateEndpoint, }, ref) {
     uiReactCore.useDeprecationWarning({
         message: 'The `StorageManager` component has been renamed as the `FileUploader` component.',
         shouldWarn: false,
@@ -950,6 +968,7 @@ const StorageManagerBase = React__namespace.forwardRef(function StorageManager({
     });
     useUploadFiles({
         accessLevel,
+        bucket,
         files,
         isResumable,
         maxFileCount,

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

@@ -3,7 +3,7 @@ import { FileUploaderProps, FileUploaderPathProps, FileUploaderHandle } from './
 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";
+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#deprecated-props";
 declare const FileUploader: React.ForwardRefExoticComponent<(FileUploaderProps | FileUploaderPathProps) & React.RefAttributes<FileUploaderHandle>> & {
     Container: typeof Container;
     DropZone: typeof DropZone;

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

@@ -1,8 +1,9 @@
 import { PathCallback } from '../../utils';
-import { FileUploaderProps } from '../../types';
+import { FileUploaderProps, StorageBucket } 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'];
+    bucket?: StorageBucket;
     path?: string | PathCallback;
 }
-export declare function useUploadFiles({ accessLevel, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }: UseUploadFilesProps): void;
+export declare function useUploadFiles({ accessLevel, bucket, files, isResumable, maxFileCount, onUploadError, onUploadStart, onUploadSuccess, path, processFile, setUploadingFile, setUploadProgress, setUploadSuccess, useAccelerateEndpoint, }: UseUploadFilesProps): void;

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

@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { ContainerProps, DropZoneProps, FileListHeaderProps, FileListFooterProps, FileListProps, FilePickerProps } from './ui';
 import { FileUploaderDisplayText, PathCallback, UploadTask } from './utils';
+export interface BucketInfo {
+    bucketName: string;
+    region: string;
+}
+export type StorageBucket = string | BucketInfo;
 export declare enum FileStatus {
     ADDED = "added",
     QUEUED = "queued",
@@ -115,8 +120,9 @@ export interface FileUploaderProps {
      */
     path?: string;
     useAccelerateEndpoint?: boolean;
+    bucket?: never;
 }
-export interface FileUploaderPathProps extends Omit<FileUploaderProps, 'accessLevel' | 'path'> {
+export interface FileUploaderPathProps extends Omit<FileUploaderProps, 'accessLevel' | 'bucket' | 'path'> {
     /**
      * S3 bucket key, allows either a `string` or a `PathCallback`:
      * - `string`: `path` is prefixed to the file `key` for each file
@@ -125,5 +131,6 @@ export interface FileUploaderPathProps extends Omit<FileUploaderProps, 'accessLe
      */
     path: string | PathCallback;
     accessLevel?: never;
+    bucket?: StorageBucket;
     useAccelerateEndpoint?: boolean;
 }

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

@@ -1,8 +1,9 @@
 import { UploadDataWithPathInput, UploadDataInput } from 'aws-amplify/storage';
-import { ProcessFile, StorageAccessLevel } from '../types';
+import { ProcessFile, StorageAccessLevel, StorageBucket } from '../types';
 import { PathCallback, PathInput } from './uploadFile';
 export interface GetInputParams {
     accessLevel: StorageAccessLevel | undefined;
+    bucket?: StorageBucket;
     file: File;
     key: string;
     onProgress: NonNullable<UploadDataWithPathInput['options']>['onProgress'];
@@ -10,4 +11,4 @@ export interface GetInputParams {
     processFile: ProcessFile | undefined;
     useAccelerateEndpoint?: boolean;
 }
-export declare const getInput: ({ accessLevel, file, key, onProgress, path, processFile, useAccelerateEndpoint, }: GetInputParams) => () => Promise<PathInput | UploadDataInput>;
+export declare const getInput: ({ accessLevel, bucket, file, key, onProgress, path, processFile, useAccelerateEndpoint, }: GetInputParams) => () => Promise<PathInput | UploadDataInput>;

package/dist/types/components/StorageBrowser/composables/DataTable/DataTable.d.ts

@@ -6,6 +6,7 @@ export interface DataTableRow {
 }
 export interface DataTableProps {
     headers: WithKey<DataTableHeader>[];
+    isLoading?: boolean;
     rows: WithKey<DataTableRow>[];
 }
-export declare const DataTable: ({ headers, rows, }: DataTableProps) => React.JSX.Element;
+export declare const DataTable: ({ headers, isLoading, rows, }: DataTableProps) => React.JSX.Element;

package/dist/types/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/constants.d.ts

@@ -1,2 +1,2 @@
-import { LocationDetailViewHeaders } from './types';
-export declare const LOCATION_DETAIL_VIEW_HEADERS: LocationDetailViewHeaders;
+import { HeaderKeys } from './types';
+export declare const LOCATION_DETAIL_VIEW_HEADERS: HeaderKeys[];

package/dist/types/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getHeaders.d.ts

@@ -0,0 +1,11 @@
+import { LocationDetailViewHeaders } from './types';
+export declare const getHeaders: ({ tableColumnLastModifiedHeader, tableColumnNameHeader, tableColumnSizeHeader, tableColumnTypeHeader, areAllFilesSelected, selectAllFilesLabel, onSelectAll, hasFiles, }: {
+    tableColumnLastModifiedHeader: string;
+    tableColumnNameHeader: string;
+    tableColumnSizeHeader: string;
+    tableColumnTypeHeader: string;
+    areAllFilesSelected: boolean;
+    selectAllFilesLabel: string;
+    onSelectAll: () => void;
+    hasFiles: boolean;
+}) => LocationDetailViewHeaders;

package/dist/types/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getLocationDetailViewTableData.d.ts

@@ -1,8 +1,10 @@
 import { FileData, FileDataItem, LocationItemData, LocationData } from '../../../actions';
 import { DataTableProps } from '../../../composables/DataTable';
+import { DefaultLocationDetailViewDisplayText } from '../../../displayText/types';
 import { LocationState } from '../../../providers/store/location';
-export declare const getLocationDetailViewTableData: ({ areAllFilesSelected, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }: {
+export declare const getLocationDetailViewTableData: ({ areAllFilesSelected, displayText, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }: {
     areAllFilesSelected: boolean;
+    displayText: DefaultLocationDetailViewDisplayText;
     location: LocationState;
     fileDataItems?: FileData[] | undefined;
     hasFiles: boolean;

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

@@ -4,4 +4,4 @@ export declare const MISSING_REQUIRED_PROP_MESSAGE = "`StorageImage` requires ei
 export declare const HAS_DEPRECATED_PROPS_MESSAGE = "`imgKey`, `accessLevel`, and `identityId` will be replaced with `path` in a future major version. See https://ui.docs.amplify.aws/react/connected-components/storage/storageimage#props";
 export declare const HAS_PATH_AND_KEY_MESSAGE = "`imgKey` is ignored when both `imgKey` and `path` props are provided.";
 export declare const HAS_PATH_AND_UNSUPPORTED_OPTIONS_MESSAGE = "`accessLevel` and `identityId` are ignored when the `path` prop is provided.";
-export declare const StorageImage: ({ accessLevel, className, fallbackSrc, identityId, imgKey, path, onStorageGetError, onGetUrlError, validateObjectExistence, ...rest }: StorageImageProps | StorageImagePathProps) => React.JSX.Element;
+export declare const StorageImage: ({ accessLevel, bucket, className, fallbackSrc, identityId, imgKey, path, onStorageGetError, onGetUrlError, validateObjectExistence, ...rest }: StorageImageProps | StorageImagePathProps) => React.JSX.Element;

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

@@ -1,4 +1,5 @@
 import { ImageProps } from '@aws-amplify/ui-react';
+import { StorageBucket } from '../FileUploader/types';
 type StorageAccessLevel = 'guest' | 'protected' | 'private';
 export interface StorageImageProps extends Omit<ImageProps, 'src'> {
     /**
@@ -11,6 +12,7 @@ export interface StorageImageProps extends Omit<ImageProps, 'src'> {
      * `accessLevel` will be replaced with `path` in a future major version of Amplify UI. See https://ui.docs.amplify.aws/react/connected-components/storage/storageimage#props
      */
     accessLevel: StorageAccessLevel;
+    bucket?: never;
     /**
      * @deprecated
      * `identityId` will be replaced with `path` in a future major version of Amplify UI. See https://ui.docs.amplify.aws/react/connected-components/storage/storageimage#props
@@ -27,13 +29,14 @@ export interface StorageImageProps extends Omit<ImageProps, 'src'> {
     onGetUrlError?: (error: Error) => void;
     path?: never;
 }
-type OmittedPropKey = 'accessLevel' | 'imgKey' | 'identityId' | 'onStorageGetError' | 'path';
+type OmittedPropKey = 'accessLevel' | 'bucket' | 'imgKey' | 'identityId' | 'onStorageGetError' | 'path';
 export interface StorageImagePathProps extends Omit<StorageImageProps, OmittedPropKey> {
     path: string | ((input: {
         identityId?: string;
     }) => string);
     imgKey?: never;
     accessLevel?: never;
+    bucket?: StorageBucket;
     identityId?: never;
     onStorageGetError?: never;
 }

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

@@ -1,7 +1,10 @@
-import * as React from 'react';
-import { FileStatus, StorageAccessLevel } from '../FileUploader/types';
-import { FileUploaderDisplayText as StorageManagerDisplayText, PathCallback, UploadTask } from '../FileUploader/utils';
-import { ContainerProps, DropZoneProps, FileListHeaderProps, FileListFooterProps, FileListProps, FilePickerProps } from './ui';
+import { FileStatus, FileUploaderProps } from '../FileUploader/types';
+import { PathCallback, UploadTask } from '../FileUploader/utils';
+interface BucketInfo {
+    bucketName: string;
+    region: string;
+}
+export type StorageBucket = string | BucketInfo;
 export interface StorageFile {
     id: string;
     file?: File;
@@ -24,91 +27,14 @@ export type ProcessFile = (params: ProcessFileParams) => Promise<ProcessFilePara
 export interface StorageManagerHandle {
     clearFiles: () => void;
 }
-export interface StorageManagerProps {
-    /**
-     * 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?: StorageManagerDisplayText;
-    /**
-     * 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 StorageManagerProps extends FileUploaderProps {
 }
-export interface StorageManagerPathProps extends Omit<StorageManagerProps, 'accessLevel' | 'path'> {
+export interface StorageManagerPathProps extends Omit<StorageManagerProps, 'accessLevel' | 'bucket' | 'path'> {
+    /** S3 bucket, allows either a string or `BucketInfo`:
+     * - `string`: the "friendly name" assigned to the bucket
+     * - `BucketInfo`: object containing the actual S3 bucket name and its region
+     */
+    bucket?: StorageBucket;
     /**
      * S3 bucket key, allows either a `string` or a `PathCallback`:
      * - `string`: `path` is prefixed to the file `key` for each file
@@ -119,3 +45,4 @@ export interface StorageManagerPathProps extends Omit<StorageManagerProps, 'acce
     accessLevel?: never;
     useAccelerateEndpoint?: boolean;
 }
+export {};

package/dist/types/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "3.7.2";
+export declare const VERSION = "3.8.1";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/ui-react-storage",
-  "version": "3.7.2",
+  "version": "3.8.1",
   "main": "dist/index.js",
   "module": "dist/esm/index.mjs",
   "exports": {
@@ -45,9 +45,9 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@aws-amplify/ui": "6.8.1",
-    "@aws-amplify/ui-react": "6.9.1",
-    "@aws-amplify/ui-react-core": "3.3.1",
+    "@aws-amplify/ui": "6.8.2",
+    "@aws-amplify/ui-react": "6.9.2",
+    "@aws-amplify/ui-react-core": "3.3.2",
     "tslib": "^2.5.2"
   },
   "peerDependencies": {