# FileUpload ## Description BitFileUpload is the transport half of working with files: it takes the files the user hands over and uploads them to a server endpoint over HTTP. Files arrive through the file dialog, a drag out of the OS, a clipboard paste, a whole folder or the camera on a phone, and go out automatically on selection or on demand, as a single request per file or in chunks. Every file reports its own progress and can be paused, resumed, canceled, retried and removed from the server again, and selections are validated on arrival against size, count, extension, MIME type, duplicate, image dimension and custom rules. The upload and remove requests are customizable down to a per-request async provider, which is what makes an expiring token or a presigned URL work over a long transfer, and the whole control is themable, templatable and announced to screen readers. For plain file selection without any uploading, reach for the BitFileInput component instead. ## Parameters | Name | Type | Default Value | Description | | :--- | :--- | :------------ | :---------- | | Accept | `string?` | null | Accepted file types for the file browser using MIME types or file extensions (e.g., "image/*", ".pdf,.doc"), applied to the accept attribute of the underlying input element. When not set, the accept attribute is generated from AllowedExtensions. | | AllowDrop | `bool` | true | Whether files can be selected by dragging them from the operating system and dropping them on the component. | | AllowDuplicates | `bool` | true | Whether a file that is already in the file list can be selected again. When disabled, a newly selected file matching an existing one by name, size and last modified time is rejected with the DuplicateErrorMessage instead of being uploaded a second time, becoming eligible again once the file it duplicates is removed. | | AllowedExtensions | `IReadOnlyCollection<string>` | ["*"] | Allowed file types for validation purposes, accepting both file extensions (with an optional leading dot, case-insensitive) and MIME types with an optional wildcard (e.g., "image/*"). Use ["*"] to allow all file types. Files not matching any of these entries will not be uploaded. | | AllowPaste | `bool` | true | Whether files can be selected by pasting them from the clipboard onto the component. The paste is only captured while the focus is inside the component. | | AnnouncementProvider | `Func<IReadOnlyList<BitFileInfo>, string?>?` | null | Custom provider of the text announced by the screen reader through the live region of the component whenever the file list or an upload outcome changes. Receives the current file list and returns the text to announce, or null to announce nothing. When not set, a built-in English announcement is used. | | Append | `bool` | false | Whether a new selection is added to the end of the current file list instead of replacing it, which is what lets the user build a batch up over several rounds of browsing, dropping or pasting. The files already in the list keep their upload state. | | AutoChunkSize | `bool` | false | Calculate the chunk size dynamically based on the user's Internet speed between 512 KB and 10 MB. | | AutoReset | `bool` | false | Whether the file list and the upload state are cleared right before the file dialog opens, so that every browse starts from a clean slate - the list empties even if the dialog is then cancelled. | | AutoRetries | `int` | 0 | The number of times a failed upload of a file gets retried automatically before it is reported as failed. In the chunked mode each retry resumes from the last successfully uploaded chunk. Set to 0 (the default) to disable the automatic retries. | | AutoRetryDelay | `TimeSpan?` | null | The delay before each automatic retry of a failed upload. Set to null (the default) to retry immediately. | | AutoUpload | `bool` | false | Whether the selected files start uploading the moment they are selected, skipping the per-file upload button entirely, for the cases where the selection itself expresses the intent to upload. | | CancelButtonTitle | `string?` | null | The tooltip of the cancel upload button, which is also used as the prefix of its accessible label (e.g., "Cancel report.pdf"). Defaults to "Cancel". | | CancelIcon | `BitIconInfo?` | null | The icon to use for the cancel upload button using custom CSS classes for external icon libraries. Takes precedence over CancelIconName when both are set. | | CancelIconName | `string?` | null | The name of the icon to use for the cancel upload button from the built-in Fluent UI icons. Defaults to Cancel when not set. | | CanceledUploadMessage | `string` | File upload canceled | The message shown for canceled file uploads. | | Capture | `string?` | null | The capture behavior of the file input on devices with a camera or microphone, rendered as the capture attribute of the input element (e.g., "user" for the front camera, "environment" for the rear camera). | | ChunkedUpload | `bool` | false | Whether each file is sliced and sent as a series of sequential requests instead of one monolithic one, which is what makes a paused or failed file resume from the last chunk that made it through rather than starting over, so a dropped connection costs one chunk instead of the whole transfer. | | ChunkSize | `long?` | null | The size in bytes of each chunk of a chunked upload. When not set - and whenever AutoChunkSize is enabled, which takes the decision over - it starts at 512 KB. | | Classes | `BitFileUploadClassStyles?` | null | Custom CSS classes for different parts of the BitFileUpload. | | Color | `BitColor?` | null | The general color of the file upload, applied to the browse button, the drag-and-drop indicator, the progress bars and the hovered action buttons. | | ConcurrentUploads | `int` | 0 | The maximum number of files uploading at the same time, the remaining ones waiting in a queue in selection order and starting as soon as a slot frees up. Set to 0 (the default) to start every file at once. | | Description | `string?` | null | A short hint rendered under the browse button and wired to it through aria-describedby, which is the place to spell out the accepted file types and the size limits so that both sighted and screen reader users learn the constraints before hitting them. | | DescriptionTemplate | `RenderFragment?` | null | Custom Razor template of the hint rendered under the browse button, taking precedence over Description. | | Directory | `bool` | false | Whether to select folders (directories) instead of files, rendered as the webkitdirectory attribute. All files inside the selected folder and its subfolders will be added to the file list. It also makes a dropped folder expand into its contents instead of being ignored. | | DuplicateErrorMessage | `string` | The file is already selected | The message shown for the files rejected for being already in the file list while AllowDuplicates is disabled. | | FailedRemoveMessage | `string` | File remove failed | The message shown for failed file removes. | | FailedUploadMessage | `string` | File upload failed | The message shown for failed file uploads. | | FileSizeFormatter | `Func<long, string>?` | null | Custom formatter of the file size shown under the name of each file item. Receives the size of the file in bytes and returns the text to display, which is the place to localize the units or to switch between the binary and the decimal bases. When not set, a built-in humanizer is used. | | FileValidator | `Func<BitFileInfo, string?>?` | null | Custom validation function called for each newly selected file after the built-in validations pass. Return an error message to reject the file so it will not be uploaded, or null to accept it. | | FileViewTemplate | `RenderFragment<BitFileInfo>?` | null | Custom Razor template rendering each item of the file list in place of the built-in one, receiving the file as its context with its name, size, progress, speed and status all available. It is only asked for the files that are actually in the list, so a removed file leaves no empty item behind. | | HideFileView | `bool` | false | Whether the built-in file list is left unrendered. The files are still selected, validated, uploaded and reported through the Files property and the callbacks - they are simply not drawn, which is what the surrounding page needs when it shows the attachments in a layout of its own. | | HideLabel | `bool` | false | Whether to hide the default browse button label from the UI. | | Label | `string` | Browse | The text of the browse button. Setting it to an empty string hides the button altogether. | | LabelTemplate | `RenderFragment?` | null | Custom Razor template rendered in place of the browse button, which also replaces the built-in dashed drop indicator living on that button - a custom label should bring its own drag feedback through the Dragging entry of Classes or Styles. | | MaxCount | `int` | 0 | Maximum allowed number of files in the file list (0 for unlimited). Files selected beyond this count are rejected at selection time and will not be uploaded. Only files that pass the other validations consume a slot. | | MaxCountErrorMessage | `string` | The maximum number of files is exceeded | Specifies the message shown for the files rejected due to exceeding the maximum number of files. | | MaxSize | `long` | 0 | The maximum allowed size in bytes of each file (0 for unlimited). A larger file is rejected at selection time with the MaxSizeErrorMessage and will not be uploaded. | | MaxSizeErrorMessage | `string` | The file size is larger than the max size | The message shown for the files rejected for being larger than the MaxSize. | | MaxTotalSize | `long` | 0 | Maximum allowed total size in bytes of all the files of the file list (0 for unlimited). Files pushing the accumulated size beyond this limit are rejected at selection time and will not be uploaded, becoming eligible again once removals free up room. Only files that pass the other validations consume the budget. | | MaxTotalSizeErrorMessage | `string` | The total size of the files is larger than the max total size | Specifies the message shown for the files rejected for making the total size of the file list exceed the maximum total size. | | MinSize | `long` | 0 | The minimum allowed size in bytes of each file (0 for no limit). A smaller file is rejected at selection time with the MinSizeErrorMessage and will not be uploaded. | | MinSizeErrorMessage | `string` | The file size is smaller than the min size | The message shown for the files rejected for being smaller than the MinSize. | | Multiple | `bool` | false | Whether several files can be handed over at once, both through the file dialog and through a single drop or paste. Without it a multi-file drop or paste is trimmed down to its first file. | | NotAllowedExtensionErrorMessage | `string` | The file type is not allowed | The message shown for the files rejected for not matching any entry of AllowedExtensions. | | OnAllUploadsComplete | `EventCallback<BitFileInfo[]>` | | Callback for when every file of a batch that actually started uploading has reached a terminal state - completed, failed, canceled, removed or rejected by the validations. A selection that was never asked to upload never settles, so it never reports itself as complete. | | OnChange | `EventCallback<BitFileInfo[]>` | | Callback for when file or files status change. It is invoked with the whole file list right after a selection, and with only the file that changed whenever a single status changes afterwards, so the current state of the batch is better read back from the Files property than from the argument. | | OnInvalid | `EventCallback<BitFileInfo[]>` | | Callback invoked right after OnChange whenever a selection carries at least one file rejected by the validations, providing an array of only the rejected files along with their messages. | | OnProgress | `EventCallback<BitFileInfo>` | | Callback for when the upload of a file makes progress, invoked on every progress report of the browser with the file whose TotalUploadedSize, UploadSpeed and RemainingTime have just moved. | | OnRemoveComplete | `EventCallback<BitFileInfo>` | | Callback for when a file has been removed, whether it was dropped from the list on this side or deleted from the server through the RemoveUrl. | | OnRemoveFailed | `EventCallback<BitFileInfo>` | | Callback for when the removal of a file from the server failed, leaving the file in the list with the FailedRemoveMessage rather than pretending it is gone. | | OnUploading | `EventCallback<BitFileInfo>` | | Callback for when a file upload is about to start, invoked before the request that carries its first byte and therefore once per run of the file rather than once per chunk. It is the place to attach the HttpHeaders and the FormFields that belong to this one file, both of which are read again for every request it makes. | | OnUploadComplete | `EventCallback<BitFileInfo>` | | Callback for when a file has been uploaded successfully, with the body of the server response of its last request on its Message. | | OnUploadFailed | `EventCallback<BitFileInfo>` | | Callback for when the upload of a file failed for good - after the automatic retries, if any, have all been spent - with the body of the failed response on its Message. | | PauseButtonTitle | `string?` | null | The tooltip of the pause upload button, which is also used as the prefix of its accessible label (e.g., "Pause report.pdf"). Defaults to "Pause". | | PauseIcon | `BitIconInfo?` | null | The icon to use for the pause upload button using custom CSS classes for external icon libraries. Takes precedence over PauseIconName when both are set. | | PauseIconName | `string?` | null | The name of the icon to use for the pause upload button from the built-in Fluent UI icons. Defaults to Pause when not set. | | QueuedUploadMessage | `string` | Waiting to upload | The message shown for the files waiting in the queue for a free slot of the ConcurrentUploads limit, which is what tells a file that is about to start apart from one that was never asked to upload. | | ReadImageDimensions | `bool` | false | Whether to read the pixel dimensions of the selected image files, filling the Width and Height of each of them before the validations run, so that a FileValidator can reject an image by its dimensions. Reading them means decoding every image in the browser, which costs time and memory on a large selection, so it is off by default. | | RemoveButtonTitle | `string?` | null | The tooltip of the remove file button, which is also used as the prefix of its accessible label (e.g., "Remove report.pdf"). Defaults to "Remove". | | RemoveIcon | `BitIconInfo?` | null | The icon to use for the remove file button using custom CSS classes for external icon libraries. Takes precedence over RemoveIconName when both are set. | | RemoveIconName | `string?` | null | The name of the icon to use for the remove file button from the built-in Fluent UI icons. Defaults to Delete when not set. | | RemoveRequestHttpHeaders | `Dictionary<string, string>?` | null | Custom HTTP headers attached to the remove request. | | RemoveRequestHttpHeadersProvider | `Func<Task<Dictionary<string, string>>>?` | null | The provider function creating the HTTP headers of the remove request, invoked right before the request goes out and taking precedence over RemoveRequestHttpHeaders. | | RemoveRequestHttpMethod | `string?` | null | The HTTP method of the remove request (e.g., "POST"). Defaults to "DELETE". | | RemoveRequestQueryStrings | `Dictionary<string, string>?` | null | Custom query strings appended to the URL of the remove request. | | RemoveRequestQueryStringsProvider | `Func<Task<Dictionary<string, string>>>?` | null | The provider function creating the query strings of the remove request, invoked right before the request goes out and taking precedence over RemoveRequestQueryStrings. | | RemoveUrl | `string?` | null | URL of the server endpoint removing the files. A file whose bytes already reached the server is deleted from it through a request to this URL carrying its name as a query string and its id in the BIT_FILE_ID header; a file that never uploaded is simply dropped from the list without one. | | RetryButtonTitle | `string?` | null | The tooltip of the retry button of a failed or canceled file, which is also used as the prefix of its accessible label (e.g., "Retry report.pdf"). Falls back to UploadButtonTitle and then to "Retry". | | RetryIcon | `BitIconInfo?` | null | The icon to use for the retry button of a failed or canceled file using custom CSS classes for external icon libraries. Takes precedence over RetryIconName when both are set. | | RetryIconName | `string?` | null | The name of the icon to use for the retry button of a failed or canceled file from the built-in Fluent UI icons. Falls back to UploadIconName and then to Refresh. | | ShouldAutoRetry | `Func<BitFileInfo, int, bool>?` | null | Decides whether a failed upload is worth retrying automatically, receiving the file and the HTTP status code of the failed request (0 for a network error, a timeout or an aborted request) and returning true to spend one of the AutoRetries attempts on it. When not set, a built-in rule retries network errors, timeouts, 408, 429 and the 5xx server errors, and gives up right away on the other 4xx. | | ShowPreview | `bool` | false | Whether a thumbnail of every selected image is shown at the head of its file item, produced entirely in the browser from an object URL that is handed back as soon as the file is removed or the component is reset. The same URL is on the PreviewUrl of each file. | | ShowRemoveButton | `bool` | false | Whether each settled file item offers a remove button, which drops a file that never uploaded from the list and deletes an uploaded one from the server through the RemoveUrl. | | Size | `BitSize?` | null | The size of the file upload, applied to the browse button and the file list items. | | Styles | `BitFileUploadClassStyles?` | null | Custom CSS styles for different parts of the BitFileUpload. | | SuccessfulUploadMessage | `string` | File upload succeeded | The message shown for successful file uploads. | | UploadButtonTitle | `string?` | null | The tooltip of the upload button, which is also used as the prefix of its accessible label (e.g., "Upload report.pdf"). Defaults to "Upload". | | UploadFormFieldName | `string?` | null | The name of the form field carrying the file content in the upload request. Defaults to "file". | | UploadIcon | `BitIconInfo?` | null | The icon to use for the upload button using custom CSS classes for external icon libraries. Takes precedence over UploadIconName when both are set. | | UploadIconName | `string?` | null | The name of the icon to use for the upload button from the built-in Fluent UI icons. Defaults to Play when not set. | | UploadRequestFormFields | `Dictionary<string, string>?` | null | Additional multipart form fields sent alongside the content of every file in its upload requests, for the endpoints that read their metadata from the form rather than from the query string. The FormFields of a file is merged over these for that file. | | UploadRequestHttpHeaders | `Dictionary<string, string>?` | null | Custom HTTP headers attached to the upload requests, fixed at selection time. | | UploadRequestHttpHeadersProvider | `Func<Task<Dictionary<string, string>>>?` | null | The provider function to create the http headers for upload request. Unlike UploadRequestHttpHeaders, it is invoked right before every single request - each file and each chunk - which is what lets it hand over a freshly minted access token. | | UploadRequestHttpMethod | `string?` | null | The HTTP method of the upload request (e.g., "PUT"). Defaults to "POST". | | UploadRequestQueryStrings | `Dictionary<string, string>?` | null | Custom query strings appended to the URL of the upload requests, fixed at selection time. | | UploadRequestQueryStringsProvider | `Func<Task<Dictionary<string, string>>>?` | null | The provider function to create the query strings for upload request. Unlike UploadRequestQueryStrings, it is invoked right before every single request - each file and each chunk - which is what lets it hand over a value that does not survive a batch. | | UploadTimeout | `TimeSpan?` | null | The timeout of the upload request for each file or chunk. When it elapses the upload of the file fails. Set to null (the default) for no timeout. | | UploadUrl | `string?` | null | URL of the server endpoint receiving the files, fixed at selection time. Use UploadUrlProvider instead for an endpoint that has to be minted per request. | | UploadUrlProvider | `Func<Task<string?>>?` | null | The provider function to create the URL of the server endpoint receiving the files. Unlike UploadUrl, it is invoked right before every single request - each file and each chunk - which is what lets it hand over a presigned URL that expires. | | Variant | `BitVariant?` | null | The visual variant of the browse button, which decides how much of the Color it carries: a full fill, only an outline, or neither. | | WithCredentials | `bool` | false | Whether the upload request is sent with credentials such as cookies and authorization headers for cross-origin requests (the withCredentials flag of the underlying XMLHttpRequest). | | AriaLabel | `string?` | null | Gets or sets the accessible label for the component, used by assistive technologies. | | Class | `string?` | null | Gets or sets the CSS class name(s) to apply to the rendered element. | | Dir | `BitDir?` | null | Gets or sets the text directionality for the component's content. | | ForceAnimation | `bool` | false | Gets or sets a value indicating whether the component's animations play at their full duration even when reduced motion is requested. | | HtmlAttributes | `Dictionary<string, object>` | new Dictionary<string, object>() | Captures additional HTML attributes to be applied to the rendered element, in addition to the component's parameters. | | Id | `string?` | null | Gets or sets the unique identifier for the component's root element. | | IsEnabled | `bool` | true | Gets or sets a value indicating whether the component is enabled and can respond to user interaction. | | Style | `string?` | null | Gets or sets the CSS style string to apply to the rendered element. | | TabIndex | `string?` | null | Gets or sets the tab order index for the component when navigating with the keyboard. | | Visibility | `BitVisibility` | BitVisibility.Visible | Gets or sets the visibility state (visible, hidden, or collapsed) of the component. | ## Public Members | Name | Type | Default Value | Description | | :--- | :--- | :------------ | :---------- | | Files | `IReadOnlyList<BitFileInfo>` | [] | A list of all of the selected files to upload. | | UploadStatus | `BitFileUploadStatus` | Pending | The current status of the file uploader. | | InputId | `string?` | | The id of the file input element. | | IsRemoving | `bool` | false | Indicates that the file upload is in the middle of removing a file. | | TotalSize | `long` | 0 | The total size in bytes of all the files of the batch, excluding the removed ones and the ones rejected by the validations. | | TotalUploadedSize | `long` | 0 | The total uploaded size in bytes across all the files of the batch, excluding the removed ones and the ones rejected by the validations. | | OverallUploadProgress | `int` | 0 | The overall upload progress of the batch as a percentage (0 to 100), combining the progress of all the files weighted by their size. | | TotalUploadSpeed | `double?` | null | The combined speed in bytes per second of every file of the batch that is uploading right now, which is what the connection as a whole is carrying. It is null while nothing is on the wire. | | OverallRemainingTime | `TimeSpan?` | null | The estimated time left before the whole batch is uploaded, derived from the TotalUploadSpeed and the bytes of the batch that are still to be sent. It is null whenever nothing is uploading and the speed is therefore unknown. | | Upload | `(BitFileInfo? fileInfo = null, string? uploadUrl = null) => Task` | | Starts uploading a specific file, or all files when no file is specified, resuming a paused or chunked file from the last chunk that made it through and retrying a failed or canceled one with a fresh budget of automatic retries. A file whose request is already on the wire is left running rather than being started over. | | PauseUpload | `(BitFileInfo? fileInfo = null) => Task` | | Pauses the upload of a specific file, or all files when no file is specified, applying to the files that are on their way: an in-progress file aborts its in-flight request and keeps the bytes that made it, and a file waiting in the concurrency queue is taken out of it. Both can be resumed later through the Upload method. A file that was never asked to upload, and one that has already settled, are left as they are. | | CancelUpload | `(BitFileInfo? fileInfo = null) => Task` | | Cancels the upload of a specific file, or all files when no file is specified, settling every file that is still in play - running, queued, paused or merely selected - as canceled right away and aborting the in-flight request of a running one. A file that has already settled is left alone, and a canceled file can be started again later. | | RemoveFile | `(BitFileInfo? fileInfo = null) => Task` | | Removes a specific file, or all files when no file is specified, deleting the (partially) uploaded ones from the server through the RemoveUrl. | | Browse | `() => Task` | | Opens a file selection dialog. | | Reset | `() => Task` | | Resets the file upload, clearing the file list and the upload state. | | UniqueId | `Guid` | Guid.NewGuid() | Gets the readonly unique identifier for the component's root element, assigned when the component instance is constructed. | | RootElement | `ElementReference` | | Gets the reference to the root HTML element associated with this component. | ## Enums ### BitColor Enum | Name | Value | Description | | :--- | :--- | :---------- | | Primary | 0 | Primary general color. | | Secondary | 1 | Secondary general color. | | Tertiary | 2 | Tertiary general color. | | Info | 3 | Info general color. | | Success | 4 | Success general color. | | Warning | 5 | Warning general color. | | SevereWarning | 6 | SevereWarning general color. | | Error | 7 | Error general color. | | PrimaryBackground | 8 | Primary background color. | | SecondaryBackground | 9 | Secondary background color. | | TertiaryBackground | 10 | Tertiary background color. | | PrimaryForeground | 11 | Primary foreground color. | | SecondaryForeground | 12 | Secondary foreground color. | | TertiaryForeground | 13 | Tertiary foreground color. | | PrimaryBorder | 14 | Primary border color. | | SecondaryBorder | 15 | Secondary border color. | | TertiaryBorder | 16 | Tertiary border color. | ### BitSize Enum | Name | Value | Description | | :--- | :--- | :---------- | | Small | 0 | The small size file upload. | | Medium | 1 | The medium size file upload. | | Large | 2 | The large size file upload. | ### BitVariant Enum | Name | Value | Description | | :--- | :--- | :---------- | | Fill | 0 | Fill styled variant. | | Outline | 1 | Outline styled variant. | | Text | 2 | Text styled variant. | ### BitFileUploadStatus Enum | Name | Value | Description | | :--- | :--- | :---------- | | Pending | 0 | The file is selected and queued, and its uploading has not started yet. | | InProgress | 1 | File uploading is in progress. | | Paused | 2 | File uploading progress is paused by the user. | | Canceled | 3 | File uploading progress is canceled by the user. | | Completed | 4 | The file is successfully uploaded. | | Failed | 5 | The file has a problem and progress is failed. | | Removed | 6 | The uploaded file removed by the user. | | RemoveFailed | 7 | The file removal failed. | | NotAllowed | 8 | The file is rejected by the validations (size, count, type or a custom rule) and will not be uploaded. | ### BitVisibility Enum | Name | Value | Description | | :--- | :--- | :---------- | | Visible | 0 | The content of the component is visible. | | Hidden | 1 | The content of the component is hidden, but the space it takes on the page remains (visibility:hidden). | | Collapsed | 2 | The component is hidden (display:none). | ### BitDir Enum | Name | Value | Description | | :--- | :--- | :---------- | | Ltr | 0 | Ltr (left to right) is to be used for languages that are written from the left to the right (like English). | | Rtl | 1 | Rtl (right to left) is to be used for languages that are written from the right to the left (like Arabic). | | Auto | 2 | Auto lets the user agent decide. It uses a basic algorithm as it parses the characters inside the element until it finds a character with a strong directionality, then applies that directionality to the whole element. | ## Sub Classes ### BitIconInfo Properties | Name | Type | Default Value | Description | | :--- | :--- | :------------ | :---------- | | Name | `string?` | null | Gets or sets the name of the icon. | | BaseClass | `string?` | null | Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to "bit-icon". For external icon libraries like FontAwesome, you might set this to "fa" or leave empty. | | Prefix | `string?` | null | Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to "bit-icon--". For external icon libraries, you might set this to "fa-" or leave empty. | ### BitFileInfo Properties | Name | Type | Default Value | Description | | :--- | :--- | :------------ | :---------- | | ContentType | `string` | string.Empty | The Content-Type of the selected file. | | Name | `string` | string.Empty | The name of the selected file. | | Size | `long` | | The size of the selected file. | | FileId | `string` | string.Empty | The file ID of the selected file, this is a GUID. | | Index | `int` | | The index of the selected file. | | LastModified | `long` | | The last modified time of the file reported by the browser, in milliseconds since the Unix epoch. | | LastModifiedDate | `DateTimeOffset` | | The last modified time of the file reported by the browser, as a DateTimeOffset. | | LastChunkUploadedSize | `long` | | The size of the last uploaded chunk of the file. | | TotalUploadedSize | `long` | | The total uploaded size of the file. | | PreviewUrl | `string?` | null | An object URL of the file content that can be used as the source of an img element to preview image files. This is only populated for image files when the ShowPreview parameter of the BitFileUpload is enabled. | | Width | `int?` | null | The width of the image in pixels, only populated for decodable image files when the ReadImageDimensions parameter of the BitFileUpload is enabled. It is null for anything else. | | Height | `int?` | null | The height of the image in pixels, only populated for decodable image files when the ReadImageDimensions parameter of the BitFileUpload is enabled. It is null for anything else. | | UploadSpeed | `double?` | null | The observed speed of the upload of this file in bytes per second, measured over the request currently in flight. It is null while the file is not uploading and until the first progress report arrives. | | RemainingTime | `TimeSpan?` | null | The estimated time left before the upload of this file completes, derived from the UploadSpeed and the bytes still to be sent. It is null whenever the speed is unknown. | | IsQueued | `bool` | false | Whether the file is waiting in the upload queue for a free slot of the ConcurrentUploads limit, which is what tells a file that is about to start apart from one that was never asked to upload. | | Message | `string?` | null | The message attached to the current Status of the file: the reason it was rejected by the validations before the upload, or the body of the server response of its upload or removal. | | Status | `BitFileUploadStatus` | Pending | The status of the file in the BitFileUpload. | | HttpHeaders | `Dictionary<string, string>?` | null | Additional custom HTTP headers attached to the upload requests of this specific file (e.g., set from the OnUploading callback). | | FormFields | `Dictionary<string, string>?` | null | Additional multipart form fields sent alongside the content of this specific file in its upload requests, merged over the ones of the UploadRequestFormFields parameter of the BitFileUpload. The natural place to fill it in is the OnUploading callback. | ### BitFileUploadClassStyles Properties | Name | Type | Default Value | Description | | :--- | :--- | :------------ | :---------- | | Root | `string?` | null | Custom CSS classes/styles for the root element of the BitFileUpload. | | Dragging | `string?` | null | Custom CSS classes/styles for the root element while files are being dragged over the BitFileUpload. | | Label | `string?` | null | Custom CSS classes/styles for the browse button (label) of the BitFileUpload. | | Description | `string?` | null | Custom CSS classes/styles for the description (hint) of the BitFileUpload. | | FileList | `string?` | null | Custom CSS classes/styles for the file list container of the BitFileUpload. | | FileItem | `string?` | null | Custom CSS classes/styles for each file item of the BitFileUpload. | | Preview | `string?` | null | Custom CSS classes/styles for the image preview thumbnail of each file item of the BitFileUpload. | | FileName | `string?` | null | Custom CSS classes/styles for the file name of each file item of the BitFileUpload. | | FileSize | `string?` | null | Custom CSS classes/styles for the file size of each file item of the BitFileUpload. | | Percentage | `string?` | null | Custom CSS classes/styles for the upload percent indicator of each file item of the BitFileUpload. | | ProgressBarContainer | `string?` | null | Custom CSS classes/styles for the progress bar container of each file item of the BitFileUpload. | | ProgressBar | `string?` | null | Custom CSS classes/styles for the progress bar of each file item of the BitFileUpload. | | StatusMessage | `string?` | null | Custom CSS classes/styles for the status message of each file item of the BitFileUpload. | | UploadButton | `string?` | null | Custom CSS classes/styles for the upload button of each file item of the BitFileUpload. | | UploadIcon | `string?` | null | Custom CSS classes/styles for the upload button icon of each file item of the BitFileUpload. | | PauseButton | `string?` | null | Custom CSS classes/styles for the pause button of each file item of the BitFileUpload. | | PauseIcon | `string?` | null | Custom CSS classes/styles for the pause button icon of each file item of the BitFileUpload. | | CancelButton | `string?` | null | Custom CSS classes/styles for the cancel button of each file item of the BitFileUpload. | | CancelIcon | `string?` | null | Custom CSS classes/styles for the cancel button icon of each file item of the BitFileUpload. | | RemoveButton | `string?` | null | Custom CSS classes/styles for the remove button of each file item of the BitFileUpload. | | RemoveIcon | `string?` | null | Custom CSS classes/styles for the remove button icon of each file item of the BitFileUpload. | ## Examples \n**Basic**: ```razor ``` ```csharp private string UploadUrl = "/Upload"; ``` \n**AllowDrop & AllowPaste**: ```razor ``` ```csharp private bool allowDrop = true; private bool allowPaste = true; private string UploadUrl = "/Upload"; ``` \n**Description**: ```razor