@entur/datepicker 2.0.9 → 2.1.2

package/dist/datepicker.cjs.production.min.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),n=require("react-datepicker"),a=require("date-fns"),r=require("date-fns/locale"),l=require("classnames"),o=require("@entur/icons"),i=require("@entur/typography"),d=require("@entur/button"),u=require("@entur/form"),c=require("@entur/tooltip");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("react-datepicker/dist/react-datepicker.css");var f=s(t),m=s(n),p=s(l);function b(){return b=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},b.apply(this,arguments)}function v(e,t){if(null==e)return{};var n,a,r={},l=Object.keys(e);for(a=0;a<l.length;a++)t.indexOf(n=l[a])>=0||(r[n]=e[n]);return r}function h(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n<t;n++)a[n]=e[n];return a}function y(e,t){var n="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(n)return(n=n.call(e)).next.bind(n);if(Array.isArray(e)||(n=function(e,t){if(e){if("string"==typeof e)return h(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?h(e,t):void 0}}(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var a=0;return function(){return a>=e.length?{done:!0}:{done:!1,value:e[a++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var k=function(e){var t,n=e.date,a=e.decreaseMonth,r=e.increaseMonth,l=e.prevMonthButtonDisabled,u=e.nextMonthButtonDisabled,c=function(e){void 0===e&&(e="nb");var t=(new Date).getFullYear(),n=Array(12).keys(),a=new Intl.DateTimeFormat(e,{month:"long"});return Array.from(n,(function(e){return a.format(new Date(t,e))}))}();return f.default.createElement("div",{className:"eds-datepicker__calender__header"},f.default.createElement(d.IconButton,{type:"button",className:"eds-datepicker__calender__header__month-button--left",onClick:a,disabled:l},f.default.createElement(o.LeftArrowIcon,null)),f.default.createElement(i.Heading3,{className:"eds-datepicker__calender__header__month-text"},c[null!=(t=null==n?void 0:n.getMonth())?t:0]),f.default.createElement(i.Heading3,{className:"eds-datepicker__calender__header__month-text"},null==n?void 0:n.getFullYear()),f.default.createElement(d.IconButton,{type:"button",className:"eds-datepicker__calender__header__month-button--right",onClick:r,disabled:u},f.default.createElement(o.RightArrowIcon,null)))},g=["style","label","inputPlaceholder","prepend","feedback","variant","disabled","calendarButtonTooltip","hideCalendarButton","disableLabelAnimation","inputRef","calendarButtonId","forwardRef","toggleCalendarGUI","onKeyDownInput","onBlurInput","selectedDate","setFocusToCalendarGUI","setShouldFocusOnCalendarButtonAfterSelect","calendarGUIIsOpen","placeholder","onClick"],C=f.default.forwardRef((function(e,t){var n=e.style,a=e.label,r=e.inputPlaceholder,l=e.prepend,i=e.feedback,s=e.variant,m=e.disabled,p=e.calendarButtonTooltip,h=e.hideCalendarButton,y=e.disableLabelAnimation,k=e.inputRef,C=e.calendarButtonId,I=e.forwardRef,w=e.toggleCalendarGUI,E=e.onKeyDownInput,A=e.onBlurInput,F=e.selectedDate,B=e.setFocusToCalendarGUI,L=e.setShouldFocusOnCalendarButtonAfterSelect,N=e.calendarGUIIsOpen,D=e.onClick,M=v(e,g);function T(e){E(e)}function x(e){A(e)}f.default.useEffect((function(){var e,t,n;return null==(e=k.current)||e.addEventListener("keydown",T),null==(t=k.current)||t.addEventListener("blur",x),null==(n=k.current)||n.addEventListener("focus",O),function(){var e,t,n;null==(e=k.current)||e.removeEventListener("keydown",T),null==(t=k.current)||t.removeEventListener("blur",x),null==(n=k.current)||n.removeEventListener("focus",O)}}),[k,F]);var O=function(){return requestAnimationFrame((function(){var e;return null==(e=k.current)?void 0:e.select()}))};return f.default.createElement(u.TextField,b({style:n,label:a,placeholder:r,prepend:l,feedback:i,variant:s,disableLabelAnimation:y,ref:_(t,k,I),onClick:function(e){L(!1),D&&D(e)},append:!h&&f.default.createElement(c.Tooltip,{placement:"top",content:p,disableHoverListener:m,disableFocusListener:m},f.default.createElement(d.IconButton,{id:C,type:"button",onClick:function(){w(),B(),L(!0)},tabIndex:N()?-1:0},f.default.createElement(o.CalendarIcon,null)))},M))})),_=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return function(e){for(var n,a=y(t);!(n=a()).done;){var r=n.value;"function"==typeof r?r(e):r&&(r.current=e)}}},I=["style","className","selectedDate","label","placeholder","onChange","onKeyDown","dateFormats","minDate","maxDate","inline","disabled","prepend","feedback","variant","validationFeedback","validationVariant","disableLabelAnimation","calendarButtonTooltip","hideCalendarButton","hideCalendar","hideValidation","weekLabel","locale","open"];n.registerLocale("nb",r.nb);var w=f.default.forwardRef((function(n,l){var o=n.style,i=n.className,d=n.selectedDate,u=n.label,c=n.placeholder,s=void 0===c?"dd.mm.yyyy":c,h=n.onChange,y=n.onKeyDown,g=void 0===y?function(){return null}:y,_=n.dateFormats,w=void 0===_?["dd.MM.yyyy","ddMMyyyy","dd/MM/yyyy","ddMMyy"]:_,E=n.minDate,A=n.maxDate,F=n.inline,B=void 0!==F&&F,L=n.disabled,N=n.prepend,D=n.feedback,M=void 0===D?"":D,T=n.variant,x=n.validationFeedback,O=void 0===x?"Ugyldig dato":x,R=n.validationVariant,S=void 0===R?"error":R,q=n.disableLabelAnimation,G=void 0!==q&&q,P=n.calendarButtonTooltip,U=void 0===P?"Åpne kalender":P,H=n.hideCalendarButton,j=void 0!==H&&H,V=n.hideCalendar,K=void 0!==V&&V,Y=n.hideValidation,W=void 0!==Y&&Y,$=n.weekLabel,z=void 0===$?"uke":$,J=n.locale,Q=void 0===J?r.nb:J,X=n.open,Z=v(n,I),ee=e.useRandomId("eds-datepicker"),te=t.useRef(null),ne=f.default.useRef(null),ae=document.getElementById(ee+"-button"),re=t.useState(!1),le=re[0],oe=re[1],ie=t.useState(!1),de=ie[0],ue=ie[1];f.default.useEffect((function(){return ce()}),[d]);var ce=function(){var e;oe(!1);var t=null==(e=ne.current)?void 0:e.value;if(t){var n=w.map((function(e){return a.parse(t,e,new Date,{locale:Q})})),r=d&&n.some((function(e){return a.isSameDay(e,d)}));oe(!r)}},se=function(){return M?{feedback:M,variant:T}:!W&&le?{feedback:O,variant:S}:{feedback:"",variant:void 0}},fe=function(){return requestAnimationFrame((function(){var e;return null==(e=ne.current)?void 0:e.select()}))},me=function(){var e;return null==(e=te.current)?void 0:e.setState({inputValue:null})},pe=function(){var e;return null==(e=te.current)?void 0:e.setOpen(!be())},be=function(){var e;return null==(e=te.current)?void 0:e.isCalendarOpen()};return f.default.createElement(f.default.Fragment,null,f.default.createElement(m.default,b({selected:d,minDate:E,maxDate:A,dateFormat:w,showWeekNumbers:!0,weekLabel:z,onChange:function(e,t){var n;de&&!j?(null==ae||ae.focus(),ue(!1)):null==(n=ne.current)||n.focus(),h(e,t)},onClickOutside:function(){return ue(!1)},id:ee,ariaLabelledBy:ee,showPopperArrow:!1,locale:Q,inline:B,disabled:L,preventOpenOnFocus:!0,open:!K&&X,ref:te,calendarClassName:"eds-datepicker__calender",dayClassName:function(){return"eds-datepicker__calender__day"},weekDayClassName:function(){return"eds-datepicker__calender__day-name"},className:p.default(i,"eds-datepicker__input"),highlightDates:[{"eds-datepicker__calender__day--today":[new Date]},{"eds-datepicker__calender__day--selected":d?[d]:[]}],renderCustomHeader:function(e){return f.default.createElement(k,{date:e.date,changeYear:e.changeYear,changeMonth:e.changeMonth,increaseMonth:e.increaseMonth,decreaseMonth:e.decreaseMonth,prevMonthButtonDisabled:e.prevMonthButtonDisabled,nextMonthButtonDisabled:e.nextMonthButtonDisabled})},customInput:f.default.createElement(C,{style:o,label:u,inputPlaceholder:s,calendarButtonTooltip:U,prepend:N,feedback:se().feedback,variant:se().variant,inputRef:ne,calendarButtonId:ee+"-button",forwardRef:l,onKeyDownInput:function(e){oe(!1),"Enter"===e.key?(be()||(ce(),me()),fe()):"Tab"===e.key&&be()?me():"Escape"===e.key&&(me(),fe(),be()&&pe()),g(e)},onBlurInput:function(){be()||(ce(),me())},onFocus:void 0,toggleCalendarGUI:pe,setFocusToCalendarGUI:function(){B||K||be()||(requestAnimationFrame((function(){var e=d?document.getElementsByClassName("eds-datepicker__calender__day--selected")[0]:document.getElementsByClassName("eds-datepicker__calender__day--today")[0];null!==e&&e.focus()})),ue(!0),oe(!1))},setShouldFocusOnCalendarButtonAfterSelect:ue,calendarGUIIsOpen:be,disableLabelAnimation:G,hideCalendarButton:j,selectedDate:d})},Z)))})),E=["className","style","label","onChange","feedback","variant","disableLabelAnimation","prepend"],A=["onChange","variant","value"],F=f.default.forwardRef((function(t,n){var a=t.className,r=t.style,l=t.label,i=t.onChange,d=t.feedback,c=t.variant,s=t.disableLabelAnimation,m=t.prepend,p=void 0===m?f.default.createElement(o.DateIcon,{inline:!0}):m,h=v(t,E),y=e.useRandomId("eds-nativetimepicker");return f.default.createElement(u.BaseFormControl,{style:r,className:a,prepend:p,label:l,feedback:d,variant:c,labelId:y,disableLabelAnimation:s,isFilled:!0},f.default.createElement(B,b({onChange:i,"aria-labelledby":y,ref:n,variant:c},h)))})),B=f.default.forwardRef((function(t,n){var a=t.onChange,r=t.variant,l=t.value,o=v(t,A),i=u.useVariant(),d=r||i,c=u.useInputGroupContext(),s=c.isFilled,m=c.setFilled;return e.useOnMount((function(){m&&!s&&m(!0)})),f.default.useEffect((function(){l?m&&!s&&m(!0):m&&s&&m(!1)}),[l,m,s]),f.default.createElement("input",b({ref:n,"aria-invalid":"error"===d,type:"date",className:"eds-form-control eds-native-date-picker",onChange:function(e){u.isFilled(e.target)?m&&!s&&m(!0):m&&s&&m(!1),a&&a(e)},value:l},o))})),L=["selectedTime","onChange","placeholder","disabled","className","style","label","labelTooltip","feedback","variant","disableLabelAnimation","locale","onLeftArrowClick","onRightArrowClick"],N=["className","onChange","selectedTime","placeholder","timeFormat","dateFormat"],D=["direction"];n.registerLocale("nb",r.nb);var M=f.default.forwardRef((function(t,n){var r=t.selectedTime,l=void 0===r?null:r,o=t.onChange,i=t.placeholder,d=void 0===i?"Velg tid":i,c=t.disabled,s=t.className,m=t.style,p=t.label,h=t.labelTooltip,y=t.feedback,k=t.variant,g=t.disableLabelAnimation,C=t.locale,_=void 0===C?"nb":C,I=t.onLeftArrowClick,w=void 0===I?function(e,t){return e&&o(a.sub(e,{minutes:30}),t)}:I,E=t.onRightArrowClick,A=void 0===E?function(e,t){return e&&o(a.add(e,{minutes:30}),t)}:E,F=v(t,L),B=e.useRandomId("eds-timepicker");return f.default.createElement(u.BaseFormControl,{style:m,ref:n,label:p,labelId:B,labelTooltip:h,variant:k,feedback:y,disableLabelAnimation:g,className:"eds-timepicker-form-control",disabled:c,prepend:f.default.createElement(O,{direction:"left",tabIndex:-1,onClick:function(e){return w(l,e)},disabled:c})},f.default.createElement(x,b({selectedTime:l,onChange:o,placeholder:d,className:s,locale:_,ariaLabelledBy:B,disabled:c},F)),f.default.createElement(O,{direction:"right",tabIndex:-1,onClick:function(e){return A(l,e)},disabled:c}))})),T=[{name:"offset",enabled:!0,options:{offset:[0,0]}}],x=function(t){var n=t.className,a=t.onChange,r=t.selectedTime,l=t.placeholder,o=t.timeFormat,i=void 0===o?"HH:mm":o,d=t.dateFormat,c=void 0===d?["HH:mm","HHmm"]:d,s=v(t,N),h=u.useInputGroupContext(),y=h.isFilled,k=h.setFilled;return e.useOnMount((function(){r&&k&&!y&&k(!0)})),f.default.useEffect((function(){r?k&&!y&&k(!0):k&&y&&k(!1)}),[r,k,y]),f.default.createElement(m.default,b({className:p.default("eds-form-control","eds-timepicker__input",n),calendarClassName:"eds-timepicker",selected:r,onChange:function(e,t){e?k&&!y&&k(!0):k&&y&&k(!1),a&&a(e,t)},dateFormat:c,timeFormat:i,showTimeSelect:!0,showTimeInput:!0,showTimeSelectOnly:!0,showPopperArrow:!1,placeholderText:l,popperClassName:"eds-datepicker__popper",popperModifiers:T,open:!1},s))},O=function(e){var t=e.direction,n=v(e,D);return f.default.createElement("button",b({className:p.default("eds-timepicker__arrowbutton","eds-timepicker__arrowbutton--"+t),type:"button"},n),f.default.createElement("left"===t?o.LeftArrowIcon:o.RightArrowIcon,null))},R=["className","style","onChange","label","feedback","variant","disableLabelAnimation","prepend"],S=["onChange","value"],q=f.default.forwardRef((function(t,n){var a=t.className,r=t.style,l=t.onChange,i=t.label,d=t.feedback,c=t.variant,s=t.disableLabelAnimation,m=t.prepend,p=void 0===m?f.default.createElement(o.ClockIcon,null):m,h=v(t,R),y=e.useRandomId("eds-nativetimepicker");return f.default.createElement(u.BaseFormControl,{style:r,className:a,prepend:p,label:i,feedback:d,variant:c,labelId:y,disableLabelAnimation:s},f.default.createElement(G,b({onChange:l,"aria-labelledby":y,ref:n},h)))})),G=f.default.forwardRef((function(t,n){var a=t.onChange,r=t.value,l=v(t,S),o=u.useVariant(),i=l.variant||o,d=u.useInputGroupContext(),c=d.isFilled,s=d.setFilled;return e.useOnMount((function(){s&&!c&&s(!0)})),f.default.useEffect((function(){r?s&&!c&&s(!0):s&&c&&s(!1)}),[r,s,c]),f.default.createElement("input",b({ref:n,"aria-invalid":"error"===i,type:"time",className:"eds-form-control eds-native-date-picker",onChange:function(e){u.isFilled(e.target)?s&&!c&&s(!0):s&&c&&s(!1),a&&a(e)},value:r},l))}));e.warnAboutMissingStyles("datepicker","form","icons"),exports.DatePicker=w,exports.NativeDatePicker=F,exports.NativeTimePicker=q,exports.TimePicker=M;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),a=require("react-datepicker"),n=require("date-fns"),r=require("date-fns/locale"),l=require("classnames"),o=require("@entur/icons"),i=require("@entur/typography"),d=require("@entur/button"),u=require("@entur/form"),c=require("@entur/tooltip");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("react-datepicker/dist/react-datepicker.css");var f=s(t),p=s(a),m=s(l);function b(){return b=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},b.apply(this,arguments)}function v(e,t){if(null==e)return{};var a,n,r={},l=Object.keys(e);for(n=0;n<l.length;n++)t.indexOf(a=l[n])>=0||(r[a]=e[a]);return r}function h(e,t){(null==t||t>e.length)&&(t=e.length);for(var a=0,n=new Array(t);a<t;a++)n[a]=e[a];return n}function y(e,t){var a="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(a)return(a=a.call(e)).next.bind(a);if(Array.isArray(e)||(a=function(e,t){if(e){if("string"==typeof e)return h(e,t);var a=Object.prototype.toString.call(e).slice(8,-1);return"Object"===a&&e.constructor&&(a=e.constructor.name),"Map"===a||"Set"===a?Array.from(e):"Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)?h(e,t):void 0}}(e))||t&&e&&"number"==typeof e.length){a&&(e=a);var n=0;return function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var k=function(e){var t,a=e.date,n=e.decreaseMonth,r=e.increaseMonth,l=e.prevMonthButtonDisabled,u=e.nextMonthButtonDisabled,c=e.nextMonthAriaLabel,s=e.previousMonthAriaLabel,p=e.locale,m=null!=(t=null==a?void 0:a.getMonth())?t:0;return f.default.createElement("div",{className:"eds-datepicker__calender__header"},f.default.createElement(d.IconButton,{type:"button",className:"eds-datepicker__calender__header__month-button--left",onClick:n,disabled:l,"aria-label":s+" ("+g(m-1,p)+")"},f.default.createElement(o.LeftArrowIcon,null)),f.default.createElement(i.Heading3,{className:"eds-datepicker__calender__header__month-text"},g(m,p)),f.default.createElement(i.Heading3,{className:"eds-datepicker__calender__header__month-text"},null==a?void 0:a.getFullYear()),f.default.createElement(d.IconButton,{type:"button",className:"eds-datepicker__calender__header__month-button--right",onClick:r,disabled:u,"aria-label":c+" ("+g(m+1,p)+")"},f.default.createElement(o.RightArrowIcon,null)))};function g(e,t){var a=(new Date).getFullYear();return new Intl.DateTimeFormat(t.code,{month:"long"}).format(new Date(a,e))}var C=["style","label","inputPlaceholder","prepend","feedback","variant","disabled","calendarButtonTooltipOpen","calendarButtonTooltipClose","hideCalendarButton","disableLabelAnimation","inputRef","calendarButtonId","forwardRef","toggleCalendarGUI","onKeyDownInput","onBlurInput","selectedDate","setFocusToCalendarGUI","setShouldFocusOnCalendarButtonAfterSelect","calendarGUIIsOpen","placeholder","onClick","aria-labelledby"],_=f.default.forwardRef((function(e,t){var a=e.style,n=e.label,r=e.inputPlaceholder,l=e.prepend,i=e.feedback,s=e.variant,p=e.disabled,m=e.calendarButtonTooltipOpen,h=e.calendarButtonTooltipClose,y=e.hideCalendarButton,k=e.disableLabelAnimation,g=e.inputRef,_=e.calendarButtonId,A=e.forwardRef,w=e.toggleCalendarGUI,L=e.onKeyDownInput,E=e.onBlurInput,F=e.selectedDate,B=e.setFocusToCalendarGUI,M=e.setShouldFocusOnCalendarButtonAfterSelect,D=e.calendarGUIIsOpen,N=e.onClick,T=v(e,C);function x(e){L(e)}function O(e){E(e)}f.default.useEffect((function(){var e,t,a;return null==(e=g.current)||e.addEventListener("keydown",x),null==(t=g.current)||t.addEventListener("blur",O),null==(a=g.current)||a.addEventListener("focus",S),function(){var e,t,a;null==(e=g.current)||e.removeEventListener("keydown",x),null==(t=g.current)||t.removeEventListener("blur",O),null==(a=g.current)||a.removeEventListener("focus",S)}}),[g,F]);var R,S=function(){return requestAnimationFrame((function(){var e;return null==(e=g.current)?void 0:e.select()}))};return f.default.createElement(u.TextField,b({style:a,label:n,placeholder:r,prepend:l,feedback:i,variant:s,disableLabelAnimation:k,ref:I(t,g,A),onClick:function(e){M(!1),N&&N(e)},ariaAlertOnFeedback:!0,append:!y&&f.default.createElement(c.Tooltip,{placement:"top",content:D()?h:m,disableHoverListener:p,disableFocusListener:p},f.default.createElement(d.IconButton,{id:_,type:"button",onClick:function(){w(),B(),M(!0)},tabIndex:D()?-1:0,"aria-label":(D()?h:m)+", "+(F?(null==(R=g.current)?void 0:R.value)+" valgt":"Ingen dato valgt")},f.default.createElement(o.CalendarIcon,null)))},T))})),I=function(){for(var e=arguments.length,t=new Array(e),a=0;a<e;a++)t[a]=arguments[a];return function(e){for(var a,n=y(t);!(a=n()).done;){var r=a.value;"function"==typeof r?r(e):r&&(r.current=e)}}},A=["style","className","selectedDate","label","placeholder","onChange","onKeyDown","dateFormats","minDate","maxDate","inline","disabled","prepend","feedback","variant","validationFeedback","validationVariant","disableLabelAnimation","calendarButtonTooltipOpen","calendarButtonTooltipClose","hideCalendarButton","hideCalendar","hideValidation","weekLabel","chooseDayAriaLabelPrefix","previousMonthAriaLabel","nextMonthAriaLabel","locale","open"];a.registerLocale("nb",r.nb);var w=f.default.forwardRef((function(a,l){var o=a.style,i=a.className,d=a.selectedDate,u=a.label,c=a.placeholder,s=void 0===c?"dd.mm.yyyy":c,h=a.onChange,y=a.onKeyDown,g=void 0===y?function(){return null}:y,C=a.dateFormats,I=void 0===C?["dd.MM.yyyy","ddMMyyyy","dd/MM/yyyy","ddMMyy"]:C,w=a.minDate,L=a.maxDate,E=a.inline,F=void 0!==E&&E,B=a.disabled,M=a.prepend,D=a.feedback,N=void 0===D?"":D,T=a.variant,x=a.validationFeedback,O=void 0===x?"Ugyldig dato":x,R=a.validationVariant,S=void 0===R?"error":R,q=a.disableLabelAnimation,P=void 0!==q&&q,G=a.calendarButtonTooltipOpen,U=void 0===G?"Åpne kalender":G,H=a.calendarButtonTooltipClose,V=void 0===H?"Lukk kalender":H,j=a.hideCalendarButton,K=void 0!==j&&j,Y=a.hideCalendar,W=void 0!==Y&&Y,$=a.hideValidation,z=void 0!==$&&$,J=a.weekLabel,Q=void 0===J?"uke":J,X=a.chooseDayAriaLabelPrefix,Z=void 0===X?"Velg":X,ee=a.previousMonthAriaLabel,te=void 0===ee?"Forrige måned":ee,ae=a.nextMonthAriaLabel,ne=void 0===ae?"Neste måned":ae,re=a.locale,le=void 0===re?r.nb:re,oe=a.open,ie=v(a,A),de=e.useRandomId("eds-datepicker"),ue=t.useRef(null),ce=f.default.useRef(null),se=document.getElementById(de+"-button"),fe=t.useState(!1),pe=fe[0],me=fe[1],be=t.useState(!1),ve=be[0],he=be[1];f.default.useEffect((function(){return ye()}),[d]);var ye=function(){var e;me(!1);var t=null==(e=ce.current)?void 0:e.value;if(t){var a=I.map((function(e){return n.parse(t,e,new Date,{locale:le})})),r=d&&a.some((function(e){return n.isSameDay(e,d)}));me(!r)}},ke=function(){return N?{feedback:N,variant:T}:!z&&pe?{feedback:O,variant:S}:{feedback:"",variant:void 0}},ge=function(){return requestAnimationFrame((function(){var e;return null==(e=ce.current)?void 0:e.select()}))},Ce=function(){var e;return null==(e=ue.current)?void 0:e.setState({inputValue:null})},_e=function(){var e;return null==(e=ue.current)?void 0:e.setOpen(!Ie())},Ie=function(){var e;return null==(e=ue.current)?void 0:e.isCalendarOpen()};return f.default.createElement(f.default.Fragment,null,f.default.createElement(p.default,b({selected:d,minDate:w,maxDate:L,dateFormat:I,showWeekNumbers:!0,weekLabel:Q,onChange:function(e,t){var a;ve&&!K?(null==se||se.focus(),he(!1)):null==(a=ce.current)||a.focus(),h(e,t)},onClickOutside:function(){return he(!1)},id:de,ariaLabelledBy:de,showPopperArrow:!1,locale:le,inline:F,disabled:B,preventOpenOnFocus:!0,chooseDayAriaLabelPrefix:Z,open:!W&&oe,ref:ue,calendarClassName:"eds-datepicker__calender",dayClassName:function(){return"eds-datepicker__calender__day"},weekDayClassName:function(){return"eds-datepicker__calender__day-name"},className:m.default(i,"eds-datepicker__input"),highlightDates:[{"eds-datepicker__calender__day--today":[new Date]},{"eds-datepicker__calender__day--selected":d?[d]:[]}],renderCustomHeader:function(e){return f.default.createElement(k,{date:e.date,changeYear:e.changeYear,changeMonth:e.changeMonth,increaseMonth:e.increaseMonth,decreaseMonth:e.decreaseMonth,prevMonthButtonDisabled:e.prevMonthButtonDisabled,nextMonthButtonDisabled:e.nextMonthButtonDisabled,previousMonthAriaLabel:te,nextMonthAriaLabel:ne,locale:le})},customInput:f.default.createElement(_,{style:o,label:u,inputPlaceholder:s,calendarButtonTooltipOpen:U,calendarButtonTooltipClose:V,prepend:M,feedback:ke().feedback,variant:ke().variant,inputRef:ce,calendarButtonId:de+"-button",forwardRef:l,onKeyDownInput:function(e){me(!1),"Enter"===e.key?(Ie()||(ye(),Ce()),ge()):"Tab"===e.key&&Ie()?Ce():"Escape"===e.key&&(Ce(),ge(),Ie()&&_e()),g(e)},onBlurInput:function(){Ie()||(ye(),Ce())},onFocus:void 0,toggleCalendarGUI:_e,setFocusToCalendarGUI:function(){F||W||Ie()||(requestAnimationFrame((function(){var e,t,a=(null==(e=ue.current)?void 0:e.calendar.componentNode).querySelector(d?'.eds-datepicker__calender__day[tabindex="0"]':'.eds-datepicker__calender__day[aria-current="date"]');null!==a&&(null==(t=ue.current)||t.setBlur(),a.focus({preventScroll:!0}))})),he(!0),me(!1))},setShouldFocusOnCalendarButtonAfterSelect:he,calendarGUIIsOpen:Ie,disableLabelAnimation:P,hideCalendarButton:K,selectedDate:d})},ie)))})),L=["className","style","label","onChange","feedback","variant","disableLabelAnimation","prepend"],E=["onChange","variant","value"],F=f.default.forwardRef((function(t,a){var n=t.className,r=t.style,l=t.label,i=t.onChange,d=t.feedback,c=t.variant,s=t.disableLabelAnimation,p=t.prepend,m=void 0===p?f.default.createElement(o.DateIcon,{inline:!0}):p,h=v(t,L),y=e.useRandomId("eds-nativetimepicker");return f.default.createElement(u.BaseFormControl,{style:r,className:n,prepend:m,label:l,feedback:d,variant:c,labelId:y,disableLabelAnimation:s,isFilled:!0},f.default.createElement(B,b({onChange:i,"aria-labelledby":y,ref:a,variant:c},h)))})),B=f.default.forwardRef((function(t,a){var n=t.onChange,r=t.variant,l=t.value,o=v(t,E),i=u.useVariant(),d=r||i,c=u.useInputGroupContext(),s=c.isFilled,p=c.setFilled;return e.useOnMount((function(){p&&!s&&p(!0)})),f.default.useEffect((function(){l?p&&!s&&p(!0):p&&s&&p(!1)}),[l,p,s]),f.default.createElement("input",b({ref:a,"aria-invalid":"error"===d,type:"date",className:"eds-form-control eds-native-date-picker",onChange:function(e){u.isFilled(e.target)?p&&!s&&p(!0):p&&s&&p(!1),n&&n(e)},value:l},o))})),M=["selectedTime","onChange","placeholder","disabled","className","style","label","labelTooltip","feedback","variant","disableLabelAnimation","locale","onLeftArrowClick","onRightArrowClick"],D=["className","onChange","selectedTime","placeholder","timeFormat","dateFormat"],N=["direction"];a.registerLocale("nb",r.nb);var T=f.default.forwardRef((function(t,a){var r=t.selectedTime,l=void 0===r?null:r,o=t.onChange,i=t.placeholder,d=void 0===i?"Velg tid":i,c=t.disabled,s=t.className,p=t.style,m=t.label,h=t.labelTooltip,y=t.feedback,k=t.variant,g=t.disableLabelAnimation,C=t.locale,_=void 0===C?"nb":C,I=t.onLeftArrowClick,A=void 0===I?function(e,t){return e&&o(n.sub(e,{minutes:30}),t)}:I,w=t.onRightArrowClick,L=void 0===w?function(e,t){return e&&o(n.add(e,{minutes:30}),t)}:w,E=v(t,M),F=e.useRandomId("eds-timepicker");return f.default.createElement(u.BaseFormControl,{style:p,ref:a,label:m,labelId:F,labelTooltip:h,variant:k,feedback:y,disableLabelAnimation:g,className:"eds-timepicker-form-control",disabled:c,prepend:f.default.createElement(R,{direction:"left",tabIndex:-1,onClick:function(e){return A(l,e)},disabled:c})},f.default.createElement(O,b({selectedTime:l,onChange:o,placeholder:d,className:s,locale:_,ariaLabelledBy:F,disabled:c},E)),f.default.createElement(R,{direction:"right",tabIndex:-1,onClick:function(e){return L(l,e)},disabled:c}))})),x=[{name:"offset",enabled:!0,options:{offset:[0,0]}}],O=function(t){var a=t.className,n=t.onChange,r=t.selectedTime,l=t.placeholder,o=t.timeFormat,i=void 0===o?"HH:mm":o,d=t.dateFormat,c=void 0===d?["HH:mm","HHmm"]:d,s=v(t,D),h=u.useInputGroupContext(),y=h.isFilled,k=h.setFilled;return e.useOnMount((function(){r&&k&&!y&&k(!0)})),f.default.useEffect((function(){r?k&&!y&&k(!0):k&&y&&k(!1)}),[r,k,y]),f.default.createElement(p.default,b({className:m.default("eds-form-control","eds-timepicker__input",a),calendarClassName:"eds-timepicker",selected:r,onChange:function(e,t){e?k&&!y&&k(!0):k&&y&&k(!1),n&&n(e,t)},dateFormat:c,timeFormat:i,showTimeSelect:!0,showTimeInput:!0,showTimeSelectOnly:!0,showPopperArrow:!1,placeholderText:l,popperClassName:"eds-datepicker__popper",popperModifiers:x,open:!1},s))},R=function(e){var t=e.direction,a=v(e,N);return f.default.createElement("button",b({className:m.default("eds-timepicker__arrowbutton","eds-timepicker__arrowbutton--"+t),type:"button"},a),f.default.createElement("left"===t?o.LeftArrowIcon:o.RightArrowIcon,null))},S=["className","style","onChange","label","feedback","variant","disableLabelAnimation","prepend"],q=["onChange","value"],P=f.default.forwardRef((function(t,a){var n=t.className,r=t.style,l=t.onChange,i=t.label,d=t.feedback,c=t.variant,s=t.disableLabelAnimation,p=t.prepend,m=void 0===p?f.default.createElement(o.ClockIcon,null):p,h=v(t,S),y=e.useRandomId("eds-nativetimepicker");return f.default.createElement(u.BaseFormControl,{style:r,className:n,prepend:m,label:i,feedback:d,variant:c,labelId:y,disableLabelAnimation:s},f.default.createElement(G,b({onChange:l,"aria-labelledby":y,ref:a},h)))})),G=f.default.forwardRef((function(t,a){var n=t.onChange,r=t.value,l=v(t,q),o=u.useVariant(),i=l.variant||o,d=u.useInputGroupContext(),c=d.isFilled,s=d.setFilled;return e.useOnMount((function(){s&&!c&&s(!0)})),f.default.useEffect((function(){r?s&&!c&&s(!0):s&&c&&s(!1)}),[r,s,c]),f.default.createElement("input",b({ref:a,"aria-invalid":"error"===i,type:"time",className:"eds-form-control eds-native-date-picker",onChange:function(e){u.isFilled(e.target)?s&&!c&&s(!0):s&&c&&s(!1),n&&n(e)},value:r},l))}));e.warnAboutMissingStyles("datepicker","form","icons"),exports.DatePicker=w,exports.NativeDatePicker=F,exports.NativeTimePicker=P,exports.TimePicker=T;
 //# sourceMappingURL=datepicker.cjs.production.min.js.map

package/dist/datepicker.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"datepicker.cjs.production.min.js","sources":["../src/DatePicker/DatePickerHeader.tsx","../src/DatePicker/DatePickerInput.tsx","../src/DatePicker/DatePicker.tsx","../src/NativeDatePicker.tsx","../src/TimePicker.tsx","../src/NativeTimePicker.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { ReactDatePickerCustomHeaderProps } from 'react-datepicker';\n\nimport { LeftArrowIcon, RightArrowIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { IconButton } from '@entur/button';\n\nexport const DatePickerHeader = ({\n  date,\n  decreaseMonth,\n  increaseMonth,\n  prevMonthButtonDisabled,\n  nextMonthButtonDisabled,\n}: Partial<ReactDatePickerCustomHeaderProps>) => {\n  const monthNames = getMonthList();\n  return (\n    <div className=\"eds-datepicker__calender__header\">\n      <IconButton\n        type=\"button\"\n        className=\"eds-datepicker__calender__header__month-button--left\"\n        onClick={decreaseMonth}\n        disabled={prevMonthButtonDisabled}\n      >\n        <LeftArrowIcon />\n      </IconButton>\n      <Heading3 className=\"eds-datepicker__calender__header__month-text\">\n        {monthNames[date?.getMonth() ?? 0]}\n      </Heading3>\n      <Heading3 className=\"eds-datepicker__calender__header__month-text\">\n        {date?.getFullYear()}\n      </Heading3>\n\n      <IconButton\n        type=\"button\"\n        className=\"eds-datepicker__calender__header__month-button--right\"\n        onClick={increaseMonth}\n        disabled={nextMonthButtonDisabled}\n      >\n        <RightArrowIcon />\n      </IconButton>\n    </div>\n  );\n};\n\nfunction getMonthList(locale = 'nb') {\n  const year = new Date().getFullYear();\n  const monthList = Array(12).keys();\n  const formatter = new Intl.DateTimeFormat(locale, {\n    month: 'long',\n  });\n  const getMonthName = (monthIndex: number) =>\n    formatter.format(new Date(year, monthIndex));\n\n  return Array.from(monthList, getMonthName);\n}\n","import React from 'react';\n\nimport { TextField, VariantType } from '@entur/form';\nimport { Tooltip } from '@entur/tooltip';\nimport { IconButton } from '@entur/button';\nimport { CalendarIcon } from '@entur/icons';\n\ntype DatePickerInputProps = {\n  style?: React.CSSProperties;\n  label: string;\n  inputPlaceholder: string;\n  prepend?: React.ReactNode;\n  feedback?: string;\n  variant?: VariantType;\n  disabled?: boolean;\n  disableLabelAnimation?: boolean;\n  calendarButtonTooltip: string;\n  hideCalendarButton?: boolean;\n  inputRef: React.RefObject<HTMLInputElement>;\n  calendarButtonId: string;\n  forwardRef: React.ForwardedRef<HTMLInputElement>;\n  toggleCalendarGUI: () => void;\n  setFocusToCalendarGUI: () => void;\n  setShouldFocusOnCalendarButtonAfterSelect: React.Dispatch<\n    React.SetStateAction<boolean>\n  >;\n  onKeyDownInput: (event: KeyboardEvent) => any;\n  onBlurInput: (event: FocusEvent) => any;\n  calendarGUIIsOpen: () => boolean | undefined;\n  onClick?: React.MouseEventHandler<HTMLInputElement>; // react-datepicker's onClick prop\n  onFocus: undefined; // To prevent open on focus\n  selectedDate: Date | null; // Necessary to update component on state change\n  placeholder?: null; // override react-datepickers placeholder prop\n};\n\nexport const DatePickerInput = React.forwardRef<\n  HTMLInputElement,\n  DatePickerInputProps\n>(\n  (\n    {\n      style,\n      label,\n      inputPlaceholder,\n      prepend,\n      feedback,\n      variant,\n      disabled,\n      calendarButtonTooltip,\n      hideCalendarButton,\n      disableLabelAnimation,\n      inputRef,\n      calendarButtonId,\n      forwardRef,\n      toggleCalendarGUI,\n      onKeyDownInput,\n      onBlurInput,\n      selectedDate,\n      setFocusToCalendarGUI,\n      setShouldFocusOnCalendarButtonAfterSelect,\n      calendarGUIIsOpen,\n      placeholder, // eslint-disable-line\n      onClick,\n      ...rest // forwarded props from react-datepicker\n    },\n    ref,\n  ) => {\n    React.useEffect(() => {\n      inputRef.current?.addEventListener('keydown', handleOnKeyDown);\n      inputRef.current?.addEventListener('blur', handleOnBlur);\n      inputRef.current?.addEventListener('focus', handleOnFocus);\n      return () => {\n        inputRef.current?.removeEventListener('keydown', handleOnKeyDown);\n        inputRef.current?.removeEventListener('blur', handleOnBlur);\n        inputRef.current?.removeEventListener('focus', handleOnFocus);\n      };\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [inputRef, selectedDate]);\n\n    function handleOnKeyDown(this: HTMLElement, event: KeyboardEvent) {\n      onKeyDownInput(event);\n    }\n    function handleOnBlur(this: HTMLElement, event: FocusEvent) {\n      onBlurInput(event);\n    }\n    const handleOnFocus = () =>\n      requestAnimationFrame(() => inputRef.current?.select());\n\n    const handleOnClickInputField = (\n      event: React.MouseEvent<HTMLInputElement, MouseEvent>,\n    ) => {\n      setShouldFocusOnCalendarButtonAfterSelect(false);\n      onClick && onClick(event);\n    };\n\n    const handleOnClickCalendarButton = () => {\n      toggleCalendarGUI();\n      setFocusToCalendarGUI();\n      setShouldFocusOnCalendarButtonAfterSelect(true);\n    };\n\n    return (\n      <TextField\n        style={style}\n        label={label}\n        placeholder={inputPlaceholder}\n        prepend={prepend}\n        feedback={feedback}\n        variant={variant}\n        disableLabelAnimation={disableLabelAnimation}\n        ref={mergeRefs(ref, inputRef, forwardRef)}\n        onClick={handleOnClickInputField}\n        append={\n          !hideCalendarButton && (\n            <Tooltip\n              placement=\"top\"\n              content={calendarButtonTooltip}\n              disableHoverListener={disabled}\n              disableFocusListener={disabled}\n            >\n              <IconButton\n                id={calendarButtonId}\n                type=\"button\"\n                onClick={handleOnClickCalendarButton}\n                tabIndex={calendarGUIIsOpen() ? -1 : 0}\n              >\n                <CalendarIcon />\n              </IconButton>\n            </Tooltip>\n          )\n        }\n        {...rest}\n      />\n    );\n  },\n);\n\nconst mergeRefs = <T extends HTMLElement>(\n  ...refs: React.MutableRefObject<T>[] | React.ForwardedRef<T>[]\n) => {\n  return (node: T) => {\n    for (const ref of refs) {\n      if (typeof ref === 'function') {\n        ref(node);\n      } else if (ref) ref.current = node;\n    }\n  };\n};\n","import React, { useRef, useState } from 'react';\nimport ReactDatePicker, {\n  default as ReactDatepicker,\n  ReactDatePickerProps,\n  registerLocale,\n} from 'react-datepicker';\nimport { parse, isSameDay, Locale } from 'date-fns';\nimport { nb } from 'date-fns/locale';\nimport classNames from 'classnames';\n\nimport { VariantType } from '@entur/form';\nimport { useRandomId } from '@entur/utils';\n\nimport { DatePickerHeader } from './DatePickerHeader';\nimport { DatePickerInput } from './DatePickerInput';\n\nimport './DatePicker.scss';\nimport 'react-datepicker/dist/react-datepicker.css';\n\nregisterLocale('nb', nb);\n\nexport type DatePickerProps = {\n  /** Hva som er den valgte datoen */\n  selectedDate: Date | null;\n  /** Kalles når datoen/tiden endres */\n  onChange: (\n    date: Date | null,\n    event: React.SyntheticEvent<any, Event> | undefined,\n  ) => void;\n  /**\n   * Kalles når en tast trykkes i inputfeltet\n   */\n  onKeyDown?: (event: KeyboardEvent) => void;\n  /**\n   * Datoformater som skal støttes. Første i listen er formatet alt input omgjøres til.\n   * Format-valg tilgjengelig her: https://date-fns.org/v2.28.0/docs/format\n   * OBS: Noen kombinasjoner av datoformater kan gi rar og uønsket oppførsel,\n   * test nøye ved endring\n   * @default \"['dd.MM.yyyy', 'ddMMyyyy', 'dd/MM/yyyy', 'ddMMyy']\"\n   */\n  dateFormats?: string[];\n  /**\n   * Locale fra date-fns som brukes av Datepicker-en\n   * @default nb\n   */\n  locale?: Locale;\n  /** Placeholder om ingen dato er valgt\n   * @default \"dd.mm.yyyy\"\n   */\n  placeholder?: string;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over DatePicker */\n  label: string;\n  /**\n   * Varselmelding, som vil komme under DatePicker\n   */\n  feedback?: string;\n  /** Valideringsvariant\n   */\n  variant?: VariantType;\n  /** Varselmelding for når datoen er på feil format\n   * @default \"Ugyldig dato\"\n   */\n  validationFeedback?: string;\n  /** Valideringsvariant for melding om feil datoformat\n   * @default \"error\"\n   */\n  validationVariant?: VariantType;\n  style?: React.CSSProperties;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Tekst eller ikon som kommer før inputfelter\n   * @default <DateIcon />\n   */\n  prepend?: React.ReactNode;\n  /**\n   * Tekst som vises ved hover på «Åpne kalender»-knappen\n   */\n  calendarButtonTooltip?: string;\n  /** Skjuler knapp for åpning av kalender\n   * @default false\n   */\n  hideCalendarButton?: boolean;\n  /** Skjuler tilbakemeldingsteksten ved feil dato-input\n   * @default false\n   */\n  hideValidation?: boolean;\n  /** Skjuler kalender-GUI-et\n   * @default false\n   */\n  hideCalendar?: boolean;\n  /** Viser kun kalender-popover-en\n   * @default false\n   */\n  inline?: boolean;\n  // For testing\n  'data-cy'?: any;\n} & Omit<\n  ReactDatePickerProps,\n  'selected' | 'customInput' | 'onChangeRaw' | 'dateFormat' | 'locale'\n>;\n\nexport const DatePicker = React.forwardRef<HTMLInputElement, DatePickerProps>(\n  (\n    {\n      style,\n      className,\n      selectedDate,\n      label,\n      placeholder = 'dd.mm.yyyy',\n      onChange,\n      onKeyDown = () => null,\n      dateFormats = ['dd.MM.yyyy', 'ddMMyyyy', 'dd/MM/yyyy', 'ddMMyy'],\n      minDate,\n      maxDate,\n      inline = false,\n      disabled,\n      prepend,\n      feedback = '',\n      variant,\n      validationFeedback = 'Ugyldig dato',\n      validationVariant = 'error',\n      disableLabelAnimation = false,\n      calendarButtonTooltip = 'Åpne\\xa0kalender',\n      hideCalendarButton = false,\n      hideCalendar = false,\n      hideValidation = false,\n      weekLabel = 'uke',\n      locale = nb,\n      open,\n      ...rest\n    },\n    ref,\n  ) => {\n    const datepickerId = useRandomId('eds-datepicker');\n\n    const datepickerRef = useRef<ReactDatePicker>(null);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const calendarButton = document.getElementById(datepickerId + '-button');\n\n    const [showValidation, setShowValidation] = useState(false);\n    const [\n      shouldFocusOnCalendarButtonAfterSelect,\n      setShouldFocusOnCalendarButtonAfterSelect,\n    ] = useState(false);\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    React.useEffect(() => validateInput(), [selectedDate]);\n\n    const handleOnChange = (\n      date: Date | null,\n      event: React.SyntheticEvent<any, Event> | undefined,\n    ): void => {\n      if (shouldFocusOnCalendarButtonAfterSelect && !hideCalendarButton) {\n        calendarButton?.focus();\n        setShouldFocusOnCalendarButtonAfterSelect(false);\n      } else inputRef.current?.focus();\n\n      onChange(date, event);\n    };\n\n    const handleOnKeyDown = (event: KeyboardEvent) => {\n      setShowValidation(false);\n\n      if (event.key === 'Enter') {\n        if (!datePickerGUIIsOpen()) {\n          // onBlurInput will validate if calendar is open\n          validateInput();\n          forceUpdateInputFormat();\n        }\n        focusAndSelectInputField();\n      } else if (event.key === 'Tab' && datePickerGUIIsOpen()) {\n        forceUpdateInputFormat();\n      } else if (event.key === 'Escape') {\n        forceUpdateInputFormat();\n        focusAndSelectInputField();\n        if (datePickerGUIIsOpen()) toggleCalendarGUI();\n      }\n      onKeyDown(event);\n    };\n\n    const handleOnClickOutside = () =>\n      setShouldFocusOnCalendarButtonAfterSelect(false);\n\n    const handleOnBlurInput = () => {\n      if (datePickerGUIIsOpen()) return;\n      validateInput();\n      forceUpdateInputFormat();\n    };\n\n    const validateInput = () => {\n      setShowValidation(false);\n      const inputValue = inputRef.current?.value;\n      if (!inputValue) return;\n\n      const inputValueParsedWithAllDateFormats = dateFormats.map(format =>\n        parse(inputValue, format, new Date(), {\n          locale: locale,\n        }),\n      );\n\n      const parsedDateFromInputIsTheSameAsSelectedDate =\n        selectedDate &&\n        inputValueParsedWithAllDateFormats.some(dateFormat =>\n          isSameDay(dateFormat, selectedDate),\n        );\n\n      if (parsedDateFromInputIsTheSameAsSelectedDate) {\n        // valid date inputted\n        setShowValidation(false);\n      } else {\n        // invalid date inputted\n        setShowValidation(true);\n      }\n    };\n\n    const getFeedbackAndVariant = (): {\n      feedback: string;\n      variant: VariantType | undefined;\n    } => {\n      if (feedback) return { feedback, variant };\n      if (!hideValidation && showValidation)\n        return { feedback: validationFeedback, variant: validationVariant };\n      return { feedback: '', variant: undefined };\n    };\n\n    const focusAndSelectInputField = () =>\n      requestAnimationFrame(() => inputRef.current?.select());\n\n    const forceUpdateInputFormat = () =>\n      datepickerRef.current?.setState({ inputValue: null });\n\n    const toggleCalendarGUI = () =>\n      datepickerRef.current?.setOpen(!datePickerGUIIsOpen());\n\n    // this focus function will fail if both an inline and a non-inline calendar is present in the same document\n    const setFocusToCalendarGUI = () => {\n      if (inline || hideCalendar || datePickerGUIIsOpen()) return;\n      // 1 frame delay to allow calendar to spawn\n      requestAnimationFrame(() => {\n        const dateToSetFocusTo = selectedDate\n          ? (document.getElementsByClassName(\n              'eds-datepicker__calender__day--selected',\n            )[0] as HTMLElement | null)\n          : (document.getElementsByClassName(\n              'eds-datepicker__calender__day--today',\n            )[0] as HTMLElement | null);\n        if (dateToSetFocusTo !== null) dateToSetFocusTo.focus();\n      });\n      setShouldFocusOnCalendarButtonAfterSelect(true);\n      setShowValidation(false);\n    };\n\n    const datePickerGUIIsOpen = () => datepickerRef.current?.isCalendarOpen();\n\n    return (\n      <>\n        <ReactDatepicker\n          selected={selectedDate}\n          minDate={minDate}\n          maxDate={maxDate}\n          dateFormat={dateFormats}\n          showWeekNumbers\n          weekLabel={weekLabel}\n          onChange={handleOnChange}\n          onClickOutside={handleOnClickOutside}\n          id={datepickerId}\n          ariaLabelledBy={datepickerId}\n          showPopperArrow={false}\n          locale={locale}\n          inline={inline}\n          disabled={disabled}\n          preventOpenOnFocus={true}\n          open={hideCalendar ? false : open}\n          ref={datepickerRef}\n          calendarClassName=\"eds-datepicker__calender\"\n          dayClassName={() => 'eds-datepicker__calender__day'}\n          weekDayClassName={() => 'eds-datepicker__calender__day-name'}\n          className={classNames(className, 'eds-datepicker__input')}\n          highlightDates={[\n            { 'eds-datepicker__calender__day--today': [new Date()] },\n            {\n              'eds-datepicker__calender__day--selected': selectedDate\n                ? [selectedDate]\n                : [],\n            },\n          ]}\n          renderCustomHeader={({\n            date,\n            changeYear,\n            changeMonth,\n            decreaseMonth,\n            increaseMonth,\n            prevMonthButtonDisabled,\n            nextMonthButtonDisabled,\n          }) => (\n            <DatePickerHeader\n              date={date}\n              changeYear={changeYear}\n              changeMonth={changeMonth}\n              increaseMonth={increaseMonth}\n              decreaseMonth={decreaseMonth}\n              prevMonthButtonDisabled={prevMonthButtonDisabled}\n              nextMonthButtonDisabled={nextMonthButtonDisabled}\n            />\n          )}\n          customInput={\n            <DatePickerInput\n              style={style}\n              label={label}\n              inputPlaceholder={placeholder}\n              calendarButtonTooltip={calendarButtonTooltip}\n              prepend={prepend}\n              feedback={getFeedbackAndVariant().feedback}\n              variant={getFeedbackAndVariant().variant}\n              inputRef={inputRef}\n              calendarButtonId={datepickerId + '-button'}\n              forwardRef={ref}\n              onKeyDownInput={handleOnKeyDown}\n              onBlurInput={handleOnBlurInput}\n              onFocus={undefined}\n              toggleCalendarGUI={toggleCalendarGUI}\n              setFocusToCalendarGUI={setFocusToCalendarGUI}\n              setShouldFocusOnCalendarButtonAfterSelect={\n                setShouldFocusOnCalendarButtonAfterSelect\n              }\n              calendarGUIIsOpen={datePickerGUIIsOpen}\n              disableLabelAnimation={disableLabelAnimation}\n              hideCalendarButton={hideCalendarButton}\n              selectedDate={selectedDate}\n            />\n          }\n          {...rest}\n        />\n      </>\n    );\n  },\n);\n","import React from 'react';\nimport {\n  BaseFormControl,\n  isFilled,\n  useInputGroupContext,\n  useVariant,\n  VariantType,\n} from '@entur/form';\nimport { DateIcon } from '@entur/icons';\nimport { useOnMount, useRandomId } from '@entur/utils';\n\nexport type NativeDatePickerProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over NativeDatePicker */\n  label: string;\n  /** Varselmelding, som vil komme under NativeDatePicker */\n  feedback?: string;\n  /** Valideringsvariant */\n  variant?: VariantType;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Tekst eller ikon som kommer før inputfelter\n   * @default <DateIcon />\n   */\n  prepend?: React.ReactNode;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const NativeDatePicker = React.forwardRef<\n  HTMLInputElement,\n  NativeDatePickerProps\n>(\n  (\n    {\n      className,\n      style,\n      label,\n      onChange,\n      feedback,\n      variant,\n      disableLabelAnimation,\n      prepend = <DateIcon inline />,\n      ...rest\n    },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const nativedatepickerId = useRandomId('eds-nativetimepicker');\n    return (\n      <BaseFormControl\n        style={style}\n        className={className}\n        prepend={prepend}\n        label={label}\n        feedback={feedback}\n        variant={variant}\n        labelId={nativedatepickerId}\n        disableLabelAnimation={disableLabelAnimation}\n        isFilled\n      >\n        <NativeDatePickerBase\n          onChange={onChange}\n          aria-labelledby={nativedatepickerId}\n          ref={ref}\n          variant={variant}\n          {...rest}\n        />\n      </BaseFormControl>\n    );\n  },\n);\n\ntype NativeDatePickerBaseProps = {\n  onChange?: any;\n  variant?: VariantType;\n} & React.DetailedHTMLProps<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  HTMLInputElement\n>;\n\nconst NativeDatePickerBase = React.forwardRef<\n  HTMLInputElement,\n  NativeDatePickerBaseProps\n>(({ onChange, variant, value, ...rest }, ref) => {\n  const contextVariant = useVariant();\n  const currentVariant = variant || contextVariant;\n  const { isFilled: isDatepickerFilled, setFilled: setFiller } =\n    useInputGroupContext();\n\n  useOnMount(() => {\n    setFiller && !isDatepickerFilled && setFiller(true);\n  });\n\n  React.useEffect(() => {\n    if (value) {\n      setFiller && !isDatepickerFilled && setFiller(true);\n    } else {\n      setFiller && isDatepickerFilled && setFiller(false);\n    }\n  }, [value, setFiller, isDatepickerFilled]);\n\n  const handleChange = (event: any) => {\n    if (isFilled(event.target)) {\n      setFiller && !isDatepickerFilled && setFiller(true);\n    } else {\n      setFiller && isDatepickerFilled && setFiller(false);\n    }\n    if (onChange) {\n      onChange(event);\n    }\n  };\n  return (\n    <input\n      ref={ref}\n      aria-invalid={currentVariant === 'error'}\n      type=\"date\"\n      className=\"eds-form-control eds-native-date-picker\"\n      onChange={handleChange}\n      value={value}\n      {...rest}\n    />\n  );\n});\n","import React from 'react';\nimport {\n  default as ReactDatepicker,\n  ReactDatePickerProps,\n  registerLocale,\n} from 'react-datepicker';\nimport classNames from 'classnames';\nimport {\n  BaseFormControl,\n  useInputGroupContext,\n  VariantType,\n} from '@entur/form';\nimport { LeftArrowIcon, RightArrowIcon } from '@entur/icons';\nimport { useOnMount, useRandomId } from '@entur/utils';\nimport { nb } from 'date-fns/locale';\nimport { add, sub } from 'date-fns';\nimport * as Popper from '@popperjs/core';\nimport './TimePicker.scss';\nregisterLocale('nb', nb);\n\nexport type TimePickerProps = {\n  /** Hva som er den valgte datoen */\n  selectedTime?: Date;\n  /** Kalles når datoen/tiden endres */\n  onChange: (\n    date: Date | null,\n    event: React.SyntheticEvent<any, Event>,\n  ) => void;\n  /** Placeholder om ingen dato er valgt\n   * @default \"Velg tid\"\n   */\n  placeholder?: string;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over TimePicker */\n  label: string;\n  /** Varselmelding, som vil komme under TimePicker */\n  feedback?: string;\n  /** Valideringsvariant */\n  variant?: VariantType;\n  style?: React.CSSProperties;\n  labelTooltip?: React.ReactNode;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Kalles ved klikk på pil venstre i TimePicker\n   * @default Trekker fra 30 minutter av den valgte tiden\n   */\n  onLeftArrowClick?: (selectedTime?: Date | null, e?: React.MouseEvent) => void;\n  /** Kalles ved klikk på pil høyre i TimePicker\n   * @default Legger til 30 minutter av den valgte tiden\n   */\n  onRightArrowClick?: (\n    selectedTime?: Date | null,\n    e?: React.MouseEvent,\n  ) => void;\n} & ReactDatePickerProps;\n\nexport const TimePicker = React.forwardRef<HTMLDivElement, TimePickerProps>(\n  (\n    {\n      selectedTime = null,\n      onChange,\n      placeholder = 'Velg tid',\n      disabled,\n      className,\n      style,\n      label,\n      labelTooltip,\n      feedback,\n      variant,\n      disableLabelAnimation,\n      locale = 'nb',\n      onLeftArrowClick = (selectedTime, event) =>\n        selectedTime && onChange(sub(selectedTime, { minutes: 30 }), event),\n      onRightArrowClick = (selectedTime, event) =>\n        selectedTime && onChange(add(selectedTime, { minutes: 30 }), event),\n      ...rest\n    },\n    ref,\n  ) => {\n    const timepickerId = useRandomId('eds-timepicker');\n    return (\n      <BaseFormControl\n        style={style}\n        ref={ref}\n        label={label}\n        labelId={timepickerId}\n        labelTooltip={labelTooltip}\n        variant={variant}\n        feedback={feedback}\n        disableLabelAnimation={disableLabelAnimation}\n        className=\"eds-timepicker-form-control\"\n        disabled={disabled}\n        prepend={\n          <TimePickerArrowButton\n            direction=\"left\"\n            tabIndex={-1}\n            onClick={(e: React.MouseEvent) => onLeftArrowClick(selectedTime, e)}\n            disabled={disabled}\n          />\n        }\n      >\n        <TimePickerBase\n          selectedTime={selectedTime}\n          onChange={onChange}\n          placeholder={placeholder}\n          className={className}\n          locale={locale}\n          ariaLabelledBy={timepickerId}\n          disabled={disabled}\n          {...rest}\n        />\n        <TimePickerArrowButton\n          direction=\"right\"\n          tabIndex={-1}\n          onClick={(e: React.MouseEvent) => onRightArrowClick(selectedTime, e)}\n          disabled={disabled}\n        />\n      </BaseFormControl>\n    );\n  },\n);\n\ntype TimePickerBaseProps = {\n  /** Hva som er den valgte datoen */\n  selectedTime?: Date | null;\n  /** Kalles når datoen/tiden endres */\n  onChange: (\n    date: Date | null,\n    event: React.SyntheticEvent<any, Event>,\n  ) => void;\n  /** Placeholder om ingen dato er valgt\n   * @default \"Velg tid\"\n   */\n  placeholder?: string;\n  /** Ekstra klassenavn */\n  className?: string;\n  [key: string]: any;\n} & ReactDatePickerProps;\n\nconst POPPER_MODIFIERS: Popper.StrictModifiers[] = [\n  {\n    name: 'offset',\n    enabled: true,\n    options: {\n      offset: [0, 0],\n    },\n  },\n];\nconst TimePickerBase: React.FC<TimePickerBaseProps> = ({\n  className,\n  onChange,\n  selectedTime,\n  placeholder,\n  timeFormat = 'HH:mm',\n  dateFormat = ['HH:mm', 'HHmm'],\n  ...rest\n}) => {\n  const { isFilled: isTimepickerFilled, setFilled: setFiller } =\n    useInputGroupContext();\n\n  useOnMount(() => {\n    if (selectedTime) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    }\n  });\n\n  React.useEffect(() => {\n    if (selectedTime) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n  }, [selectedTime, setFiller, isTimepickerFilled]);\n\n  const handleChange = (date: any, event: any) => {\n    if (date) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n    if (onChange) {\n      onChange(date, event);\n    }\n  };\n  return (\n    <ReactDatepicker\n      className={classNames(\n        'eds-form-control',\n        'eds-timepicker__input',\n        className,\n      )}\n      calendarClassName=\"eds-timepicker\"\n      selected={selectedTime}\n      onChange={handleChange}\n      dateFormat={dateFormat}\n      timeFormat={timeFormat}\n      showTimeSelect\n      showTimeInput={true}\n      showTimeSelectOnly\n      showPopperArrow={false}\n      placeholderText={placeholder}\n      popperClassName=\"eds-datepicker__popper\"\n      popperModifiers={POPPER_MODIFIERS}\n      open={false}\n      {...rest}\n    />\n  );\n};\n\ntype TimePickerArrowButtonProps = {\n  direction: 'left' | 'right';\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nconst TimePickerArrowButton: React.FC<TimePickerArrowButtonProps> = ({\n  direction,\n  ...rest\n}) => {\n  return (\n    <button\n      className={classNames(\n        'eds-timepicker__arrowbutton',\n        `eds-timepicker__arrowbutton--${direction}`,\n      )}\n      type=\"button\"\n      {...rest}\n    >\n      {direction === 'left' ? <LeftArrowIcon /> : <RightArrowIcon />}\n    </button>\n  );\n};\n","import React from 'react';\nimport {\n  BaseFormControl,\n  isFilled,\n  useInputGroupContext,\n  useVariant,\n  VariantType,\n} from '@entur/form';\nimport { ClockIcon } from '@entur/icons';\nimport { useOnMount, useRandomId } from '@entur/utils';\n\nexport type NativeTimePickerProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over NativeTimePicker */\n  label: string;\n  /** Varselmelding, som vil komme under NativeTimePicker */\n  feedback?: string;\n  /** Valideringsvariant */\n  variant?: VariantType;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Tekst eller ikon som kommer før inputfelter\n   * @default <ClockIcon />\n   */\n  prepend?: React.ReactNode;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const NativeTimePicker = React.forwardRef<\n  HTMLInputElement,\n  NativeTimePickerProps\n>(\n  (\n    {\n      className,\n      style,\n      onChange,\n      label,\n      feedback,\n      variant,\n      disableLabelAnimation,\n      prepend = <ClockIcon />,\n      ...rest\n    },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const nativetimepickerId = useRandomId('eds-nativetimepicker');\n    return (\n      <BaseFormControl\n        style={style}\n        className={className}\n        prepend={prepend}\n        label={label}\n        feedback={feedback}\n        variant={variant}\n        labelId={nativetimepickerId}\n        disableLabelAnimation={disableLabelAnimation}\n      >\n        <NativeTimePickerBase\n          onChange={onChange}\n          aria-labelledby={nativetimepickerId}\n          ref={ref}\n          {...rest}\n        />\n      </BaseFormControl>\n    );\n  },\n);\n\ntype NativeTimePickerBaseProps = {\n  variant?: VariantType;\n} & React.DetailedHTMLProps<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  HTMLInputElement\n>;\n\nconst NativeTimePickerBase = React.forwardRef<\n  HTMLInputElement,\n  NativeTimePickerBaseProps\n>(({ onChange, value, ...rest }, ref) => {\n  const contextVariant = useVariant();\n  const currentVariant = rest.variant || contextVariant;\n  const { isFilled: isTimepickerFilled, setFilled: setFiller } =\n    useInputGroupContext();\n\n  useOnMount(() => {\n    setFiller && !isTimepickerFilled && setFiller(true);\n  });\n\n  React.useEffect(() => {\n    if (value) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n  }, [value, setFiller, isTimepickerFilled]);\n\n  const handleChange = (event: any) => {\n    if (isFilled(event.target)) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n    if (onChange) {\n      onChange(event);\n    }\n  };\n  return (\n    <input\n      ref={ref}\n      aria-invalid={currentVariant === 'error'}\n      type=\"time\"\n      className=\"eds-form-control eds-native-date-picker\"\n      onChange={handleChange}\n      value={value}\n      {...rest}\n    />\n  );\n});\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('datepicker', 'form', 'icons');\n\nexport * from './DatePicker';\nexport * from './NativeDatePicker';\nexport * from './TimePicker';\nexport * from './NativeTimePicker';\n"],"names":["DatePickerHeader","date","decreaseMonth","increaseMonth","prevMonthButtonDisabled","nextMonthButtonDisabled","monthNames","locale","year","Date","getFullYear","monthList","Array","keys","formatter","Intl","DateTimeFormat","month","from","monthIndex","format","getMonthList","React","className","IconButton","type","onClick","disabled","LeftArrowIcon","Heading3","getMonth","RightArrowIcon","DatePickerInput","forwardRef","ref","style","label","inputPlaceholder","prepend","feedback","variant","calendarButtonTooltip","hideCalendarButton","disableLabelAnimation","inputRef","calendarButtonId","toggleCalendarGUI","onKeyDownInput","onBlurInput","selectedDate","setFocusToCalendarGUI","setShouldFocusOnCalendarButtonAfterSelect","calendarGUIIsOpen","rest","handleOnKeyDown","event","handleOnBlur","useEffect","current","addEventListener","handleOnFocus","removeEventListener","requestAnimationFrame","_inputRef$current7","select","TextField","placeholder","mergeRefs","append","Tooltip","placement","content","disableHoverListener","disableFocusListener","id","tabIndex","CalendarIcon","refs","node","registerLocale","nb","DatePicker","onChange","onKeyDown","dateFormats","minDate","maxDate","inline","validationFeedback","validationVariant","hideCalendar","hideValidation","weekLabel","open","datepickerId","useRandomId","datepickerRef","useRef","calendarButton","document","getElementById","useState","showValidation","setShowValidation","shouldFocusOnCalendarButtonAfterSelect","validateInput","inputValue","_inputRef$current2","value","inputValueParsedWithAllDateFormats","map","parse","parsedDateFromInputIsTheSameAsSelectedDate","some","dateFormat","isSameDay","getFeedbackAndVariant","undefined","focusAndSelectInputField","_inputRef$current3","forceUpdateInputFormat","_datepickerRef$curren","setState","_datepickerRef$curren2","setOpen","datePickerGUIIsOpen","_datepickerRef$curren3","isCalendarOpen","ReactDatepicker","selected","showWeekNumbers","focus","onClickOutside","ariaLabelledBy","showPopperArrow","preventOpenOnFocus","calendarClassName","dayClassName","weekDayClassName","classNames","highlightDates","renderCustomHeader","changeYear","changeMonth","customInput","key","onFocus","dateToSetFocusTo","getElementsByClassName","NativeDatePicker","DateIcon","nativedatepickerId","BaseFormControl","labelId","isFilled","NativeDatePickerBase","contextVariant","useVariant","currentVariant","useInputGroupContext","isDatepickerFilled","setFiller","setFilled","useOnMount","target","TimePicker","selectedTime","labelTooltip","onLeftArrowClick","sub","minutes","onRightArrowClick","add","timepickerId","TimePickerArrowButton","direction","e","TimePickerBase","POPPER_MODIFIERS","name","enabled","options","offset","timeFormat","isTimepickerFilled","showTimeSelect","showTimeInput","showTimeSelectOnly","placeholderText","popperClassName","popperModifiers","NativeTimePicker","ClockIcon","nativetimepickerId","NativeTimePickerBase","warnAboutMissingStyles"],"mappings":"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"}
+{"version":3,"file":"datepicker.cjs.production.min.js","sources":["../src/DatePicker/DatePickerHeader.tsx","../src/DatePicker/DatePickerInput.tsx","../src/DatePicker/DatePicker.tsx","../src/NativeDatePicker.tsx","../src/TimePicker.tsx","../src/NativeTimePicker.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { ReactDatePickerCustomHeaderProps } from 'react-datepicker';\n\nimport { LeftArrowIcon, RightArrowIcon } from '@entur/icons';\nimport { Heading3 } from '@entur/typography';\nimport { IconButton } from '@entur/button';\n\ntype DatePickerHeaderProps = {\n  nextMonthAriaLabel: string;\n  previousMonthAriaLabel: string;\n  locale: globalThis.Locale;\n} & Partial<ReactDatePickerCustomHeaderProps>;\n\nexport const DatePickerHeader = ({\n  date,\n  decreaseMonth,\n  increaseMonth,\n  prevMonthButtonDisabled,\n  nextMonthButtonDisabled,\n  nextMonthAriaLabel,\n  previousMonthAriaLabel,\n  locale,\n}: DatePickerHeaderProps) => {\n  const currentMonthIndex = date?.getMonth() ?? 0;\n  return (\n    <div className=\"eds-datepicker__calender__header\">\n      <IconButton\n        type=\"button\"\n        className=\"eds-datepicker__calender__header__month-button--left\"\n        onClick={decreaseMonth}\n        disabled={prevMonthButtonDisabled}\n        aria-label={`${previousMonthAriaLabel} (${getMonthName(\n          currentMonthIndex - 1,\n          locale,\n        )})`}\n      >\n        <LeftArrowIcon />\n      </IconButton>\n\n      <Heading3 className=\"eds-datepicker__calender__header__month-text\">\n        {getMonthName(currentMonthIndex, locale)}\n      </Heading3>\n      <Heading3 className=\"eds-datepicker__calender__header__month-text\">\n        {date?.getFullYear()}\n      </Heading3>\n\n      <IconButton\n        type=\"button\"\n        className=\"eds-datepicker__calender__header__month-button--right\"\n        onClick={increaseMonth}\n        disabled={nextMonthButtonDisabled}\n        aria-label={`${nextMonthAriaLabel} (${getMonthName(\n          currentMonthIndex + 1,\n          locale,\n        )})`}\n      >\n        <RightArrowIcon />\n      </IconButton>\n    </div>\n  );\n};\n\nfunction getMonthName(monthIndex: number, locale: globalThis.Locale) {\n  const year = new Date().getFullYear();\n  const formatter = new Intl.DateTimeFormat(locale.code, {\n    month: 'long',\n  });\n  return formatter.format(new Date(year, monthIndex));\n}\n","import React from 'react';\n\nimport { TextField, VariantType } from '@entur/form';\nimport { Tooltip } from '@entur/tooltip';\nimport { IconButton } from '@entur/button';\nimport { CalendarIcon } from '@entur/icons';\n\ntype DatePickerInputProps = {\n  style?: React.CSSProperties;\n  label: string;\n  inputPlaceholder: string;\n  prepend?: React.ReactNode;\n  feedback?: string;\n  variant?: VariantType;\n  disabled?: boolean;\n  disableLabelAnimation?: boolean;\n  calendarButtonTooltipOpen: string;\n  calendarButtonTooltipClose: string;\n  hideCalendarButton?: boolean;\n  inputRef: React.RefObject<HTMLInputElement>;\n  calendarButtonId: string;\n  forwardRef: React.ForwardedRef<HTMLInputElement>;\n  toggleCalendarGUI: () => void;\n  setFocusToCalendarGUI: () => void;\n  setShouldFocusOnCalendarButtonAfterSelect: React.Dispatch<\n    React.SetStateAction<boolean>\n  >;\n  onKeyDownInput: (event: KeyboardEvent) => any;\n  onBlurInput: (event: FocusEvent) => any;\n  calendarGUIIsOpen: () => boolean | undefined;\n  onClick?: React.MouseEventHandler<HTMLInputElement>; // react-datepicker's onClick prop\n  onFocus: undefined; // To prevent open on focus\n  selectedDate: Date | null; // Necessary to update component on state change\n  placeholder?: null; // override react-datepickers placeholder prop\n  'aria-labelledby'?: string;\n};\n\nexport const DatePickerInput = React.forwardRef<\n  HTMLInputElement,\n  DatePickerInputProps\n>(\n  (\n    {\n      style,\n      label,\n      inputPlaceholder,\n      prepend,\n      feedback,\n      variant,\n      disabled,\n      calendarButtonTooltipOpen,\n      calendarButtonTooltipClose,\n      hideCalendarButton,\n      disableLabelAnimation,\n      inputRef,\n      calendarButtonId,\n      forwardRef,\n      toggleCalendarGUI,\n      onKeyDownInput,\n      onBlurInput,\n      selectedDate,\n      setFocusToCalendarGUI,\n      setShouldFocusOnCalendarButtonAfterSelect,\n      calendarGUIIsOpen,\n      placeholder, // eslint-disable-line\n      onClick,\n      'aria-labelledby': ariaLabelledBy, // eslint-disable-line @typescript-eslint/no-unused-vars\n      ...rest // forwarded props from react-datepicker\n    },\n    ref,\n  ) => {\n    React.useEffect(() => {\n      inputRef.current?.addEventListener('keydown', handleOnKeyDown);\n      inputRef.current?.addEventListener('blur', handleOnBlur);\n      inputRef.current?.addEventListener('focus', handleOnFocus);\n      return () => {\n        inputRef.current?.removeEventListener('keydown', handleOnKeyDown);\n        inputRef.current?.removeEventListener('blur', handleOnBlur);\n        inputRef.current?.removeEventListener('focus', handleOnFocus);\n      };\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [inputRef, selectedDate]);\n\n    function handleOnKeyDown(this: HTMLElement, event: KeyboardEvent) {\n      onKeyDownInput(event);\n    }\n    function handleOnBlur(this: HTMLElement, event: FocusEvent) {\n      onBlurInput(event);\n    }\n    const handleOnFocus = () =>\n      requestAnimationFrame(() => inputRef.current?.select());\n\n    const handleOnClickInputField = (\n      event: React.MouseEvent<HTMLInputElement, MouseEvent>,\n    ) => {\n      setShouldFocusOnCalendarButtonAfterSelect(false);\n      onClick && onClick(event);\n    };\n\n    const handleOnClickCalendarButton = () => {\n      toggleCalendarGUI();\n      setFocusToCalendarGUI();\n      setShouldFocusOnCalendarButtonAfterSelect(true);\n    };\n\n    const calendarButtonAriaLabel = () => {\n      const buttonStateText = calendarGUIIsOpen()\n        ? calendarButtonTooltipClose\n        : calendarButtonTooltipOpen;\n      const currentSelectionText = selectedDate\n        ? `${inputRef.current?.value} valgt`\n        : 'Ingen dato valgt';\n      return `${buttonStateText}, ${currentSelectionText}`;\n    };\n\n    return (\n      <TextField\n        style={style}\n        label={label}\n        placeholder={inputPlaceholder}\n        prepend={prepend}\n        feedback={feedback}\n        variant={variant}\n        disableLabelAnimation={disableLabelAnimation}\n        ref={mergeRefs(ref, inputRef, forwardRef)}\n        onClick={handleOnClickInputField}\n        ariaAlertOnFeedback\n        append={\n          !hideCalendarButton && (\n            <Tooltip\n              placement=\"top\"\n              content={\n                calendarGUIIsOpen()\n                  ? calendarButtonTooltipClose\n                  : calendarButtonTooltipOpen\n              }\n              disableHoverListener={disabled}\n              disableFocusListener={disabled}\n            >\n              <IconButton\n                id={calendarButtonId}\n                type=\"button\"\n                onClick={handleOnClickCalendarButton}\n                tabIndex={calendarGUIIsOpen() ? -1 : 0}\n                aria-label={calendarButtonAriaLabel()}\n              >\n                <CalendarIcon />\n              </IconButton>\n            </Tooltip>\n          )\n        }\n        {...rest}\n      />\n    );\n  },\n);\n\nconst mergeRefs = <T extends HTMLElement>(\n  ...refs: React.MutableRefObject<T>[] | React.ForwardedRef<T>[]\n) => {\n  return (node: T) => {\n    for (const ref of refs) {\n      if (typeof ref === 'function') {\n        ref(node);\n      } else if (ref) ref.current = node;\n    }\n  };\n};\n","import React, { useRef, useState } from 'react';\nimport ReactDatePicker, {\n  default as ReactDatepicker,\n  ReactDatePickerProps,\n  registerLocale,\n} from 'react-datepicker';\nimport { parse, isSameDay, Locale } from 'date-fns';\nimport { nb } from 'date-fns/locale';\nimport classNames from 'classnames';\n\nimport { VariantType } from '@entur/form';\nimport { useRandomId } from '@entur/utils';\n\nimport { DatePickerHeader } from './DatePickerHeader';\nimport { DatePickerInput } from './DatePickerInput';\n\nimport './DatePicker.scss';\nimport 'react-datepicker/dist/react-datepicker.css';\n\nregisterLocale('nb', nb);\n\nexport type DatePickerProps = {\n  /** Hva som er den valgte datoen */\n  selectedDate: Date | null;\n  /** Kalles når datoen/tiden endres */\n  onChange: (\n    date: Date | null,\n    event: React.SyntheticEvent<any, Event> | undefined,\n  ) => void;\n  /**\n   * Kalles når en tast trykkes i inputfeltet\n   */\n  onKeyDown?: (event: KeyboardEvent) => void;\n  /**\n   * Datoformater som skal støttes. Første i listen er formatet alt input omgjøres til.\n   * Format-valg tilgjengelig her: https://date-fns.org/v2.28.0/docs/format\n   * OBS: Noen kombinasjoner av datoformater kan gi rar og uønsket oppførsel,\n   * test nøye ved endring\n   * @default \"['dd.MM.yyyy', 'ddMMyyyy', 'dd/MM/yyyy', 'ddMMyy']\"\n   */\n  dateFormats?: string[];\n  /**\n   * Locale fra date-fns som brukes av Datepicker-en\n   * @default nb\n   */\n  locale?: Locale;\n  /** Placeholder om ingen dato er valgt\n   * @default \"dd.mm.yyyy\"\n   */\n  placeholder?: string;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over DatePicker */\n  label: string;\n  /**\n   * Varselmelding, som vil komme under DatePicker\n   */\n  feedback?: string;\n  /** Valideringsvariant\n   */\n  variant?: VariantType;\n  /** Varselmelding for når datoen er på feil format\n   * @default \"Ugyldig dato\"\n   */\n  validationFeedback?: string;\n  /** Valideringsvariant for melding om feil datoformat\n   * @default \"error\"\n   */\n  validationVariant?: VariantType;\n  style?: React.CSSProperties;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Tekst eller ikon som kommer før inputfelter\n   * @default <DateIcon />\n   */\n  prepend?: React.ReactNode;\n  /**\n   * Tekst som vises når kalender ikke er åpen på «Åpne/Lukk kalender»-knappen ved hover\n   */\n  calendarButtonTooltipOpen?: string;\n  /**\n   * Tekst som vises når kalender er åpen på «Åpne/Lukk kalender»-knappen ved hover\n   */\n  calendarButtonTooltipClose?: string;\n  /** Skjuler knapp for åpning av kalender\n   * @default false\n   */\n  hideCalendarButton?: boolean;\n  /** Skjuler tilbakemeldingsteksten ved feil dato-input\n   * @default false\n   */\n  hideValidation?: boolean;\n  /** Skjuler kalender-GUI-et\n   * @default false\n   */\n  hideCalendar?: boolean;\n  /** Viser kun kalender-popover-en\n   * @default false\n   */\n  inline?: boolean;\n  /** Skjermlesertekst for forrige måned-knapen\n   * @default \"Forrige måned\"\n   */\n  previousMonthAriaLabel?: string;\n  /** Skjermlesertekst for neste måned-knapen\n   * @default \"Neste måned\"\n   */\n  nextMonthAriaLabel?: string;\n  /**\n   * Skjermlesertekst som leses før dato i kalenderGUI-et\n   * @default \"Velg\"\n   */\n  chooseDayAriaLabelPrefix?: string;\n  // For testing\n  'data-cy'?: any;\n} & Omit<\n  ReactDatePickerProps,\n  | 'selected'\n  | 'customInput'\n  | 'onChangeRaw'\n  | 'dateFormat'\n  | 'locale'\n  | 'previousMonthAriaLabel'\n  | 'nextMonthAriaLabel'\n>;\n\nexport const DatePicker = React.forwardRef<HTMLInputElement, DatePickerProps>(\n  (\n    {\n      style,\n      className,\n      selectedDate,\n      label,\n      placeholder = 'dd.mm.yyyy',\n      onChange,\n      onKeyDown = () => null,\n      dateFormats = ['dd.MM.yyyy', 'ddMMyyyy', 'dd/MM/yyyy', 'ddMMyy'],\n      minDate,\n      maxDate,\n      inline = false,\n      disabled,\n      prepend,\n      feedback = '',\n      variant,\n      validationFeedback = 'Ugyldig dato',\n      validationVariant = 'error',\n      disableLabelAnimation = false,\n      calendarButtonTooltipOpen = 'Åpne\\xa0kalender',\n      calendarButtonTooltipClose = 'Lukk\\xa0kalender',\n      hideCalendarButton = false,\n      hideCalendar = false,\n      hideValidation = false,\n      weekLabel = 'uke',\n      chooseDayAriaLabelPrefix = 'Velg',\n      previousMonthAriaLabel = 'Forrige måned',\n      nextMonthAriaLabel = 'Neste måned',\n      locale = nb,\n      open,\n      ...rest\n    },\n    ref,\n  ) => {\n    const datepickerId = useRandomId('eds-datepicker');\n\n    const datepickerRef = useRef<ReactDatePicker>(null);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const calendarButton = document.getElementById(datepickerId + '-button');\n\n    const [showValidation, setShowValidation] = useState(false);\n    const [\n      shouldFocusOnCalendarButtonAfterSelect,\n      setShouldFocusOnCalendarButtonAfterSelect,\n    ] = useState(false);\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    React.useEffect(() => validateInput(), [selectedDate]);\n\n    const handleOnChange = (\n      date: Date | null,\n      event: React.SyntheticEvent<any, Event> | undefined,\n    ): void => {\n      if (shouldFocusOnCalendarButtonAfterSelect && !hideCalendarButton) {\n        calendarButton?.focus();\n        setShouldFocusOnCalendarButtonAfterSelect(false);\n      } else inputRef.current?.focus();\n\n      onChange(date, event);\n    };\n\n    const handleOnKeyDown = (event: KeyboardEvent) => {\n      setShowValidation(false);\n\n      if (event.key === 'Enter') {\n        if (!datePickerGUIIsOpen()) {\n          // onBlurInput will validate if calendar is open\n          validateInput();\n          forceUpdateInputFormat();\n        }\n        focusAndSelectInputField();\n      } else if (event.key === 'Tab' && datePickerGUIIsOpen()) {\n        forceUpdateInputFormat();\n      } else if (event.key === 'Escape') {\n        forceUpdateInputFormat();\n        focusAndSelectInputField();\n        if (datePickerGUIIsOpen()) toggleCalendarGUI();\n      }\n      onKeyDown(event);\n    };\n\n    const handleOnClickOutside = () =>\n      setShouldFocusOnCalendarButtonAfterSelect(false);\n\n    const handleOnBlurInput = () => {\n      if (datePickerGUIIsOpen()) return;\n      validateInput();\n      forceUpdateInputFormat();\n    };\n\n    const validateInput = () => {\n      setShowValidation(false);\n      const inputValue = inputRef.current?.value;\n      if (!inputValue) return;\n\n      const inputValueParsedWithAllDateFormats = dateFormats.map(format =>\n        parse(inputValue, format, new Date(), {\n          locale: locale,\n        }),\n      );\n\n      const parsedDateFromInputIsTheSameAsSelectedDate =\n        selectedDate &&\n        inputValueParsedWithAllDateFormats.some(dateFormat =>\n          isSameDay(dateFormat, selectedDate),\n        );\n\n      if (parsedDateFromInputIsTheSameAsSelectedDate) {\n        // valid date inputted\n        setShowValidation(false);\n      } else {\n        // invalid date inputted\n        setShowValidation(true);\n      }\n    };\n\n    const getFeedbackAndVariant = (): {\n      feedback: string;\n      variant: VariantType | undefined;\n    } => {\n      if (feedback) return { feedback, variant };\n      if (!hideValidation && showValidation)\n        return { feedback: validationFeedback, variant: validationVariant };\n      return { feedback: '', variant: undefined };\n    };\n\n    const focusAndSelectInputField = () =>\n      requestAnimationFrame(() => inputRef.current?.select());\n\n    const forceUpdateInputFormat = () =>\n      datepickerRef.current?.setState({ inputValue: null });\n\n    const toggleCalendarGUI = () =>\n      datepickerRef.current?.setOpen(!datePickerGUIIsOpen());\n\n    const setFocusToCalendarGUI = () => {\n      if (inline || hideCalendar || datePickerGUIIsOpen()) return;\n      // 1 frame delay to allow calendar to spawn\n      requestAnimationFrame(() => {\n        const datepickerGUIWrapper =\n          // @ts-expect-error .calendar does actually exist in ReactDatePicker ref\n          datepickerRef.current?.calendar.componentNode;\n\n        const dateToSetFocusTo = selectedDate\n          ? (datepickerGUIWrapper.querySelector(\n              '.eds-datepicker__calender__day[tabindex=\"0\"]',\n            ) as HTMLElement | null)\n          : (datepickerGUIWrapper.querySelector(\n              '.eds-datepicker__calender__day[aria-current=\"date\"]',\n            ) as HTMLElement | null);\n        if (dateToSetFocusTo !== null) {\n          datepickerRef.current?.setBlur();\n          dateToSetFocusTo.focus({ preventScroll: true });\n        }\n      });\n      setShouldFocusOnCalendarButtonAfterSelect(true);\n      setShowValidation(false);\n    };\n\n    const datePickerGUIIsOpen = () => datepickerRef.current?.isCalendarOpen();\n\n    return (\n      <>\n        <ReactDatepicker\n          selected={selectedDate}\n          minDate={minDate}\n          maxDate={maxDate}\n          dateFormat={dateFormats}\n          showWeekNumbers\n          weekLabel={weekLabel}\n          onChange={handleOnChange}\n          onClickOutside={handleOnClickOutside}\n          id={datepickerId}\n          ariaLabelledBy={datepickerId}\n          showPopperArrow={false}\n          locale={locale}\n          inline={inline}\n          disabled={disabled}\n          preventOpenOnFocus={true}\n          chooseDayAriaLabelPrefix={chooseDayAriaLabelPrefix}\n          open={hideCalendar ? false : open}\n          ref={datepickerRef}\n          calendarClassName=\"eds-datepicker__calender\"\n          dayClassName={() => 'eds-datepicker__calender__day'}\n          weekDayClassName={() => 'eds-datepicker__calender__day-name'}\n          className={classNames(className, 'eds-datepicker__input')}\n          highlightDates={[\n            { 'eds-datepicker__calender__day--today': [new Date()] },\n            {\n              'eds-datepicker__calender__day--selected': selectedDate\n                ? [selectedDate]\n                : [],\n            },\n          ]}\n          renderCustomHeader={({\n            date,\n            changeYear,\n            changeMonth,\n            decreaseMonth,\n            increaseMonth,\n            prevMonthButtonDisabled,\n            nextMonthButtonDisabled,\n          }) => (\n            <DatePickerHeader\n              date={date}\n              changeYear={changeYear}\n              changeMonth={changeMonth}\n              increaseMonth={increaseMonth}\n              decreaseMonth={decreaseMonth}\n              prevMonthButtonDisabled={prevMonthButtonDisabled}\n              nextMonthButtonDisabled={nextMonthButtonDisabled}\n              previousMonthAriaLabel={previousMonthAriaLabel}\n              nextMonthAriaLabel={nextMonthAriaLabel}\n              locale={locale}\n            />\n          )}\n          customInput={\n            <DatePickerInput\n              style={style}\n              label={label}\n              inputPlaceholder={placeholder}\n              calendarButtonTooltipOpen={calendarButtonTooltipOpen}\n              calendarButtonTooltipClose={calendarButtonTooltipClose}\n              prepend={prepend}\n              feedback={getFeedbackAndVariant().feedback}\n              variant={getFeedbackAndVariant().variant}\n              inputRef={inputRef}\n              calendarButtonId={datepickerId + '-button'}\n              forwardRef={ref}\n              onKeyDownInput={handleOnKeyDown}\n              onBlurInput={handleOnBlurInput}\n              onFocus={undefined}\n              toggleCalendarGUI={toggleCalendarGUI}\n              setFocusToCalendarGUI={setFocusToCalendarGUI}\n              setShouldFocusOnCalendarButtonAfterSelect={\n                setShouldFocusOnCalendarButtonAfterSelect\n              }\n              calendarGUIIsOpen={datePickerGUIIsOpen}\n              disableLabelAnimation={disableLabelAnimation}\n              hideCalendarButton={hideCalendarButton}\n              selectedDate={selectedDate}\n            />\n          }\n          {...rest}\n        />\n      </>\n    );\n  },\n);\n","import React from 'react';\nimport {\n  BaseFormControl,\n  isFilled,\n  useInputGroupContext,\n  useVariant,\n  VariantType,\n} from '@entur/form';\nimport { DateIcon } from '@entur/icons';\nimport { useOnMount, useRandomId } from '@entur/utils';\n\nexport type NativeDatePickerProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over NativeDatePicker */\n  label: string;\n  /** Varselmelding, som vil komme under NativeDatePicker */\n  feedback?: string;\n  /** Valideringsvariant */\n  variant?: VariantType;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Tekst eller ikon som kommer før inputfelter\n   * @default <DateIcon />\n   */\n  prepend?: React.ReactNode;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const NativeDatePicker = React.forwardRef<\n  HTMLInputElement,\n  NativeDatePickerProps\n>(\n  (\n    {\n      className,\n      style,\n      label,\n      onChange,\n      feedback,\n      variant,\n      disableLabelAnimation,\n      prepend = <DateIcon inline />,\n      ...rest\n    },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const nativedatepickerId = useRandomId('eds-nativetimepicker');\n    return (\n      <BaseFormControl\n        style={style}\n        className={className}\n        prepend={prepend}\n        label={label}\n        feedback={feedback}\n        variant={variant}\n        labelId={nativedatepickerId}\n        disableLabelAnimation={disableLabelAnimation}\n        isFilled\n      >\n        <NativeDatePickerBase\n          onChange={onChange}\n          aria-labelledby={nativedatepickerId}\n          ref={ref}\n          variant={variant}\n          {...rest}\n        />\n      </BaseFormControl>\n    );\n  },\n);\n\ntype NativeDatePickerBaseProps = {\n  onChange?: any;\n  variant?: VariantType;\n} & React.DetailedHTMLProps<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  HTMLInputElement\n>;\n\nconst NativeDatePickerBase = React.forwardRef<\n  HTMLInputElement,\n  NativeDatePickerBaseProps\n>(({ onChange, variant, value, ...rest }, ref) => {\n  const contextVariant = useVariant();\n  const currentVariant = variant || contextVariant;\n  const { isFilled: isDatepickerFilled, setFilled: setFiller } =\n    useInputGroupContext();\n\n  useOnMount(() => {\n    setFiller && !isDatepickerFilled && setFiller(true);\n  });\n\n  React.useEffect(() => {\n    if (value) {\n      setFiller && !isDatepickerFilled && setFiller(true);\n    } else {\n      setFiller && isDatepickerFilled && setFiller(false);\n    }\n  }, [value, setFiller, isDatepickerFilled]);\n\n  const handleChange = (event: any) => {\n    if (isFilled(event.target)) {\n      setFiller && !isDatepickerFilled && setFiller(true);\n    } else {\n      setFiller && isDatepickerFilled && setFiller(false);\n    }\n    if (onChange) {\n      onChange(event);\n    }\n  };\n  return (\n    <input\n      ref={ref}\n      aria-invalid={currentVariant === 'error'}\n      type=\"date\"\n      className=\"eds-form-control eds-native-date-picker\"\n      onChange={handleChange}\n      value={value}\n      {...rest}\n    />\n  );\n});\n","import React from 'react';\nimport {\n  default as ReactDatepicker,\n  ReactDatePickerProps,\n  registerLocale,\n} from 'react-datepicker';\nimport classNames from 'classnames';\nimport {\n  BaseFormControl,\n  useInputGroupContext,\n  VariantType,\n} from '@entur/form';\nimport { LeftArrowIcon, RightArrowIcon } from '@entur/icons';\nimport { useOnMount, useRandomId } from '@entur/utils';\nimport { nb } from 'date-fns/locale';\nimport { add, sub } from 'date-fns';\nimport * as Popper from '@popperjs/core';\nimport './TimePicker.scss';\nregisterLocale('nb', nb);\n\nexport type TimePickerProps = {\n  /** Hva som er den valgte datoen */\n  selectedTime?: Date;\n  /** Kalles når datoen/tiden endres */\n  onChange: (\n    date: Date | null,\n    event: React.SyntheticEvent<any, Event>,\n  ) => void;\n  /** Placeholder om ingen dato er valgt\n   * @default \"Velg tid\"\n   */\n  placeholder?: string;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over TimePicker */\n  label: string;\n  /** Varselmelding, som vil komme under TimePicker */\n  feedback?: string;\n  /** Valideringsvariant */\n  variant?: VariantType;\n  style?: React.CSSProperties;\n  labelTooltip?: React.ReactNode;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Kalles ved klikk på pil venstre i TimePicker\n   * @default Trekker fra 30 minutter av den valgte tiden\n   */\n  onLeftArrowClick?: (selectedTime?: Date | null, e?: React.MouseEvent) => void;\n  /** Kalles ved klikk på pil høyre i TimePicker\n   * @default Legger til 30 minutter av den valgte tiden\n   */\n  onRightArrowClick?: (\n    selectedTime?: Date | null,\n    e?: React.MouseEvent,\n  ) => void;\n} & ReactDatePickerProps;\n\nexport const TimePicker = React.forwardRef<HTMLDivElement, TimePickerProps>(\n  (\n    {\n      selectedTime = null,\n      onChange,\n      placeholder = 'Velg tid',\n      disabled,\n      className,\n      style,\n      label,\n      labelTooltip,\n      feedback,\n      variant,\n      disableLabelAnimation,\n      locale = 'nb',\n      onLeftArrowClick = (selectedTime, event) =>\n        selectedTime && onChange(sub(selectedTime, { minutes: 30 }), event),\n      onRightArrowClick = (selectedTime, event) =>\n        selectedTime && onChange(add(selectedTime, { minutes: 30 }), event),\n      ...rest\n    },\n    ref,\n  ) => {\n    const timepickerId = useRandomId('eds-timepicker');\n    return (\n      <BaseFormControl\n        style={style}\n        ref={ref}\n        label={label}\n        labelId={timepickerId}\n        labelTooltip={labelTooltip}\n        variant={variant}\n        feedback={feedback}\n        disableLabelAnimation={disableLabelAnimation}\n        className=\"eds-timepicker-form-control\"\n        disabled={disabled}\n        prepend={\n          <TimePickerArrowButton\n            direction=\"left\"\n            tabIndex={-1}\n            onClick={(e: React.MouseEvent) => onLeftArrowClick(selectedTime, e)}\n            disabled={disabled}\n          />\n        }\n      >\n        <TimePickerBase\n          selectedTime={selectedTime}\n          onChange={onChange}\n          placeholder={placeholder}\n          className={className}\n          locale={locale}\n          ariaLabelledBy={timepickerId}\n          disabled={disabled}\n          {...rest}\n        />\n        <TimePickerArrowButton\n          direction=\"right\"\n          tabIndex={-1}\n          onClick={(e: React.MouseEvent) => onRightArrowClick(selectedTime, e)}\n          disabled={disabled}\n        />\n      </BaseFormControl>\n    );\n  },\n);\n\ntype TimePickerBaseProps = {\n  /** Hva som er den valgte datoen */\n  selectedTime?: Date | null;\n  /** Kalles når datoen/tiden endres */\n  onChange: (\n    date: Date | null,\n    event: React.SyntheticEvent<any, Event>,\n  ) => void;\n  /** Placeholder om ingen dato er valgt\n   * @default \"Velg tid\"\n   */\n  placeholder?: string;\n  /** Ekstra klassenavn */\n  className?: string;\n  [key: string]: any;\n} & ReactDatePickerProps;\n\nconst POPPER_MODIFIERS: Popper.StrictModifiers[] = [\n  {\n    name: 'offset',\n    enabled: true,\n    options: {\n      offset: [0, 0],\n    },\n  },\n];\nconst TimePickerBase: React.FC<TimePickerBaseProps> = ({\n  className,\n  onChange,\n  selectedTime,\n  placeholder,\n  timeFormat = 'HH:mm',\n  dateFormat = ['HH:mm', 'HHmm'],\n  ...rest\n}) => {\n  const { isFilled: isTimepickerFilled, setFilled: setFiller } =\n    useInputGroupContext();\n\n  useOnMount(() => {\n    if (selectedTime) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    }\n  });\n\n  React.useEffect(() => {\n    if (selectedTime) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n  }, [selectedTime, setFiller, isTimepickerFilled]);\n\n  const handleChange = (date: any, event: any) => {\n    if (date) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n    if (onChange) {\n      onChange(date, event);\n    }\n  };\n  return (\n    <ReactDatepicker\n      className={classNames(\n        'eds-form-control',\n        'eds-timepicker__input',\n        className,\n      )}\n      calendarClassName=\"eds-timepicker\"\n      selected={selectedTime}\n      onChange={handleChange}\n      dateFormat={dateFormat}\n      timeFormat={timeFormat}\n      showTimeSelect\n      showTimeInput={true}\n      showTimeSelectOnly\n      showPopperArrow={false}\n      placeholderText={placeholder}\n      popperClassName=\"eds-datepicker__popper\"\n      popperModifiers={POPPER_MODIFIERS}\n      open={false}\n      {...rest}\n    />\n  );\n};\n\ntype TimePickerArrowButtonProps = {\n  direction: 'left' | 'right';\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nconst TimePickerArrowButton: React.FC<TimePickerArrowButtonProps> = ({\n  direction,\n  ...rest\n}) => {\n  return (\n    <button\n      className={classNames(\n        'eds-timepicker__arrowbutton',\n        `eds-timepicker__arrowbutton--${direction}`,\n      )}\n      type=\"button\"\n      {...rest}\n    >\n      {direction === 'left' ? <LeftArrowIcon /> : <RightArrowIcon />}\n    </button>\n  );\n};\n","import React from 'react';\nimport {\n  BaseFormControl,\n  isFilled,\n  useInputGroupContext,\n  useVariant,\n  VariantType,\n} from '@entur/form';\nimport { ClockIcon } from '@entur/icons';\nimport { useOnMount, useRandomId } from '@entur/utils';\n\nexport type NativeTimePickerProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label over NativeTimePicker */\n  label: string;\n  /** Varselmelding, som vil komme under NativeTimePicker */\n  feedback?: string;\n  /** Valideringsvariant */\n  variant?: VariantType;\n  /** Plasserer labelen statisk på toppen av inputfeltet\n   * @default false\n   */\n  disableLabelAnimation?: boolean;\n  /** Tekst eller ikon som kommer før inputfelter\n   * @default <ClockIcon />\n   */\n  prepend?: React.ReactNode;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const NativeTimePicker = React.forwardRef<\n  HTMLInputElement,\n  NativeTimePickerProps\n>(\n  (\n    {\n      className,\n      style,\n      onChange,\n      label,\n      feedback,\n      variant,\n      disableLabelAnimation,\n      prepend = <ClockIcon />,\n      ...rest\n    },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const nativetimepickerId = useRandomId('eds-nativetimepicker');\n    return (\n      <BaseFormControl\n        style={style}\n        className={className}\n        prepend={prepend}\n        label={label}\n        feedback={feedback}\n        variant={variant}\n        labelId={nativetimepickerId}\n        disableLabelAnimation={disableLabelAnimation}\n      >\n        <NativeTimePickerBase\n          onChange={onChange}\n          aria-labelledby={nativetimepickerId}\n          ref={ref}\n          {...rest}\n        />\n      </BaseFormControl>\n    );\n  },\n);\n\ntype NativeTimePickerBaseProps = {\n  variant?: VariantType;\n} & React.DetailedHTMLProps<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  HTMLInputElement\n>;\n\nconst NativeTimePickerBase = React.forwardRef<\n  HTMLInputElement,\n  NativeTimePickerBaseProps\n>(({ onChange, value, ...rest }, ref) => {\n  const contextVariant = useVariant();\n  const currentVariant = rest.variant || contextVariant;\n  const { isFilled: isTimepickerFilled, setFilled: setFiller } =\n    useInputGroupContext();\n\n  useOnMount(() => {\n    setFiller && !isTimepickerFilled && setFiller(true);\n  });\n\n  React.useEffect(() => {\n    if (value) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n  }, [value, setFiller, isTimepickerFilled]);\n\n  const handleChange = (event: any) => {\n    if (isFilled(event.target)) {\n      setFiller && !isTimepickerFilled && setFiller(true);\n    } else {\n      setFiller && isTimepickerFilled && setFiller(false);\n    }\n    if (onChange) {\n      onChange(event);\n    }\n  };\n  return (\n    <input\n      ref={ref}\n      aria-invalid={currentVariant === 'error'}\n      type=\"time\"\n      className=\"eds-form-control eds-native-date-picker\"\n      onChange={handleChange}\n      value={value}\n      {...rest}\n    />\n  );\n});\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('datepicker', 'form', 'icons');\n\nexport * from './DatePicker';\nexport * from './NativeDatePicker';\nexport * from './TimePicker';\nexport * from './NativeTimePicker';\n"],"names":["DatePickerHeader","date","decreaseMonth","increaseMonth","prevMonthButtonDisabled","nextMonthButtonDisabled","nextMonthAriaLabel","previousMonthAriaLabel","locale","currentMonthIndex","getMonth","React","className","IconButton","type","onClick","disabled","getMonthName","LeftArrowIcon","Heading3","getFullYear","RightArrowIcon","monthIndex","year","Date","Intl","DateTimeFormat","code","month","format","DatePickerInput","forwardRef","ref","style","label","inputPlaceholder","prepend","feedback","variant","calendarButtonTooltipOpen","calendarButtonTooltipClose","hideCalendarButton","disableLabelAnimation","inputRef","calendarButtonId","toggleCalendarGUI","onKeyDownInput","onBlurInput","selectedDate","setFocusToCalendarGUI","setShouldFocusOnCalendarButtonAfterSelect","calendarGUIIsOpen","rest","handleOnKeyDown","event","handleOnBlur","useEffect","current","addEventListener","handleOnFocus","removeEventListener","requestAnimationFrame","_inputRef$current7","select","TextField","placeholder","mergeRefs","ariaAlertOnFeedback","append","Tooltip","placement","content","disableHoverListener","disableFocusListener","id","tabIndex","_inputRef$current8","value","CalendarIcon","refs","node","registerLocale","nb","DatePicker","onChange","onKeyDown","dateFormats","minDate","maxDate","inline","validationFeedback","validationVariant","hideCalendar","hideValidation","weekLabel","chooseDayAriaLabelPrefix","open","datepickerId","useRandomId","datepickerRef","useRef","calendarButton","document","getElementById","useState","showValidation","setShowValidation","shouldFocusOnCalendarButtonAfterSelect","validateInput","inputValue","_inputRef$current2","inputValueParsedWithAllDateFormats","map","parse","parsedDateFromInputIsTheSameAsSelectedDate","some","dateFormat","isSameDay","getFeedbackAndVariant","undefined","focusAndSelectInputField","_inputRef$current3","forceUpdateInputFormat","_datepickerRef$curren","setState","_datepickerRef$curren2","setOpen","datePickerGUIIsOpen","_datepickerRef$curren5","isCalendarOpen","ReactDatepicker","selected","showWeekNumbers","focus","onClickOutside","ariaLabelledBy","showPopperArrow","preventOpenOnFocus","calendarClassName","dayClassName","weekDayClassName","classNames","highlightDates","renderCustomHeader","changeYear","changeMonth","customInput","key","onFocus","dateToSetFocusTo","_datepickerRef$curren3","calendar","componentNode","querySelector","setBlur","preventScroll","NativeDatePicker","DateIcon","nativedatepickerId","BaseFormControl","labelId","isFilled","NativeDatePickerBase","contextVariant","useVariant","currentVariant","useInputGroupContext","isDatepickerFilled","setFiller","setFilled","useOnMount","target","TimePicker","selectedTime","labelTooltip","onLeftArrowClick","sub","minutes","onRightArrowClick","add","timepickerId","TimePickerArrowButton","direction","e","TimePickerBase","POPPER_MODIFIERS","name","enabled","options","offset","timeFormat","isTimepickerFilled","showTimeSelect","showTimeInput","showTimeSelectOnly","placeholderText","popperClassName","popperModifiers","NativeTimePicker","ClockIcon","nativetimepickerId","NativeTimePickerBase","warnAboutMissingStyles"],"mappings":"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"}

package/dist/datepicker.esm.js

@@ -89,46 +89,41 @@ var DatePickerHeader = function DatePickerHeader(_ref) {
       decreaseMonth = _ref.decreaseMonth,
       increaseMonth = _ref.increaseMonth,
       prevMonthButtonDisabled = _ref.prevMonthButtonDisabled,
-      nextMonthButtonDisabled = _ref.nextMonthButtonDisabled;
-  var monthNames = getMonthList();
+      nextMonthButtonDisabled = _ref.nextMonthButtonDisabled,
+      nextMonthAriaLabel = _ref.nextMonthAriaLabel,
+      previousMonthAriaLabel = _ref.previousMonthAriaLabel,
+      locale = _ref.locale;
+  var currentMonthIndex = (_date$getMonth = date == null ? void 0 : date.getMonth()) != null ? _date$getMonth : 0;
   return React.createElement("div", {
     className: "eds-datepicker__calender__header"
   }, React.createElement(IconButton, {
     type: "button",
     className: "eds-datepicker__calender__header__month-button--left",
     onClick: decreaseMonth,
-    disabled: prevMonthButtonDisabled
+    disabled: prevMonthButtonDisabled,
+    "aria-label": previousMonthAriaLabel + " (" + getMonthName(currentMonthIndex - 1, locale) + ")"
   }, React.createElement(LeftArrowIcon, null)), React.createElement(Heading3, {
     className: "eds-datepicker__calender__header__month-text"
-  }, monthNames[(_date$getMonth = date == null ? void 0 : date.getMonth()) != null ? _date$getMonth : 0]), React.createElement(Heading3, {
+  }, getMonthName(currentMonthIndex, locale)), React.createElement(Heading3, {
     className: "eds-datepicker__calender__header__month-text"
   }, date == null ? void 0 : date.getFullYear()), React.createElement(IconButton, {
     type: "button",
     className: "eds-datepicker__calender__header__month-button--right",
     onClick: increaseMonth,
-    disabled: nextMonthButtonDisabled
+    disabled: nextMonthButtonDisabled,
+    "aria-label": nextMonthAriaLabel + " (" + getMonthName(currentMonthIndex + 1, locale) + ")"
   }, React.createElement(RightArrowIcon, null)));
 };
 
-function getMonthList(locale) {
-  if (locale === void 0) {
-    locale = 'nb';
-  }
-
+function getMonthName(monthIndex, locale) {
   var year = new Date().getFullYear();
-  var monthList = Array(12).keys();
-  var formatter = new Intl.DateTimeFormat(locale, {
+  var formatter = new Intl.DateTimeFormat(locale.code, {
     month: 'long'
   });
-
-  var getMonthName = function getMonthName(monthIndex) {
-    return formatter.format(new Date(year, monthIndex));
-  };
-
-  return Array.from(monthList, getMonthName);
+  return formatter.format(new Date(year, monthIndex));
 }
 
-var _excluded$4 = ["style", "label", "inputPlaceholder", "prepend", "feedback", "variant", "disabled", "calendarButtonTooltip", "hideCalendarButton", "disableLabelAnimation", "inputRef", "calendarButtonId", "forwardRef", "toggleCalendarGUI", "onKeyDownInput", "onBlurInput", "selectedDate", "setFocusToCalendarGUI", "setShouldFocusOnCalendarButtonAfterSelect", "calendarGUIIsOpen", "placeholder", "onClick"];
+var _excluded$4 = ["style", "label", "inputPlaceholder", "prepend", "feedback", "variant", "disabled", "calendarButtonTooltipOpen", "calendarButtonTooltipClose", "hideCalendarButton", "disableLabelAnimation", "inputRef", "calendarButtonId", "forwardRef", "toggleCalendarGUI", "onKeyDownInput", "onBlurInput", "selectedDate", "setFocusToCalendarGUI", "setShouldFocusOnCalendarButtonAfterSelect", "calendarGUIIsOpen", "placeholder", "onClick", "aria-labelledby"];
 var DatePickerInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var style = _ref.style,
       label = _ref.label,
@@ -137,7 +132,8 @@ var DatePickerInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       feedback = _ref.feedback,
       variant = _ref.variant,
       disabled = _ref.disabled,
-      calendarButtonTooltip = _ref.calendarButtonTooltip,
+      calendarButtonTooltipOpen = _ref.calendarButtonTooltipOpen,
+      calendarButtonTooltipClose = _ref.calendarButtonTooltipClose,
       hideCalendarButton = _ref.hideCalendarButton,
       disableLabelAnimation = _ref.disableLabelAnimation,
       inputRef = _ref.inputRef,
@@ -195,6 +191,14 @@ var DatePickerInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     setShouldFocusOnCalendarButtonAfterSelect(true);
   };
 
+  var calendarButtonAriaLabel = function calendarButtonAriaLabel() {
+    var _inputRef$current8;
+
+    var buttonStateText = calendarGUIIsOpen() ? calendarButtonTooltipClose : calendarButtonTooltipOpen;
+    var currentSelectionText = selectedDate ? ((_inputRef$current8 = inputRef.current) == null ? void 0 : _inputRef$current8.value) + " valgt" : 'Ingen dato valgt';
+    return buttonStateText + ", " + currentSelectionText;
+  };
+
   return React.createElement(TextField, _extends({
     style: style,
     label: label,
@@ -205,16 +209,18 @@ var DatePickerInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     disableLabelAnimation: disableLabelAnimation,
     ref: mergeRefs(ref, inputRef, forwardRef),
     onClick: handleOnClickInputField,
+    ariaAlertOnFeedback: true,
     append: !hideCalendarButton && React.createElement(Tooltip, {
       placement: "top",
-      content: calendarButtonTooltip,
+      content: calendarGUIIsOpen() ? calendarButtonTooltipClose : calendarButtonTooltipOpen,
       disableHoverListener: disabled,
       disableFocusListener: disabled
     }, React.createElement(IconButton, {
       id: calendarButtonId,
       type: "button",
       onClick: handleOnClickCalendarButton,
-      tabIndex: calendarGUIIsOpen() ? -1 : 0
+      tabIndex: calendarGUIIsOpen() ? -1 : 0,
+      "aria-label": calendarButtonAriaLabel()
     }, React.createElement(CalendarIcon, null)))
   }, rest));
 });
@@ -235,7 +241,7 @@ var mergeRefs = function mergeRefs() {
   };
 };
 
-var _excluded$3 = ["style", "className", "selectedDate", "label", "placeholder", "onChange", "onKeyDown", "dateFormats", "minDate", "maxDate", "inline", "disabled", "prepend", "feedback", "variant", "validationFeedback", "validationVariant", "disableLabelAnimation", "calendarButtonTooltip", "hideCalendarButton", "hideCalendar", "hideValidation", "weekLabel", "locale", "open"];
+var _excluded$3 = ["style", "className", "selectedDate", "label", "placeholder", "onChange", "onKeyDown", "dateFormats", "minDate", "maxDate", "inline", "disabled", "prepend", "feedback", "variant", "validationFeedback", "validationVariant", "disableLabelAnimation", "calendarButtonTooltipOpen", "calendarButtonTooltipClose", "hideCalendarButton", "hideCalendar", "hideValidation", "weekLabel", "chooseDayAriaLabelPrefix", "previousMonthAriaLabel", "nextMonthAriaLabel", "locale", "open"];
 registerLocale('nb', nb);
 var DatePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var style = _ref.style,
@@ -266,8 +272,10 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       validationVariant = _ref$validationVarian === void 0 ? 'error' : _ref$validationVarian,
       _ref$disableLabelAnim = _ref.disableLabelAnimation,
       disableLabelAnimation = _ref$disableLabelAnim === void 0 ? false : _ref$disableLabelAnim,
-      _ref$calendarButtonTo = _ref.calendarButtonTooltip,
-      calendarButtonTooltip = _ref$calendarButtonTo === void 0 ? 'Åpne\xa0kalender' : _ref$calendarButtonTo,
+      _ref$calendarButtonTo = _ref.calendarButtonTooltipOpen,
+      calendarButtonTooltipOpen = _ref$calendarButtonTo === void 0 ? 'Åpne\xa0kalender' : _ref$calendarButtonTo,
+      _ref$calendarButtonTo2 = _ref.calendarButtonTooltipClose,
+      calendarButtonTooltipClose = _ref$calendarButtonTo2 === void 0 ? 'Lukk\xa0kalender' : _ref$calendarButtonTo2,
       _ref$hideCalendarButt = _ref.hideCalendarButton,
       hideCalendarButton = _ref$hideCalendarButt === void 0 ? false : _ref$hideCalendarButt,
       _ref$hideCalendar = _ref.hideCalendar,
@@ -276,6 +284,12 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       hideValidation = _ref$hideValidation === void 0 ? false : _ref$hideValidation,
       _ref$weekLabel = _ref.weekLabel,
       weekLabel = _ref$weekLabel === void 0 ? 'uke' : _ref$weekLabel,
+      _ref$chooseDayAriaLab = _ref.chooseDayAriaLabelPrefix,
+      chooseDayAriaLabelPrefix = _ref$chooseDayAriaLab === void 0 ? 'Velg' : _ref$chooseDayAriaLab,
+      _ref$previousMonthAri = _ref.previousMonthAriaLabel,
+      previousMonthAriaLabel = _ref$previousMonthAri === void 0 ? 'Forrige måned' : _ref$previousMonthAri,
+      _ref$nextMonthAriaLab = _ref.nextMonthAriaLabel,
+      nextMonthAriaLabel = _ref$nextMonthAriaLab === void 0 ? 'Neste måned' : _ref$nextMonthAriaLab,
       _ref$locale = _ref.locale,
       locale = _ref$locale === void 0 ? nb : _ref$locale,
       open = _ref.open,
@@ -401,24 +415,35 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var _datepickerRef$curren2;
 
     return (_datepickerRef$curren2 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren2.setOpen(!datePickerGUIIsOpen());
-  }; // this focus function will fail if both an inline and a non-inline calendar is present in the same document
-
+  };
 
   var setFocusToCalendarGUI = function setFocusToCalendarGUI() {
     if (inline || hideCalendar || datePickerGUIIsOpen()) return; // 1 frame delay to allow calendar to spawn
 
     requestAnimationFrame(function () {
-      var dateToSetFocusTo = selectedDate ? document.getElementsByClassName('eds-datepicker__calender__day--selected')[0] : document.getElementsByClassName('eds-datepicker__calender__day--today')[0];
-      if (dateToSetFocusTo !== null) dateToSetFocusTo.focus();
+      var _datepickerRef$curren3;
+
+      var datepickerGUIWrapper = // @ts-expect-error .calendar does actually exist in ReactDatePicker ref
+      (_datepickerRef$curren3 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren3.calendar.componentNode;
+      var dateToSetFocusTo = selectedDate ? datepickerGUIWrapper.querySelector('.eds-datepicker__calender__day[tabindex="0"]') : datepickerGUIWrapper.querySelector('.eds-datepicker__calender__day[aria-current="date"]');
+
+      if (dateToSetFocusTo !== null) {
+        var _datepickerRef$curren4;
+
+        (_datepickerRef$curren4 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren4.setBlur();
+        dateToSetFocusTo.focus({
+          preventScroll: true
+        });
+      }
     });
     setShouldFocusOnCalendarButtonAfterSelect(true);
     setShowValidation(false);
   };
 
   var datePickerGUIIsOpen = function datePickerGUIIsOpen() {
-    var _datepickerRef$curren3;
+    var _datepickerRef$curren5;
 
-    return (_datepickerRef$curren3 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren3.isCalendarOpen();
+    return (_datepickerRef$curren5 = datepickerRef.current) == null ? void 0 : _datepickerRef$curren5.isCalendarOpen();
   };
 
   return React.createElement(React.Fragment, null, React.createElement(ReactDatepicker, _extends({
@@ -437,6 +462,7 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     inline: inline,
     disabled: disabled,
     preventOpenOnFocus: true,
+    chooseDayAriaLabelPrefix: chooseDayAriaLabelPrefix,
     open: hideCalendar ? false : open,
     ref: datepickerRef,
     calendarClassName: "eds-datepicker__calender",
@@ -467,14 +493,18 @@ var DatePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         increaseMonth: increaseMonth,
         decreaseMonth: decreaseMonth,
         prevMonthButtonDisabled: prevMonthButtonDisabled,
-        nextMonthButtonDisabled: nextMonthButtonDisabled
+        nextMonthButtonDisabled: nextMonthButtonDisabled,
+        previousMonthAriaLabel: previousMonthAriaLabel,
+        nextMonthAriaLabel: nextMonthAriaLabel,
+        locale: locale
       });
     },
     customInput: React.createElement(DatePickerInput, {
       style: style,
       label: label,
       inputPlaceholder: placeholder,
-      calendarButtonTooltip: calendarButtonTooltip,
+      calendarButtonTooltipOpen: calendarButtonTooltipOpen,
+      calendarButtonTooltipClose: calendarButtonTooltipClose,
       prepend: prepend,
       feedback: getFeedbackAndVariant().feedback,
       variant: getFeedbackAndVariant().variant,