@helsenorge/datepicker 12.4.0 → 12.5.0

package/CHANGELOG.md

@@ -1,3 +1,55 @@
+## [12.5.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv12.4.0&targetVersion=GTv12.5.0) (2025-10-08)
+
+### Features
+
+- **datepicker:** default språkstøtte fra sot
+  ([1f2b2ae](https://github.com/helsenorge/designsystem/commit/1f2b2ae2ddd0ab527d976ec2d3dc6ec9293f58a0))
+- **drawer:** default språkstøtte fra sot
+  ([56517c5](https://github.com/helsenorge/designsystem/commit/56517c50ec9f4d61ecbbd3ce2ebbe509d9af898b))
+- **formgroup:** lagt til legendclassname prop
+  ([9dbd90c](https://github.com/helsenorge/designsystem/commit/9dbd90c7efbb838fb5204870bcfd90a089d03f4c)), closes
+  [#360836](https://github.com/helsenorge/designsystem/issues/360836)
+- **helptriggericon:** lagt til classname prop
+  ([b9d207e](https://github.com/helsenorge/designsystem/commit/b9d207ec0871ce79259562042f4b321b21b94fd8)), closes
+  [#360496](https://github.com/helsenorge/designsystem/issues/360496)
+- **icon:** nytt ikon feedback ([0e3f89c](https://github.com/helsenorge/designsystem/commit/0e3f89c04c897c8667593396cecaceb8d50fd879)),
+  closes [#360055](https://github.com/helsenorge/designsystem/issues/360055)
+- **listeditmode:** funksjonalitet for å redigere liste
+  ([d87e8c5](https://github.com/helsenorge/designsystem/commit/d87e8c59d44ce2278b403df3c3858029db280ad0)), closes
+  [#359697](https://github.com/helsenorge/designsystem/issues/359697)
+- **tabs:** default språkstøtte fra sot
+  ([733fd7e](https://github.com/helsenorge/designsystem/commit/733fd7e559e57cb3dfaf5e2efd52ac8754db8f6d))
+
+### Bug Fixes
+
+- **drawer:** legg breakpoint check på outer level for å vise animasjon riktig igjen
+  ([04f604a](https://github.com/helsenorge/designsystem/commit/04f604aaba66738ac710c28cb5514ec7b0d2967a)), closes
+  [#360641](https://github.com/helsenorge/designsystem/issues/360641)
+- **favoritebutton:** kun vis fokusstrek på focus-visible"
+  ([2dc6b2f](https://github.com/helsenorge/designsystem/commit/2dc6b2f954cdb7a5b5b3e7326a8c0d42723ef972)), closes
+  [#357829](https://github.com/helsenorge/designsystem/issues/357829)
+- **helptriggericon:** fiks så komponenten fungerer i liste igjen
+  ([45f801e](https://github.com/helsenorge/designsystem/commit/45f801edb77306cd7cba614396a7abc1089a610b)), closes
+  [#353532](https://github.com/helsenorge/designsystem/issues/353532) [#360885](https://github.com/helsenorge/designsystem/issues/360885)
+- **helptriggericon:** juster ikon ift tekst uten å endre linjehøyde
+  ([687a0fa](https://github.com/helsenorge/designsystem/commit/687a0fa13798a757408d417bde0d9bdb57cb59e1)), closes
+  [#360885](https://github.com/helsenorge/designsystem/issues/360885)
+- **list:** vertikalt align knapper riktig i liste
+  ([2926423](https://github.com/helsenorge/designsystem/commit/2926423198f6459228ea28b5c68945407756c6e3)), closes
+  [#353532](https://github.com/helsenorge/designsystem/issues/353532)
+- **panel:** juster paddings for å ta hensyn til statuslinje
+  ([1e8f5ff](https://github.com/helsenorge/designsystem/commit/1e8f5ff07c8e796af7269b3f4b92269a50d4fdcb)), closes
+  [#360101](https://github.com/helsenorge/designsystem/issues/360101)
+- **popmenu:** ikon sentreres riktig
+  ([3a8f5ac](https://github.com/helsenorge/designsystem/commit/3a8f5ac3dd9dfcff4fc75f101a4f4a6dbfbd1c88)), closes
+  [#361064](https://github.com/helsenorge/designsystem/issues/361064)
+- **radiobutton:** disabled har samme radius som andre states
+  ([27548a7](https://github.com/helsenorge/designsystem/commit/27548a74a68ac6c2d4c5783b84da056971995a4d)), closes
+  [#350142](https://github.com/helsenorge/designsystem/issues/350142)
+- **radiobutton:** hele wrapperen skal ikke se klikkbar ut
+  ([2c396cd](https://github.com/helsenorge/designsystem/commit/2c396cd1a5c79869ef9d72941c9c93efba47dc47)), closes
+  [#350142](https://github.com/helsenorge/designsystem/issues/350142)
+
 ## [12.4.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv12.3.0&targetVersion=GTv12.4.0) (2025-09-23)
 
 ### Features

package/components/DatePicker/DatePicker.d.ts

@@ -4,13 +4,14 @@ import { DayPickerProps } from 'react-day-picker';
 import { ErrorWrapperClassNameProps } from '@helsenorge/designsystem-react/components/ErrorWrapper';
 import { PopOverVariant } from '@helsenorge/designsystem-react/components/PopOver';
 import { DatePickerAriaLabels } from './DatePickerPopup';
+import { HNDesignsystemDatePicker } from '../../resources/Resources';
 export type DateFormat = 'dd.MM.yyyy';
 export interface DatePickerProps extends ErrorWrapperClassNameProps, Pick<React.InputHTMLAttributes<HTMLInputElement>, 'name' | 'aria-describedby' | 'onBlur' | 'autoComplete'>, Pick<DayPickerProps, 'dir' | 'initialFocus'> {
     /** Setter labels for popup på desktop visning */
     ariaLabels?: DatePickerAriaLabels;
     /** Adds custom classes to the element. */
     className?: string;
-    /** Sets aria-label on the button that opens the datepicker dialogue */
+    /** @deprecated Sets aria-label on the button that opens the datepicker dialogue */
     dateButtonAriaLabel?: string;
     /** Sets the format of the date - only applies for desktop use. Native mobile date fields base their formats on the device */
     dateFormat?: DateFormat;
@@ -46,6 +47,8 @@ export interface DatePickerProps extends ErrorWrapperClassNameProps, Pick<React.
     onChange?: (event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>, date?: Date | string) => void;
     /** Only use this to trigger validation. Callback triggered by change in chosen date via the datepicker popup */
     onDatePopupClosed?: (date: Date | string | undefined) => void;
+    /** Resources for component */
+    resources?: Partial<HNDesignsystemDatePicker>;
     /** Sets the data-testid attribute. */
     testId?: string;
     /** Determines the placement of the DatePicker popup. Default: automatic positioning. */

package/components/DatePicker/index.js

@@ -7,10 +7,11 @@ import Icon from "@helsenorge/designsystem-react/components/Icon";
 import Calendar from "@helsenorge/designsystem-react/components/Icons/Calendar";
 import Input from "@helsenorge/designsystem-react/components/Input";
 import { PopOverVariant } from "@helsenorge/designsystem-react/components/PopOver";
-import { ZIndex, KeyboardEventKey } from "@helsenorge/designsystem-react/constants";
+import { ZIndex, LanguageLocales as LanguageLocales$1, KeyboardEventKey } from "@helsenorge/designsystem-react/constants";
 import { useKeyboardEvent } from "@helsenorge/designsystem-react/hooks/useKeyboardEvent";
 import { useOutsideEvent } from "@helsenorge/designsystem-react/hooks/useOutsideEvent";
 import { usePseudoClasses } from "@helsenorge/designsystem-react/hooks/usePseudoClasses";
+import { useLanguage } from "@helsenorge/designsystem-react/utils/language";
 import { isMobileUA } from "@helsenorge/designsystem-react/utils/mobile";
 import { isMutableRefObject, mergeRefs } from "@helsenorge/designsystem-react/utils/refs";
 import classNames from "classnames";
@@ -22,6 +23,7 @@ import { useSize } from "@helsenorge/designsystem-react/hooks/useSize";
 import { getSpacer } from "@helsenorge/designsystem-react/theme/currys/spacing";
 import styles from "./styles.module.scss";
 import { enUS } from "date-fns/locale/en-US";
+import { LanguageLocales } from "@helsenorge/designsystem-react";
 import ErrorWrapper from "@helsenorge/designsystem-react/components/ErrorWrapper";
 import { useUuid } from "@helsenorge/designsystem-react/hooks/useUuid";
 import { isComponent } from "@helsenorge/designsystem-react/utils/component";
@@ -641,30 +643,30 @@ function MonthsDropdown(props) {
   return React.createElement(components2.Dropdown, { ...props });
 }
 function Nav(props) {
-  const { onPreviousClick, onNextClick, previousMonth, nextMonth, ...navProps } = props;
+  const { onPreviousClick, onNextClick, previousMonth: previousMonth2, nextMonth: nextMonth2, ...navProps } = props;
   const { components: components2, classNames: classNames2, labels: { labelPrevious: labelPrevious2, labelNext: labelNext2 } } = useDayPicker();
   const handleNextClick = useCallback((e) => {
-    if (nextMonth) {
+    if (nextMonth2) {
       onNextClick == null ? void 0 : onNextClick(e);
     }
-  }, [nextMonth, onNextClick]);
+  }, [nextMonth2, onNextClick]);
   const handlePreviousClick = useCallback((e) => {
-    if (previousMonth) {
+    if (previousMonth2) {
       onPreviousClick == null ? void 0 : onPreviousClick(e);
     }
-  }, [previousMonth, onPreviousClick]);
+  }, [previousMonth2, onPreviousClick]);
   return React.createElement(
     "nav",
     { ...navProps },
     React.createElement(
       components2.PreviousMonthButton,
-      { type: "button", className: classNames2[UI.PreviousMonthButton], tabIndex: previousMonth ? void 0 : -1, "aria-disabled": previousMonth ? void 0 : true, "aria-label": labelPrevious2(previousMonth), onClick: handlePreviousClick },
-      React.createElement(components2.Chevron, { disabled: previousMonth ? void 0 : true, className: classNames2[UI.Chevron], orientation: "left" })
+      { type: "button", className: classNames2[UI.PreviousMonthButton], tabIndex: previousMonth2 ? void 0 : -1, "aria-disabled": previousMonth2 ? void 0 : true, "aria-label": labelPrevious2(previousMonth2), onClick: handlePreviousClick },
+      React.createElement(components2.Chevron, { disabled: previousMonth2 ? void 0 : true, className: classNames2[UI.Chevron], orientation: "left" })
     ),
     React.createElement(
       components2.NextMonthButton,
-      { type: "button", className: classNames2[UI.NextMonthButton], tabIndex: nextMonth ? void 0 : -1, "aria-disabled": nextMonth ? void 0 : true, "aria-label": labelNext2(nextMonth), onClick: handleNextClick },
-      React.createElement(components2.Chevron, { disabled: nextMonth ? void 0 : true, orientation: "right", className: classNames2[UI.Chevron] })
+      { type: "button", className: classNames2[UI.NextMonthButton], tabIndex: nextMonth2 ? void 0 : -1, "aria-disabled": nextMonth2 ? void 0 : true, "aria-label": labelNext2(nextMonth2), onClick: handleNextClick },
+      React.createElement(components2.Chevron, { disabled: nextMonth2 ? void 0 : true, orientation: "right", className: classNames2[UI.Chevron] })
     )
   );
 }
@@ -1434,8 +1436,8 @@ function useCalendar(props, dateLib) {
   const months = getMonths(displayMonths, dates, props, dateLib);
   const weeks = getWeeks(months);
   const days = getDays(months);
-  const previousMonth = getPreviousMonth(firstMonth, navStart, props, dateLib);
-  const nextMonth = getNextMonth(firstMonth, navEnd, props, dateLib);
+  const previousMonth2 = getPreviousMonth(firstMonth, navStart, props, dateLib);
+  const nextMonth2 = getNextMonth(firstMonth, navEnd, props, dateLib);
   const { disableNavigation, onMonthChange } = props;
   const isDayInCalendar = (day) => weeks.some((week) => week.days.some((d) => d.isEqualTo(day)));
   const goToMonth = (date) => {
@@ -1464,8 +1466,8 @@ function useCalendar(props, dateLib) {
     days,
     navStart,
     navEnd,
-    previousMonth,
-    nextMonth,
+    previousMonth: previousMonth2,
+    nextMonth: nextMonth2,
     goToMonth,
     goToDay
   };
@@ -1867,7 +1869,7 @@ function DayPicker(initialProps) {
   const { captionLayout, mode, navLayout, numberOfMonths = 1, onDayBlur, onDayClick, onDayFocus, onDayKeyDown, onDayMouseEnter, onDayMouseLeave, onNextClick, onPrevClick, showWeekNumber, styles: styles2 } = props;
   const { formatCaption: formatCaption2, formatDay: formatDay2, formatMonthDropdown: formatMonthDropdown2, formatWeekNumber: formatWeekNumber2, formatWeekNumberHeader: formatWeekNumberHeader2, formatWeekdayName: formatWeekdayName2, formatYearDropdown: formatYearDropdown2 } = formatters;
   const calendar = useCalendar(props, dateLib);
-  const { days, months, navStart, navEnd, previousMonth, nextMonth, goToMonth } = calendar;
+  const { days, months, navStart, navEnd, previousMonth: previousMonth2, nextMonth: nextMonth2, goToMonth } = calendar;
   const getModifiers = createGetModifiers(days, props, navStart, navEnd, dateLib);
   const { isSelected, select, selected: selectedValue } = useSelection(props, dateLib) ?? {};
   const { blur, focused, isFocusTarget, moveFocus, setFocused } = useFocus(props, calendar, getModifiers, isSelected ?? (() => false), dateLib);
@@ -1875,17 +1877,17 @@ function DayPicker(initialProps) {
   const weekdays = useMemo(() => getWeekdays(dateLib, props.ISOWeek), [dateLib, props.ISOWeek]);
   const isInteractive = mode !== void 0 || onDayClick !== void 0;
   const handlePreviousClick = useCallback(() => {
-    if (!previousMonth)
+    if (!previousMonth2)
       return;
-    goToMonth(previousMonth);
-    onPrevClick == null ? void 0 : onPrevClick(previousMonth);
-  }, [previousMonth, goToMonth, onPrevClick]);
+    goToMonth(previousMonth2);
+    onPrevClick == null ? void 0 : onPrevClick(previousMonth2);
+  }, [previousMonth2, goToMonth, onPrevClick]);
   const handleNextClick = useCallback(() => {
-    if (!nextMonth)
+    if (!nextMonth2)
       return;
-    goToMonth(nextMonth);
-    onNextClick == null ? void 0 : onNextClick(nextMonth);
-  }, [goToMonth, nextMonth, onNextClick]);
+    goToMonth(nextMonth2);
+    onNextClick == null ? void 0 : onNextClick(nextMonth2);
+  }, [goToMonth, nextMonth2, onNextClick]);
   const handleDayClick = useCallback((day, m) => (e) => {
     e.preventDefault();
     e.stopPropagation();
@@ -1960,8 +1962,8 @@ function DayPicker(initialProps) {
     select,
     isSelected,
     months,
-    nextMonth,
-    previousMonth,
+    nextMonth: nextMonth2,
+    previousMonth: previousMonth2,
     goToMonth,
     getModifiers,
     components: components2,
@@ -1979,7 +1981,7 @@ function DayPicker(initialProps) {
       React.createElement(
         components2.Months,
         { className: classNames2[UI.Months], style: styles2 == null ? void 0 : styles2[UI.Months] },
-        !props.hideNavigation && !navLayout && React.createElement(components2.Nav, { "data-animated-nav": props.animate ? "true" : void 0, className: classNames2[UI.Nav], style: styles2 == null ? void 0 : styles2[UI.Nav], "aria-label": labelNav2(), onPreviousClick: handlePreviousClick, onNextClick: handleNextClick, previousMonth, nextMonth }),
+        !props.hideNavigation && !navLayout && React.createElement(components2.Nav, { "data-animated-nav": props.animate ? "true" : void 0, className: classNames2[UI.Nav], style: styles2 == null ? void 0 : styles2[UI.Nav], "aria-label": labelNav2(), onPreviousClick: handlePreviousClick, onNextClick: handleNextClick, previousMonth: previousMonth2, nextMonth: nextMonth2 }),
         months.map((calendarMonth, displayIndex) => {
           return React.createElement(
             components2.Month,
@@ -1994,8 +1996,8 @@ function DayPicker(initialProps) {
             },
             navLayout === "around" && !props.hideNavigation && displayIndex === 0 && React.createElement(
               components2.PreviousMonthButton,
-              { type: "button", className: classNames2[UI.PreviousMonthButton], tabIndex: previousMonth ? void 0 : -1, "aria-disabled": previousMonth ? void 0 : true, "aria-label": labelPrevious2(previousMonth), onClick: handlePreviousClick, "data-animated-button": props.animate ? "true" : void 0 },
-              React.createElement(components2.Chevron, { disabled: previousMonth ? void 0 : true, className: classNames2[UI.Chevron], orientation: props.dir === "rtl" ? "right" : "left" })
+              { type: "button", className: classNames2[UI.PreviousMonthButton], tabIndex: previousMonth2 ? void 0 : -1, "aria-disabled": previousMonth2 ? void 0 : true, "aria-label": labelPrevious2(previousMonth2), onClick: handlePreviousClick, "data-animated-button": props.animate ? "true" : void 0 },
+              React.createElement(components2.Chevron, { disabled: previousMonth2 ? void 0 : true, className: classNames2[UI.Chevron], orientation: props.dir === "rtl" ? "right" : "left" })
             ),
             React.createElement(components2.MonthCaption, { "data-animated-caption": props.animate ? "true" : void 0, className: classNames2[UI.MonthCaption], style: styles2 == null ? void 0 : styles2[UI.MonthCaption], calendarMonth, displayIndex }, (captionLayout == null ? void 0 : captionLayout.startsWith("dropdown")) ? React.createElement(
               components2.DropdownNav,
@@ -2020,10 +2022,10 @@ function DayPicker(initialProps) {
             )),
             navLayout === "around" && !props.hideNavigation && displayIndex === numberOfMonths - 1 && React.createElement(
               components2.NextMonthButton,
-              { type: "button", className: classNames2[UI.NextMonthButton], tabIndex: nextMonth ? void 0 : -1, "aria-disabled": nextMonth ? void 0 : true, "aria-label": labelNext2(nextMonth), onClick: handleNextClick, "data-animated-button": props.animate ? "true" : void 0 },
-              React.createElement(components2.Chevron, { disabled: nextMonth ? void 0 : true, className: classNames2[UI.Chevron], orientation: props.dir === "rtl" ? "left" : "right" })
+              { type: "button", className: classNames2[UI.NextMonthButton], tabIndex: nextMonth2 ? void 0 : -1, "aria-disabled": nextMonth2 ? void 0 : true, "aria-label": labelNext2(nextMonth2), onClick: handleNextClick, "data-animated-button": props.animate ? "true" : void 0 },
+              React.createElement(components2.Chevron, { disabled: nextMonth2 ? void 0 : true, className: classNames2[UI.Chevron], orientation: props.dir === "rtl" ? "left" : "right" })
             ),
-            displayIndex === numberOfMonths - 1 && navLayout === "after" && !props.hideNavigation && React.createElement(components2.Nav, { "data-animated-nav": props.animate ? "true" : void 0, className: classNames2[UI.Nav], style: styles2 == null ? void 0 : styles2[UI.Nav], "aria-label": labelNav2(), onPreviousClick: handlePreviousClick, onNextClick: handleNextClick, previousMonth, nextMonth }),
+            displayIndex === numberOfMonths - 1 && navLayout === "after" && !props.hideNavigation && React.createElement(components2.Nav, { "data-animated-nav": props.animate ? "true" : void 0, className: classNames2[UI.Nav], style: styles2 == null ? void 0 : styles2[UI.Nav], "aria-label": labelNav2(), onPreviousClick: handlePreviousClick, onNextClick: handleNextClick, previousMonth: previousMonth2, nextMonth: nextMonth2 }),
             React.createElement(
               components2.MonthGrid,
               { role: "grid", "aria-multiselectable": mode === "multiple" || mode === "range", "aria-label": labelGrid2(calendarMonth.date, dateLib.options, dateLib) || void 0, className: classNames2[UI.MonthGrid], style: styles2 == null ? void 0 : styles2[UI.MonthGrid] },
@@ -2282,10 +2284,55 @@ const DatePickerPopup = (props) => {
     /* @__PURE__ */ jsx("div", { ref: arrowRef, className: popupArrowClasses, style: { ...arrowStyle, zIndex } })
   ] });
 };
+const dateButtonAriaLabel$1 = "Open datepicker";
+const dayButtonBase$1 = "{date}";
+const dayButtonToday$1 = "Today, {date}";
+const dayButtonSelected$1 = "{date}, selected";
+const nextMonth$1 = "Next month";
+const previousMonth$1 = "Previous month";
+const monthDropdown$1 = "Select month";
+const yearDropdown$1 = "Select year";
+const enGB = {
+  dateButtonAriaLabel: dateButtonAriaLabel$1,
+  dayButtonBase: dayButtonBase$1,
+  dayButtonToday: dayButtonToday$1,
+  dayButtonSelected: dayButtonSelected$1,
+  nextMonth: nextMonth$1,
+  previousMonth: previousMonth$1,
+  monthDropdown: monthDropdown$1,
+  yearDropdown: yearDropdown$1
+};
+const dateButtonAriaLabel = "Åpne datovelger";
+const dayButtonBase = "{date}";
+const dayButtonToday = "I dag, {date}";
+const dayButtonSelected = "{date} valgt";
+const nextMonth = "Neste måned";
+const previousMonth = "Forrige måned";
+const monthDropdown = "Velg måned";
+const yearDropdown = "Velg år";
+const nbNO = {
+  dateButtonAriaLabel,
+  dayButtonBase,
+  dayButtonToday,
+  dayButtonSelected,
+  nextMonth,
+  previousMonth,
+  monthDropdown,
+  yearDropdown
+};
+const getResources = (language) => {
+  switch (language) {
+    case LanguageLocales.ENGLISH:
+      return enGB;
+    case LanguageLocales.NORWEGIAN:
+    default:
+      return nbNO;
+  }
+};
 const DatePicker = React.forwardRef((props, ref) => {
   const {
     className,
-    dateButtonAriaLabel,
+    dateButtonAriaLabel: dateButtonAriaLabel2,
     dateFormat = "dd.MM.yyyy",
     dateValue,
     defaultMonth,
@@ -2308,6 +2355,7 @@ const DatePicker = React.forwardRef((props, ref) => {
     onChange,
     onDatePopupClosed,
     testId,
+    resources,
     autoComplete = "off",
     variant = PopOverVariant.positionautomatic,
     zIndex = ZIndex.PopOver,
@@ -2318,6 +2366,22 @@ const DatePicker = React.forwardRef((props, ref) => {
   const [month, setMonth2] = useState(defaultMonth);
   const [datePickerOpen, setDatePickerOpen] = useState(false);
   const [returnInputFocus, setReturnInputFocus] = useState(false);
+  const { language } = useLanguage(LanguageLocales$1.NORWEGIAN);
+  const defaultResources = getResources(language);
+  const mergedResources = {
+    ...defaultResources,
+    ...resources,
+    dateButtonAriaLabel: dateButtonAriaLabel2 || (resources == null ? void 0 : resources.dateButtonAriaLabel) || defaultResources.dateButtonAriaLabel
+  };
+  const popupAriaLabels = {
+    dayButtonBase: (ariaLabels == null ? void 0 : ariaLabels.dayButtonBase) || mergedResources.dayButtonBase,
+    dayButtonToday: (ariaLabels == null ? void 0 : ariaLabels.dayButtonToday) || mergedResources.dayButtonToday,
+    dayButtonSelected: (ariaLabels == null ? void 0 : ariaLabels.dayButtonSelected) || mergedResources.dayButtonSelected,
+    nextMonth: (ariaLabels == null ? void 0 : ariaLabels.nextMonth) || mergedResources.nextMonth,
+    previousMonth: (ariaLabels == null ? void 0 : ariaLabels.previousMonth) || mergedResources.previousMonth,
+    monthDropdown: (ariaLabels == null ? void 0 : ariaLabels.monthDropdown) || mergedResources.monthDropdown,
+    yearDropdown: (ariaLabels == null ? void 0 : ariaLabels.yearDropdown) || mergedResources.yearDropdown
+  };
   const weekendMatcher = {
     dayOfWeek: [0, 6]
   };
@@ -2493,7 +2557,7 @@ const DatePicker = React.forwardRef((props, ref) => {
           Button$1,
           {
             disabled,
-            ariaLabel: dateButtonAriaLabel ?? "Velg dato",
+            ariaLabel: dateButtonAriaLabel2 ?? "Velg dato",
             onClick: handleButtonClick,
             tabIndex: datePickerOpen ? -1 : 0,
             variant: "borderless",
@@ -2522,7 +2586,7 @@ const DatePicker = React.forwardRef((props, ref) => {
         onMonthChange: setMonth2,
         variant,
         zIndex,
-        ariaLabels
+        ariaLabels: popupAriaLabels
       }
     )
   ] });