From f4ab50a31aedb95bb0b060be674e9164acf4c19f Mon Sep 17 00:00:00 2001
From: Rowell Heria <rowell+dev@heria.uk>
Date: Mon, 30 Sep 2024 16:06:31 +0100
Subject: [PATCH] fix(nhsuk-frontend-react): update DateInputPart type

---
 .changeset/dry-birds-visit.md                     |  5 +++++
 .../form-elements/date-input/DateInput.tsx        | 15 ++++++++++-----
 2 files changed, 15 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/dry-birds-visit.md

diff --git a/.changeset/dry-birds-visit.md b/.changeset/dry-birds-visit.md
new file mode 100644
index 00000000..ca3e0aa1
--- /dev/null
+++ b/.changeset/dry-birds-visit.md
@@ -0,0 +1,5 @@
+---
+"nhsuk-frontend-react": patch
+---
+
+fix(nhsuk-frontend-react): update DateInputPart type
diff --git a/packages/nhsuk-frontend-react/src/components/form-elements/date-input/DateInput.tsx b/packages/nhsuk-frontend-react/src/components/form-elements/date-input/DateInput.tsx
index e79384c9..fc3f6aef 100644
--- a/packages/nhsuk-frontend-react/src/components/form-elements/date-input/DateInput.tsx
+++ b/packages/nhsuk-frontend-react/src/components/form-elements/date-input/DateInput.tsx
@@ -139,13 +139,11 @@ const datePartLabels: Record<DatePart, string> = {
 export type DateInputPartProps = {
   label?: string;
   labelProps?: LabelProps;
+  itemProps?: ElementProps<'div'>;
   error?: boolean;
   part: DatePart;
-  name?: string;
   width?: InputWidth;
-  value?: string;
-  disabled?: boolean;
-} & ElementProps<'div', 'value' | 'defaultValue' | 'type' | 'ref'>;
+} & ElementProps<'input', 'defaultValue' | 'type'>;
 
 type DateInputPartFactory = Factory<{
   props: DateInputPartProps;
@@ -166,6 +164,7 @@ const BaseDatePart = factory<DateInputPartFactory>(
       value,
       disabled,
       onChange,
+      itemProps = {},
       ...props
     },
     ref,
@@ -189,6 +188,8 @@ const BaseDatePart = factory<DateInputPartFactory>(
     }, []);
 
     const { className: labelClassName, ...restLabelProps } = labelProps;
+    const { className: wrapperClassName, ...restWrapperProps } = itemProps;
+
     const _label = label || datePartLabels[part];
 
     const inputId = id || `${ctxId}-${part}`;
@@ -206,7 +207,10 @@ const BaseDatePart = factory<DateInputPartFactory>(
       error || (errorMap && errorMap[part]) || (ctxError && !errorMap);
 
     return (
-      <div className={clsx('nhsuk-date-input__item')} {...props}>
+      <div
+        className={clsx('nhsuk-date-input__item', wrapperClassName)}
+        {...restWrapperProps}
+      >
         <Input
           labelProps={{
             className: clsx('nhsuk-date-input__label', labelClassName),
@@ -228,6 +232,7 @@ const BaseDatePart = factory<DateInputPartFactory>(
           type="text"
           inputMode="numeric"
           pattern="[0-9]*"
+          {...props}
           onChange={handleChange}
           disabled={disabled || ctxDisabled}
           ref={ref}