From b0dc56fc33e37cc5f43e1d261f9fabafed285093 Mon Sep 17 00:00:00 2001
From: Sonali Singh <sonali.singh@live.co.uk>
Date: Wed, 11 Dec 2024 15:26:50 +0000
Subject: [PATCH] chore: add id as prop to jaunty label for accessibility
 purposes

---
 .../molecules/OakJauntyAngleLabel/OakJauntyAngleLabel.tsx     | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/molecules/OakJauntyAngleLabel/OakJauntyAngleLabel.tsx b/src/components/molecules/OakJauntyAngleLabel/OakJauntyAngleLabel.tsx
index 13899b45..e42d6b5d 100644
--- a/src/components/molecules/OakJauntyAngleLabel/OakJauntyAngleLabel.tsx
+++ b/src/components/molecules/OakJauntyAngleLabel/OakJauntyAngleLabel.tsx
@@ -4,11 +4,13 @@ import { OakBox, OakBoxProps } from "@/components/atoms";
 
 export type OakJauntyAngleLabelProps = {
   label: string;
+  id?: string;
 } & Omit<OakBoxProps, "onClick" | "label">;
 export const OakJauntyAngleLabel = (props: OakJauntyAngleLabelProps) => {
-  const { label, ...oakBoxProps } = props;
+  const { label, id, ...oakBoxProps } = props;
   return (
     <OakBox
+      id={id}
       $borderRadius={"border-radius-m"}
       $ph={"inner-padding-xs"}
       $pv={"inner-padding-ssx"}