fix(ffe-datepicker-react): Get input to work with user adding 0

SpareBank1 · Mar 11, 2025 · 2b284e0 · 2b284e0
1 parent 364b068
commit 2b284e0
Showing 1 changed file with 26 additions and 22 deletions.
diff --git a/packages/ffe-datepicker-react/src/datepicker/DatepickerComp.tsx b/packages/ffe-datepicker-react/src/datepicker/DatepickerComp.tsx
@@ -296,17 +296,19 @@ export const DatepickerComp: React.FC<DatepickerCompProps> = ({
                     max={31}
                     onPaste={handlePaste}
                     onSpinButtonChange={(newValue, allowFocusNext = true) => {
-                        onChange(
-                            `${padZero(toNumber(newValue))}.${month}.${year}`,
-                        );
-
-                        return allowFocusNext
-                            ? setDay(newValue, () =>
-                                  monthRef.current?.focus({
-                                      preventScroll: true,
-                                  }),
-                              )
-                            : setDay(newValue);
+                        if (!(newValue.length === 1 && newValue[0] === 0)) {
+                            onChange(
+                                `${padZero(toNumber(newValue))}.${month}.${year}`,
+                            );
+
+                            return allowFocusNext
+                                ? setDay(newValue, () =>
+                                      monthRef.current?.focus({
+                                          preventScroll: true,
+                                      }),
+                                  )
+                                : setDay(newValue);
+                        }
                     }}
                     nextSpinButton={monthRef}
                     maxLength={2}
@@ -327,16 +329,18 @@ export const DatepickerComp: React.FC<DatepickerCompProps> = ({
                     max={12}
                     onPaste={handlePaste}
                     onSpinButtonChange={(newValue, allowFocusNext = true) => {
-                        onChange(
-                            `${day}.${padZero(toNumber(newValue))}.${year}`,
-                        );
-                        return allowFocusNext
-                            ? setMonth(newValue, () =>
-                                  yearRef.current?.focus({
-                                      preventScroll: true,
-                                  }),
-                              )
-                            : setMonth(newValue);
+                        if (!(newValue.length === 1 && newValue[0] === 0)) {
+                            onChange(
+                                `${day}.${padZero(toNumber(newValue))}.${year}`,
+                            );
+                            return allowFocusNext
+                                ? setMonth(newValue, () =>
+                                      yearRef.current?.focus({
+                                          preventScroll: true,
+                                      }),
+                                  )
+                                : setMonth(newValue);
+                        }
                     }}
                     nextSpinButton={yearRef}
                     prevSpinButton={dayRef}
@@ -365,7 +369,7 @@ export const DatepickerComp: React.FC<DatepickerCompProps> = ({
                     max={9999}
                     onPaste={handlePaste}
                     onSpinButtonChange={newValue => {
-                        onChange(`${day}.${month}.${newValue}`);
+                        onChange(`${day}.${month}.${toNumber(newValue)}`);
                         setYear(newValue);
                     }}
                     prevSpinButton={monthRef}