diff --git a/apps/website/screens/components/switch/code/SwitchCodePage.tsx b/apps/website/screens/components/switch/code/SwitchCodePage.tsx
index 170c598243..44040bdd3b 100644
--- a/apps/website/screens/components/switch/code/SwitchCodePage.tsx
+++ b/apps/website/screens/components/switch/code/SwitchCodePage.tsx
@@ -152,6 +152,14 @@ const sections = [
Reference to the component. |
- |
+
+ | ariaLabel |
+
+ {"string"}
+ |
+ Specifies a string to be used as the name for the switch element when no `label` is provided. |
+ 'Switch' |
+
),
diff --git a/packages/lib/src/switch/Switch.test.tsx b/packages/lib/src/switch/Switch.test.tsx
index d86b25340f..16079f5f24 100644
--- a/packages/lib/src/switch/Switch.test.tsx
+++ b/packages/lib/src/switch/Switch.test.tsx
@@ -101,6 +101,13 @@ describe("Switch component tests", () => {
const label = getByText("Default label");
expect(switchEl.getAttribute("aria-labelledby")).toBe(label.id);
expect(switchEl.getAttribute("aria-checked")).toBe("false");
+ expect(switchEl.getAttribute("aria-label")).toBeNull();
+ });
+
+ test("Renders with correct aria-label", () => {
+ const { getByRole } = render();
+ const switchEl = getByRole("switch");
+ expect(switchEl.getAttribute("aria-label")).toBe("Example aria label");
});
test("Renders disabled switch correctly", () => {
diff --git a/packages/lib/src/switch/Switch.tsx b/packages/lib/src/switch/Switch.tsx
index 544e78f623..67464536c4 100644
--- a/packages/lib/src/switch/Switch.tsx
+++ b/packages/lib/src/switch/Switch.tsx
@@ -20,6 +20,7 @@ const DxcSwitch = forwardRef(
margin,
size = "fitContent",
tabIndex = 0,
+ ariaLabel = "Switch",
},
ref
): JSX.Element => {
@@ -83,6 +84,7 @@ const DxcSwitch = forwardRef(
aria-disabled={disabled}
disabled={disabled}
aria-labelledby={labelId}
+ aria-label={label ? undefined : ariaLabel}
tabIndex={!disabled ? tabIndex : -1}
ref={refTrack}
/>
diff --git a/packages/lib/src/switch/types.ts b/packages/lib/src/switch/types.ts
index 0c7c7656f9..1253a0f988 100644
--- a/packages/lib/src/switch/types.ts
+++ b/packages/lib/src/switch/types.ts
@@ -53,6 +53,10 @@ type Props = {
* Value of the tabindex.
*/
tabIndex?: number;
+ /**
+ * Specifies a string to be used as the name for the switch element when no `label` is provided.
+ */
+ ariaLabel?: string;
};
/**