diff --git a/packages/main/src/FileUploader.ts b/packages/main/src/FileUploader.ts
index deecacdb09bf..e730e95548ca 100644
--- a/packages/main/src/FileUploader.ts
+++ b/packages/main/src/FileUploader.ts
@@ -209,7 +209,8 @@ class FileUploader extends UI5Element implements IFormElement {
/**
* By default the component contains a single input field. With this slot you can pass any content that you wish to add. See the samples for more information.
- * Note: If no content is provided in this slot, the component will only consist of an input field and will not be interactable using the keyboard.
+ * Note: If no content is provided in this slot, the component will only consist of an input field and will not be interactable using the keyboard.
+ * Also it is not recommended to use any non-interactable components, as it may lead to poor accessibility experience.
*
* @type {HTMLElement[]}
* @name sap.ui.webc.main.FileUploader.prototype.default
diff --git a/packages/playground/_stories/main/FileUploader/FileUploader.stories.ts b/packages/playground/_stories/main/FileUploader/FileUploader.stories.ts
index c4c3105ffcff..951ad2d54433 100644
--- a/packages/playground/_stories/main/FileUploader/FileUploader.stories.ts
+++ b/packages/playground/_stories/main/FileUploader/FileUploader.stories.ts
@@ -41,8 +41,12 @@ const Template: UI5StoryArgs = (args) => html`Upload Single File`,
+ default: `Upload Single File`,
};
+Basic.decorators = [
+ (story) => html`File Uploader, which accepts only one file.
+ ${story()}`,
+];
export const Custom = Template.bind({});
Custom.storyName = "With Custom Design ";
@@ -56,11 +60,12 @@ Advanced.storyName = "Image Uploader";
Advanced.args = {
id: "fileuploader",
accept: "image/*",
- default: `Upload Images`,
+ default: `Upload Images`,
multiple: true,
};
Advanced.decorators = [
- (story) => html`${story()}
+ (story) => html`File Uploader, which accepts only images.
+ ${story()}