@skatteetaten/ds-overlays 2.7.1 → 2.8.1

package/Modal/Modal.css

@@ -1 +1 @@
-html:has(dialog[open]){overflow:hidden}.Modal-module_modal__Kyr-Y{--ds-modal-footer-height: 0px;position:fixed;min-width:18rem;max-width:calc(100vw - 2*var(--spacing-m));max-height:calc(100dvh - 2*var(--spacing-m));box-sizing:border-box;padding:0;padding-bottom:calc(env(safe-area-inset-bottom, 0px) + var(--ds-modal-footer-height));border:.25rem solid var(--theme-primary);background-color:var(--palette-graphite-0);box-shadow:0 0 8px 2px rgba(0,0,0,.16),0 2px 4px -4px rgba(0,0,0,.16);font-size:var(--font-size-m);font-weight:var(--font-weight-regular);line-height:var(--semantic-line-height-article);overflow-y:auto}@media(min-width: 640px){.Modal-module_modal__Kyr-Y{max-width:var(--semantic-responsive-article)}}@supports not (height: 100dvh){.Modal-module_modal__Kyr-Y{max-height:calc(100vh - 2*var(--spacing-m))}}.Modal-module_modal__Kyr-Y::backdrop{background:hsla(0,0%,100%,.8)}.Modal-module_modalContainer__muf75{outline:none}.Modal-module_modalHeading__uwT1R{padding-right:var(--spacing-xl)}.Modal-module_modalHeadingNoPadding__t2hkH{padding-right:0}.Modal-module_modalIllustration__jbA32{width:100%;margin-bottom:var(--spacing-m)}.Modal-module_modal__Kyr-Y[data-variant=plain]{border:none}.Modal-module_modalContent__bSZMh[data-padding=none]{padding:0}.Modal-module_modalContent__bSZMh[data-padding=s]{padding:calc(var(--spacing-s) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=m]{padding:calc(var(--spacing-m) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=l]{padding:calc(var(--spacing-l) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=mega]{padding:calc(var(--spacing-mega) - .25rem)}.Modal-module_modalContent__bSZMh[data-no-padding-top=true]{padding-top:0}.Modal-module_closeButton__jgbDq{position:absolute;top:0;right:0;margin:var(--spacing-s)}.Modal-module_closeButton__jgbDq:not(:active)>svg{fill:var(--palette-graphite-100)}.Modal-module_srOnly__W8dQv{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0, 0, 0, 0);white-space:nowrap}
+html:has(dialog[open]){overflow:hidden}.Modal-module_modal__Kyr-Y{--ds-modal-footer-height: 0px;position:fixed;min-width:18rem;max-width:calc(100vw - 2*var(--spacing-m));max-height:calc(100dvh - 2*var(--spacing-m));box-sizing:border-box;padding:0;padding-bottom:calc(env(safe-area-inset-bottom, 0px) + var(--ds-modal-footer-height));border:.25rem solid var(--theme-primary);background-color:var(--palette-graphite-0);box-shadow:0 0 8px 2px rgba(0,0,0,.16),0 2px 4px -4px rgba(0,0,0,.16);font-size:var(--font-size-m);font-weight:var(--font-weight-regular);line-height:var(--semantic-line-height-article);overflow-y:auto}@media(min-width: 640px){.Modal-module_modal__Kyr-Y{max-width:var(--semantic-responsive-article)}}@supports not (height: 100dvh){.Modal-module_modal__Kyr-Y{max-height:calc(100vh - 2*var(--spacing-m))}}.Modal-module_modal__Kyr-Y::backdrop{background:hsla(0,0%,100%,.8)}.Modal-module_modalContainer__muf75{outline:none}.Modal-module_modalHeading__uwT1R{padding-right:var(--spacing-xl)}.Modal-module_modalHeadingNoPadding__t2hkH{padding-right:0}.Modal-module_modalIllustration__jbA32{width:100%;margin-bottom:var(--spacing-m)}.Modal-module_modal__Kyr-Y[data-variant=plain]{border:none}.Modal-module_modalContent__bSZMh[data-padding=none]{padding:0}.Modal-module_modalContent__bSZMh[data-padding=s]{padding:calc(var(--spacing-s) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=m]{padding:calc(var(--spacing-m) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=l]{padding:calc(var(--spacing-l) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=mega]{padding:calc(var(--spacing-mega) - .25rem)}.Modal-module_modalContent__bSZMh[data-no-padding-top=true]{padding-top:0}.Modal-module_closeButton__jgbDq{position:absolute;top:0;right:0;margin:var(--spacing-s);--icon-button-icon-color: var(--palette-graphite-100)}.Modal-module_closeButton__jgbDq:active{--icon-button-icon-color: var(--palette-graphite-0)}.Modal-module_srOnly__W8dQv{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0, 0, 0, 0);white-space:nowrap}

package/Modal/Modal.module.css

@@ -1 +1 @@
-html:has(dialog[open]){overflow:hidden}.Modal-module_modal__Kyr-Y{--ds-modal-footer-height: 0px;position:fixed;min-width:18rem;max-width:calc(100vw - 2*var(--spacing-m));max-height:calc(100dvh - 2*var(--spacing-m));box-sizing:border-box;padding:0;padding-bottom:calc(env(safe-area-inset-bottom, 0px) + var(--ds-modal-footer-height));border:.25rem solid var(--theme-primary);background-color:var(--palette-graphite-0);box-shadow:0 0 8px 2px rgba(0,0,0,.16),0 2px 4px -4px rgba(0,0,0,.16);font-size:var(--font-size-m);font-weight:var(--font-weight-regular);line-height:var(--semantic-line-height-article);overflow-y:auto}@media(min-width: 640px){.Modal-module_modal__Kyr-Y{max-width:var(--semantic-responsive-article)}}@supports not (height: 100dvh){.Modal-module_modal__Kyr-Y{max-height:calc(100vh - 2*var(--spacing-m))}}.Modal-module_modal__Kyr-Y::backdrop{background:hsla(0,0%,100%,.8)}.Modal-module_modalContainer__muf75{outline:none}.Modal-module_modalHeading__uwT1R{padding-right:var(--spacing-xl)}.Modal-module_modalHeadingNoPadding__t2hkH{padding-right:0}.Modal-module_modalIllustration__jbA32{width:100%;margin-bottom:var(--spacing-m)}.Modal-module_modal__Kyr-Y[data-variant=plain]{border:none}.Modal-module_modalContent__bSZMh[data-padding=none]{padding:0}.Modal-module_modalContent__bSZMh[data-padding=s]{padding:calc(var(--spacing-s) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=m]{padding:calc(var(--spacing-m) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=l]{padding:calc(var(--spacing-l) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=mega]{padding:calc(var(--spacing-mega) - .25rem)}.Modal-module_modalContent__bSZMh[data-no-padding-top=true]{padding-top:0}.Modal-module_closeButton__jgbDq{position:absolute;top:0;right:0;margin:var(--spacing-s)}.Modal-module_closeButton__jgbDq:not(:active)>svg{fill:var(--palette-graphite-100)}.Modal-module_srOnly__W8dQv{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0, 0, 0, 0);white-space:nowrap}
+html:has(dialog[open]){overflow:hidden}.Modal-module_modal__Kyr-Y{--ds-modal-footer-height: 0px;position:fixed;min-width:18rem;max-width:calc(100vw - 2*var(--spacing-m));max-height:calc(100dvh - 2*var(--spacing-m));box-sizing:border-box;padding:0;padding-bottom:calc(env(safe-area-inset-bottom, 0px) + var(--ds-modal-footer-height));border:.25rem solid var(--theme-primary);background-color:var(--palette-graphite-0);box-shadow:0 0 8px 2px rgba(0,0,0,.16),0 2px 4px -4px rgba(0,0,0,.16);font-size:var(--font-size-m);font-weight:var(--font-weight-regular);line-height:var(--semantic-line-height-article);overflow-y:auto}@media(min-width: 640px){.Modal-module_modal__Kyr-Y{max-width:var(--semantic-responsive-article)}}@supports not (height: 100dvh){.Modal-module_modal__Kyr-Y{max-height:calc(100vh - 2*var(--spacing-m))}}.Modal-module_modal__Kyr-Y::backdrop{background:hsla(0,0%,100%,.8)}.Modal-module_modalContainer__muf75{outline:none}.Modal-module_modalHeading__uwT1R{padding-right:var(--spacing-xl)}.Modal-module_modalHeadingNoPadding__t2hkH{padding-right:0}.Modal-module_modalIllustration__jbA32{width:100%;margin-bottom:var(--spacing-m)}.Modal-module_modal__Kyr-Y[data-variant=plain]{border:none}.Modal-module_modalContent__bSZMh[data-padding=none]{padding:0}.Modal-module_modalContent__bSZMh[data-padding=s]{padding:calc(var(--spacing-s) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=m]{padding:calc(var(--spacing-m) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=l]{padding:calc(var(--spacing-l) - .25rem)}.Modal-module_modalContent__bSZMh[data-padding=mega]{padding:calc(var(--spacing-mega) - .25rem)}.Modal-module_modalContent__bSZMh[data-no-padding-top=true]{padding-top:0}.Modal-module_closeButton__jgbDq{position:absolute;top:0;right:0;margin:var(--spacing-s);--icon-button-icon-color: var(--palette-graphite-100)}.Modal-module_closeButton__jgbDq:active{--icon-button-icon-color: var(--palette-graphite-0)}.Modal-module_srOnly__W8dQv{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0, 0, 0, 0);white-space:nowrap}

package/Popover/PopoverContent/PopoverContent.css

@@ -1 +1 @@
-.PopoverContent-module_popover__p0BhU{--popover-max-height: 560px;z-index:50;width:-moz-fit-content;width:fit-content;max-width:var(--container-s);border:1px solid var(--border-color);background-color:var(--background-color)}.PopoverContent-module_popover_forest__HD4fi{--background-color: var(--semantic-success-background);--border-color: var(--semantic-success-foreground)}.PopoverContent-module_popover_ochre__KKnbi{--background-color: var(--semantic-warning-background);--border-color: var(--semantic-warning-foreground)}.PopoverContent-module_popover_white__TaNXR{--background-color: var(--palette-graphite-0);--border-color: var(--palette-graphite-100)}.PopoverContent-module_popoverContent__q0qTL{display:flex;max-height:var(--popover-max-height);overflow-y:auto}.PopoverContent-module_popoverContentWrapper__-lefQ{flex-grow:1;padding:var(--spacing-s) 0 var(--spacing-s) var(--spacing-s);margin:0}@media(min-width: 480px){.PopoverContent-module_popoverContentWrapper__-lefQ{padding:var(--spacing-m) 0 var(--spacing-m) var(--spacing-m)}}.PopoverContent-module_popoverContentCloseButton__ryJUt{align-self:start;margin:var(--spacing-s) var(--spacing-s) 0 0}.PopoverContent-module_popoverContentCloseButton__ryJUt:not(:active)>svg{fill:var(--palette-graphite-100)}.PopoverContent-module_popoverArrow__t-CMj{position:absolute;z-index:-1;width:var(--size-large);height:var(--size-large);border:1px solid var(--border-color);background-color:var(--background-color);transform:rotate(45deg)}.PopoverContent-module_popoverArrow_top__pDZp9{border-top-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_bottom__PG8BL{border-right-color:rgba(0,0,0,0);border-bottom-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_left__92grH{border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_right__-NMZe{border-top-color:rgba(0,0,0,0);border-right-color:rgba(0,0,0,0)}
+.PopoverContent-module_popover__p0BhU{--popover-max-height: 560px;z-index:50;width:-moz-fit-content;width:fit-content;max-width:var(--container-s);border:1px solid var(--border-color);background-color:var(--background-color)}.PopoverContent-module_popover_forest__HD4fi{--background-color: var(--semantic-success-background);--border-color: var(--semantic-success-foreground)}.PopoverContent-module_popover_ochre__KKnbi{--background-color: var(--semantic-warning-background);--border-color: var(--semantic-warning-foreground)}.PopoverContent-module_popover_white__TaNXR{--background-color: var(--palette-graphite-0);--border-color: var(--palette-graphite-100)}.PopoverContent-module_popoverContent__q0qTL{display:flex;max-height:var(--popover-max-height);overflow-y:auto}.PopoverContent-module_popoverContentWrapper__-lefQ{flex-grow:1;padding:var(--spacing-s) 0 var(--spacing-s) var(--spacing-s);margin:0}@media(min-width: 480px){.PopoverContent-module_popoverContentWrapper__-lefQ{padding:var(--spacing-m) 0 var(--spacing-m) var(--spacing-m)}}.PopoverContent-module_popoverContentCloseButton__ryJUt{align-self:start;margin:var(--spacing-s) var(--spacing-s) 0 0;--icon-button-icon-color: var(--palette-graphite-100)}.PopoverContent-module_popoverContentCloseButton__ryJUt:active{--icon-button-icon-color: var(--palette-graphite-0)}.PopoverContent-module_popoverArrow__t-CMj{position:absolute;z-index:-1;width:var(--size-large);height:var(--size-large);border:1px solid var(--border-color);background-color:var(--background-color);transform:rotate(45deg)}.PopoverContent-module_popoverArrow_top__pDZp9{border-top-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_bottom__PG8BL{border-right-color:rgba(0,0,0,0);border-bottom-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_left__92grH{border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_right__-NMZe{border-top-color:rgba(0,0,0,0);border-right-color:rgba(0,0,0,0)}

package/Popover/PopoverContent/PopoverContent.module.css

@@ -1 +1 @@
-.PopoverContent-module_popover__p0BhU{--popover-max-height: 560px;z-index:50;width:-moz-fit-content;width:fit-content;max-width:var(--container-s);border:1px solid var(--border-color);background-color:var(--background-color)}.PopoverContent-module_popover_forest__HD4fi{--background-color: var(--semantic-success-background);--border-color: var(--semantic-success-foreground)}.PopoverContent-module_popover_ochre__KKnbi{--background-color: var(--semantic-warning-background);--border-color: var(--semantic-warning-foreground)}.PopoverContent-module_popover_white__TaNXR{--background-color: var(--palette-graphite-0);--border-color: var(--palette-graphite-100)}.PopoverContent-module_popoverContent__q0qTL{display:flex;max-height:var(--popover-max-height);overflow-y:auto}.PopoverContent-module_popoverContentWrapper__-lefQ{flex-grow:1;padding:var(--spacing-s) 0 var(--spacing-s) var(--spacing-s);margin:0}@media(min-width: 480px){.PopoverContent-module_popoverContentWrapper__-lefQ{padding:var(--spacing-m) 0 var(--spacing-m) var(--spacing-m)}}.PopoverContent-module_popoverContentCloseButton__ryJUt{align-self:start;margin:var(--spacing-s) var(--spacing-s) 0 0}.PopoverContent-module_popoverContentCloseButton__ryJUt:not(:active)>svg{fill:var(--palette-graphite-100)}.PopoverContent-module_popoverArrow__t-CMj{position:absolute;z-index:-1;width:var(--size-large);height:var(--size-large);border:1px solid var(--border-color);background-color:var(--background-color);transform:rotate(45deg)}.PopoverContent-module_popoverArrow_top__pDZp9{border-top-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_bottom__PG8BL{border-right-color:rgba(0,0,0,0);border-bottom-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_left__92grH{border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_right__-NMZe{border-top-color:rgba(0,0,0,0);border-right-color:rgba(0,0,0,0)}
+.PopoverContent-module_popover__p0BhU{--popover-max-height: 560px;z-index:50;width:-moz-fit-content;width:fit-content;max-width:var(--container-s);border:1px solid var(--border-color);background-color:var(--background-color)}.PopoverContent-module_popover_forest__HD4fi{--background-color: var(--semantic-success-background);--border-color: var(--semantic-success-foreground)}.PopoverContent-module_popover_ochre__KKnbi{--background-color: var(--semantic-warning-background);--border-color: var(--semantic-warning-foreground)}.PopoverContent-module_popover_white__TaNXR{--background-color: var(--palette-graphite-0);--border-color: var(--palette-graphite-100)}.PopoverContent-module_popoverContent__q0qTL{display:flex;max-height:var(--popover-max-height);overflow-y:auto}.PopoverContent-module_popoverContentWrapper__-lefQ{flex-grow:1;padding:var(--spacing-s) 0 var(--spacing-s) var(--spacing-s);margin:0}@media(min-width: 480px){.PopoverContent-module_popoverContentWrapper__-lefQ{padding:var(--spacing-m) 0 var(--spacing-m) var(--spacing-m)}}.PopoverContent-module_popoverContentCloseButton__ryJUt{align-self:start;margin:var(--spacing-s) var(--spacing-s) 0 0;--icon-button-icon-color: var(--palette-graphite-100)}.PopoverContent-module_popoverContentCloseButton__ryJUt:active{--icon-button-icon-color: var(--palette-graphite-0)}.PopoverContent-module_popoverArrow__t-CMj{position:absolute;z-index:-1;width:var(--size-large);height:var(--size-large);border:1px solid var(--border-color);background-color:var(--background-color);transform:rotate(45deg)}.PopoverContent-module_popoverArrow_top__pDZp9{border-top-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_bottom__PG8BL{border-right-color:rgba(0,0,0,0);border-bottom-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_left__92grH{border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}.PopoverContent-module_popoverArrow_right__-NMZe{border-top-color:rgba(0,0,0,0);border-right-color:rgba(0,0,0,0)}

package/RolePicker/RolePickerPeopleList/RolePickerPeopleList.esm.js

@@ -2,12 +2,13 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useContext, useRef, useMemo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button } from '@skatteetaten/ds-buttons';
-import { dsI18n, formatNationalIdentityNumber } from '@skatteetaten/ds-core-utils';
+import { dsI18n } from '@skatteetaten/ds-core-utils';
 import { Checkbox } from '@skatteetaten/ds-forms';
 import { PersonSVGpath } from '@skatteetaten/ds-icons';
 import { Heading } from '@skatteetaten/ds-typography';
 import { RolePickerContext } from '../RolePickerContext.esm.js';
 import { RolePickerRow } from '../RolePickerRow/RolePickerRow.esm.js';
+import { getDateOfBirthAsLocaleString, getPersonDescription } from '../utils.esm.js';
 import styles from './RolePickerPeopleList.module.scss.esm.js';
 
 import './RolePickerPeopleList.css';
@@ -32,11 +33,14 @@ const RolePickerPeopleList = ({ people, filterQuery, showDeceasedPeople: showDec
         ctx?.onEntitySelect?.(entity);
     };
     const visibleItems = useMemo(()=>{
-        // lager en dyp kopiering av person-listen for å unngå mutasjon
-        let items = JSON.parse(JSON.stringify(people.list));
+        // lager en kopi av person-listen for å unngå mutasjon
+        let items = people.list.slice();
         items = !showDeceasedPeople ? items.filter((p)=>!p.isDeleted) : items;
         if (filterQuery) {
-            return items.filter((f)=>f.name.toLowerCase().includes(filterQuery.toLowerCase()) || f.personId.includes(filterQuery.toLowerCase()));
+            return items.filter((f)=>{
+                const personIdentifier = f.dateOfBirth ? getDateOfBirthAsLocaleString(f.dateOfBirth, dsI18n.language) : f.personId;
+                return f.name.toLowerCase().includes(filterQuery.toLowerCase()) || personIdentifier.includes(filterQuery.toLowerCase());
+            });
         }
         if (isExpanded) {
             return items;
@@ -80,7 +84,7 @@ const RolePickerPeopleList = ({ people, filterQuery, showDeceasedPeople: showDec
                             children: jsx(RolePickerRow, {
                                 id: item.personId,
                                 title: `${item.name}${item.isDeleted ? ` (${t('rolepicker.Deceased')})` : ''}`,
-                                description: `${t('rolepicker.PeopleDescriptionPrefix')} ${formatNationalIdentityNumber(item.personId)}`,
+                                description: getPersonDescription(item),
                                 svgPath: PersonSVGpath,
                                 onClick: ()=>handleEntityClicked(item)
                             })

package/RolePicker/index.esm.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useDeferredValue, useRef, useImperativeHandle, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button } from '@skatteetaten/ds-buttons';
-import { dsI18n, getCommonClassNameDefault, formatNationalIdentityNumber } from '@skatteetaten/ds-core-utils';
+import { dsI18n, getCommonClassNameDefault } from '@skatteetaten/ds-core-utils';
 import { FavoriteSVGpath, LogOutSVGpath } from '@skatteetaten/ds-icons';
 import { Paragraph } from '@skatteetaten/ds-typography';
 import { getRolePickerHideCloseButtonDefault, getRolePickerShowDeceasedPeopleDefault, getRolePickerShowInactiveBusinessesDefault, getRolePickerShowSubunitsDefault, getRolePickerMinimumEntitiesForSearchDefault } from './defaults.esm.js';
@@ -13,6 +13,7 @@ import { RolePickerContext } from './RolePickerContext.esm.js';
 import { RolePickerFilterInput } from './RolePickerFilterInput/RolePickerFilterInput.esm.js';
 import { RolePickerPeopleList } from './RolePickerPeopleList/RolePickerPeopleList.esm.js';
 import { RolePickerRow } from './RolePickerRow/RolePickerRow.esm.js';
+import { getPersonDescription } from './utils.esm.js';
 import styles from './RolePicker.module.scss.esm.js';
 
 import './RolePicker.css';
@@ -126,7 +127,7 @@ import './RolePicker.css';
                             me ? jsx(RolePickerRow, {
                                 id: me.personId,
                                 title: t('rolepicker.MeHeading'),
-                                description: `${t('rolepicker.PeopleDescriptionPrefix')} ${formatNationalIdentityNumber(me.personId)}`,
+                                description: getPersonDescription(me),
                                 svgPath: FavoriteSVGpath,
                                 titleAs: 'h2',
                                 onClick: ()=>handleEntitySelect(me)

package/RolePicker/utils.esm.js

@@ -0,0 +1,24 @@
+import { dsI18n, formatNationalIdentityNumber } from '@skatteetaten/ds-core-utils';
+
+const getDateOfBirthAsLocaleString = (dateOfBirth, language)=>{
+    const locale = language === 'en_GB' ? 'en-GB' : 'no-NO';
+    const dateFormat = locale === 'en-GB' ? {
+        day: 'numeric',
+        month: 'long',
+        year: 'numeric'
+    } : {
+        day: '2-digit',
+        month: '2-digit',
+        year: 'numeric'
+    };
+    return dateOfBirth.toLocaleDateString(locale, dateFormat);
+};
+const getPersonDescription = ({ dateOfBirth, personId })=>{
+    const { t, language } = dsI18n;
+    if (!dateOfBirth) {
+        return `${t('ds_overlays:rolepicker.PeopleDescriptionPrefix')} ${formatNationalIdentityNumber(personId)}`;
+    }
+    return `${t('ds_overlays:rolepicker.DateOfBirth')} ${getDateOfBirthAsLocaleString(dateOfBirth, language)}`;
+};
+
+export { getDateOfBirthAsLocaleString, getPersonDescription };

package/WordInfo/WordInfoTrigger/WordInfoTrigger.esm.js

@@ -22,6 +22,7 @@ const WordInfoTrigger = ({ ref, id, className = getCommonClassNameDefault(), lan
         ref: mergedRef,
         id: id,
         className: `${styles.wordInfoTrigger} ${className}`.trim(),
+        type: 'button',
         lang: lang,
         "data-testid": dataTestId,
         "aria-expanded": isOpen,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@skatteetaten/ds-overlays",
   "groupId": "no.skatteetaten.aurora",
-  "version": "2.7.1",
+  "version": "2.8.1",
   "main": "./index.esm.js",
   "type": "module",
   "module": "./index.esm.js",
@@ -16,18 +16,18 @@
     "i18next": "^24 || ^25",
     "react": "^19.2.0",
     "react-i18next": "^15",
-    "@skatteetaten/ds-core-utils": "2.7.1",
-    "@skatteetaten/ds-buttons": "2.7.1",
-    "@skatteetaten/ds-forms": "2.7.1",
-    "@skatteetaten/ds-icons": "2.7.1",
-    "@skatteetaten/ds-navigation": "2.7.1",
-    "@skatteetaten/ds-typography": "2.7.1",
-    "@skatteetaten/ds-progress": "2.7.1",
-    "@skatteetaten/ds-status": "2.7.1",
+    "@skatteetaten/ds-core-utils": "2.8.1",
+    "@skatteetaten/ds-buttons": "2.8.1",
+    "@skatteetaten/ds-forms": "2.8.1",
+    "@skatteetaten/ds-icons": "2.8.1",
+    "@skatteetaten/ds-navigation": "2.8.1",
+    "@skatteetaten/ds-typography": "2.8.1",
+    "@skatteetaten/ds-progress": "2.8.1",
+    "@skatteetaten/ds-status": "2.8.1",
     "date-fns": "^4",
-    "@skatteetaten/ds-content": "2.7.1",
+    "@skatteetaten/ds-content": "2.8.1",
     "@floating-ui/react": "0.26.28",
-    "@skatteetaten/ds-collections": "2.7.1"
+    "@skatteetaten/ds-collections": "2.8.1"
   },
   "dependencies": {},
   "scripts": {}

package/src/RolePicker/RolePicker.types.d.ts

@@ -12,6 +12,7 @@ export type Entity = {
 };
 export interface Person extends Entity {
     personId: string;
+    dateOfBirth?: Date;
 }
 export interface Business extends Entity {
     organizationNumber: string;

package/src/RolePicker/utils.d.ts

@@ -0,0 +1,3 @@
+import { Person } from './RolePicker.types';
+export declare const getDateOfBirthAsLocaleString: (dateOfBirth: Date, language: string) => string;
+export declare const getPersonDescription: ({ dateOfBirth, personId, }: Person) => string;