@fremtind/jokul 0.10.1 → 0.12.0

package/build/components/feedback/types.d.ts

@@ -0,0 +1,86 @@
+import { Dispatch, FormEvent, SetStateAction } from 'react';
+export type FeedbackOption<T = string | number> = {
+    /** Teksten som vises ved alternativet */
+    label: string;
+    value: T;
+    /** Her kan du spesifisere en egen tekst til oppfølgingsspørsmålet dersom dette alternativet er valgt (gjelder kun alternativene til hovedspørsmålet i Feedback, ignoreres ellers) */
+    textAreaLabel?: string;
+};
+export type QuestionType = "radio" | "checkbox" | "text" | "smiley";
+interface BaseQuestion {
+    type: QuestionType;
+    label: string;
+    helpLabel?: string;
+    name?: string;
+}
+interface RadioQuestion extends BaseQuestion {
+    type: "radio";
+    options: FeedbackOption[];
+}
+interface CheckboxQuestion extends BaseQuestion {
+    type: "checkbox";
+    options: FeedbackOption[];
+}
+interface SmileyQuestion extends BaseQuestion {
+    type: "smiley";
+    options: FeedbackOption<number>[];
+}
+interface TextQuestion extends BaseQuestion {
+    type: "text";
+}
+export type MainQuestion = RadioQuestion | SmileyQuestion;
+export type FollowupQuestion = MainQuestion | TextQuestion | CheckboxQuestion;
+interface BaseFeedbackAnswer {
+    label: string;
+    name: string;
+    type: "radio" | "checkbox" | "text";
+}
+interface MultiFeedbackAnswer extends BaseFeedbackAnswer {
+    type: "checkbox";
+    value: string[];
+}
+interface SingleFeedbackAnswer extends BaseFeedbackAnswer {
+    type: "radio" | "text";
+    value: string;
+}
+export type FeedbackAnswer = SingleFeedbackAnswer | MultiFeedbackAnswer;
+export type FeedbackType = {
+    /** Feedbackverdien, format avhenger av typen spørsmål */
+    feedbackValue: number | string | Array<string | number>;
+    /** Angir hvorvidt brukeren aktivt sendte inn tilbakemeldingen. Dersom `false` ble skjemaet sendt inn da brukeren forlot siden */
+    intentionalSubmit: boolean;
+    /** Eventuell utfyllende melding fra brukeren. Blir bare sendt inn dersom brukeren aktivt sender inn tilbakemelding */
+    message?: string;
+};
+export type FeedbackState = {
+    currentValue?: FeedbackOption | FeedbackOption[];
+    setCurrentValue: Dispatch<SetStateAction<FeedbackOption | FeedbackOption[] | undefined>>;
+    message?: string;
+    setMessage: Dispatch<SetStateAction<string | undefined>>;
+    submitted: boolean;
+    handleSubmit: () => void;
+};
+export type FollowUpStep = {
+    number: number;
+    question: BaseQuestion;
+    isLast: boolean;
+};
+export type FollowupState = {
+    questions: BaseQuestion[];
+    values: FeedbackAnswer[] | undefined;
+    currentValue?: FeedbackOption | FeedbackOption[];
+    step: FollowUpStep;
+    submitted: boolean;
+    handleNext: (e?: FormEvent<HTMLFormElement>) => void;
+    handleAbort: () => void;
+    setCurrentValue: Dispatch<SetStateAction<FeedbackOption | FeedbackOption[] | undefined>>;
+};
+export interface QuestionProps {
+    type?: QuestionType;
+    label: string;
+    name?: string;
+    helpLabel?: string;
+    options?: FeedbackOption[];
+    autoFocus?: boolean;
+}
+export {};

package/build/components/feedback/utils.d.ts

@@ -0,0 +1,4 @@
+import { default as React, JSXElementConstructor, FC } from 'react';
+import { QuestionProps, QuestionType } from './types';
+export declare function getChildrenOfType<P>(...allowedTypes: Array<string | JSXElementConstructor<P>>): (children: React.ReactNode) => React.ReactElement<P, string | React.JSXElementConstructor<unknown>>[] | null | undefined;
+export declare const getQuestionFromType: (type: QuestionType) => FC<QuestionProps>;

package/build/components/index.d.ts

@@ -6,6 +6,7 @@ export * from './checkbox';
 export * from './combobox';
 export * from './cookie-consent';
 export * from './datepicker';
+export * from './feedback';
 export * from './icon';
 export * from './icon-button';
 export * from './image';
@@ -14,7 +15,9 @@ export * from './link';
 export * from './link-list';
 export * from './list';
 export * from './loader';
+export * from './message';
 export * from './modal';
+export * from './popover';
 export * from './radio-button';
 export * from './select';
 export * from './tag';

package/build/components/message/DismissButton.d.ts

@@ -0,0 +1,5 @@
+import { default as React, ButtonHTMLAttributes } from 'react';
+export interface DismissButtonProps extends Exclude<ButtonHTMLAttributes<HTMLButtonElement>, "disabled"> {
+    label?: string;
+}
+export declare const DismissButton: React.ForwardRefExoticComponent<DismissButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/build/components/message/FormErrorMessage.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+import { MessageProps } from './Message';
+export interface FormErrorMessageProps {
+    className?: string;
+    id?: string;
+    /**
+     * @default { title: "Feil og mangler i skjemaet" }
+     */
+    messageProps?: Partial<MessageProps>;
+    errors: (string | undefined)[];
+    isSubmitted: boolean;
+    isValid: boolean;
+}
+export declare const FormErrorMessage: React.ForwardRefExoticComponent<FormErrorMessageProps & React.RefAttributes<HTMLDivElement>>;

package/build/components/message/Message.d.ts

@@ -0,0 +1,19 @@
+import { default as React, AriaRole } from 'react';
+import { Density, WithChildren } from '../..';
+export interface MessageProps extends WithChildren {
+    id?: string;
+    title?: string;
+    fullWidth?: boolean;
+    density?: Density;
+    className?: string;
+    dismissed?: boolean;
+    dismissAction?: {
+        handleDismiss: () => void;
+        buttonTitle?: string;
+    };
+    role?: AriaRole;
+}
+export declare const InfoMessage: React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;
+export declare const ErrorMessage: React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;
+export declare const WarningMessage: React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;
+export declare const SuccessMessage: React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;

package/build/components/message/index.d.ts

@@ -0,0 +1,2 @@
+export { InfoMessage, ErrorMessage, SuccessMessage, WarningMessage, type MessageProps } from './Message';
+export { FormErrorMessage, type FormErrorMessageProps } from './FormErrorMessage';

package/build/components/popover/Popover.d.ts

@@ -0,0 +1,114 @@
+import { useFocus, useHover, useClick, useDismiss, useRole, UseFloatingOptions } from '@floating-ui/react';
+import * as React from "react";
+type ClickOptions = Parameters<typeof useClick>[1];
+type DismissOptions = Parameters<typeof useDismiss>[1];
+type FocusOptions = Parameters<typeof useFocus>[1];
+type HoverOptions = Parameters<typeof useHover>[1];
+type RoleOptions = Parameters<typeof useRole>[1];
+interface PopoverOptions {
+    /**
+     * Angir om popoveren er åpen eller lukket.
+     * @see https://floating-ui.com/docs/useFloating#open
+     */
+    open?: boolean;
+    /**
+     * Callback som trigges når popoveren åpnes eller lukkes.
+     * @see https://floating-ui.com/docs/useFloating#onOpenChange
+     */
+    onOpenChange?: UseFloatingOptions["onOpenChange"];
+    /**
+     * Bestemmer plasseringen av popoveren.
+     * @default "bottom-start"
+     * @see https://floating-ui.com/docs/useFloating#placement
+     */
+    placement?: UseFloatingOptions["placement"];
+    /**
+     * Definerer strategien for posisjonering av popoveren.
+     * @default "absolute"
+     * @see https://floating-ui.com/docs/useFloating#strategy
+     */
+    strategy?: UseFloatingOptions["strategy"];
+    /**
+     * Angir om popoveren skal fungere som en modal, der fokus er låst til det flytende elementet
+     * og innhold utenfor ikke kan interageres med.
+     * @default true
+     * @see https://floating-ui.com/docs/useFloating#modal
+     */
+    modal?: boolean;
+    /**
+     * Offset til det flytende elementet.
+     * @see https://floating-ui.com/docs/offset
+     * @default 4
+     * */
+    /**
+     * Justerer avstanden mellom referanse-elementet og popoveren.
+     * @see https://floating-ui.com/docs/offset
+     * @default 4
+     */
+    offset?: number;
+    /**
+     * Options for hover-interaksjoner.
+     * @see https://floating-ui.com/docs/useHover
+     * @default { enabled: false }
+     */
+    hoverOptions?: HoverOptions;
+    /**
+     * Options for fokus-interaksjoner.
+     * @see https://floating-ui.com/docs/useFocus
+     * @default { enabled: false }
+     */
+    focusOptions?: FocusOptions;
+    /**
+     * Options for klikk-interaksjoner.
+     * @see https://floating-ui.com/docs/useClick
+     * @default { enabled: false }
+     */
+    clickOptions?: ClickOptions;
+    /**
+     * Konfigurerer rollen for popoveren.
+     * @see https://floating-ui.com/docs/useRole
+     * @default { enabled: true, role: "dialog" }
+     */
+    roleOptions?: RoleOptions;
+    /**
+     * Options for å lukke popoveren når en dismissal skjer,
+     * som ved å klikke utenfor eller trykke på "Escape"-tasten.
+     * @see https://floating-ui.com/docs/useDismiss
+     * @default { enabled: true }
+     */
+    dismissOptions?: DismissOptions;
+}
+declare const Popover: {
+    ({ children, ...restOptions }: {
+        children: React.ReactNode;
+    } & PopoverOptions): React.JSX.Element;
+    Trigger: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement> & PopoverTriggerProps, "ref"> & React.RefAttributes<HTMLElement>>;
+    Content: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLDivElement> & PopoverContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+interface PopoverTriggerProps {
+    children: React.ReactNode;
+    /**
+     * Rendrer komponenten som child-elementet sitt, og slår
+     * sammen egenskaper og props.
+     * @example
+     * ```tsx
+     * <Component asChild foo="bar">
+     *    <Child baz="qux" />
+     * </Component>
+     *
+     * // Rendrer følgende:
+     * <Child foo="bar" baz="qux" />
+     * ```
+     *
+     * @default false
+     */
+    asChild?: boolean;
+}
+interface PopoverContentProps {
+    /**
+     * Padding rundt innholdet i popoveren.
+     * @default 0
+     */
+    padding?: 0 | 8 | 16 | 24;
+}
+export default Popover;

package/build/components/popover/index.d.ts

@@ -0,0 +1 @@
+export { default as Popover } from './Popover';

package/build/components/popover/utils.d.ts

@@ -0,0 +1,4 @@
+export declare const getThemeAndDensity: (element: HTMLElement | null) => {
+    theme?: string | undefined;
+    density?: string | undefined;
+};

package/build/es/components/datepicker/DatePicker.js

@@ -1,2 +1,2 @@
-import{jsx as o,jsxs as e}from"react/jsx-runtime";import t from"classnames";import n from"date-fns/startOfDay";import{forwardRef as r,useState as i,useRef as s,useCallback as a}from"react";import{flushSync as c}from"react-dom";import{useAnimatedHeight as l}from"../../hooks/useAnimatedHeight/useAnimatedHeight.js";import"../../hooks/useScreen/useScreen.js";import{useClickOutside as p}from"../../hooks/useClickOutside/useClickOutside.js";import{useFocusOutside as u}from"../../hooks/useFocusOutside/useFocusOutside.js";import"../../hooks/useId/useId.js";import{useKeyListener as m}from"../../hooks/useKeyListener/useKeyListener.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import{CalendarIcon as d}from"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/WarningIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/PenIcon.js";import"../tooltip/Tooltip.js";import"../tooltip/TooltipContent.js";import"../tooltip/TooltipTrigger.js";import{InputGroup as j}from"../input-group/InputGroup.js";import"../text-input/BaseTextArea.js";import{BaseTextInput as f}from"../text-input/BaseTextInput.js";import"../text-input/TextArea.js";import"../text-input/TextInput.js";import{Calendar as h}from"./internal/Calendar.js";import{getInitialDate as I}from"./internal/utils.js";import{parseDateString as k,formatInput as v}from"./utils.js";import{isWithinLowerBound as y,isWithinUpperBound as D}from"./validation.js";const b=r(((r,b)=>{const{"data-testautoid":g,id:w,className:C="",label:L="Velg dato",labelProps:T,defaultValue:A,defaultShow:x=!1,value:O,disableBeforeDate:P,disableAfterDate:_,yearsToShow:E,name:S,helpLabel:N,errorLabel:R,invalid:B,density:U,days:K,months:H,monthLabel:V,yearLabel:F,placeholder:W="dd.mm.åååå",width:G="11.25rem",onChange:M,onBlur:q,onFocus:z,onKeyDown:Q,action:J,showCalendarLabel:X="Åpne kalender",hideCalendarLabel:Y="Lukk kalender",supportLabelProps:Z,tooltipProps:$,...oo}=r;"production"!==process.env.NODE_ENV&&O&&A&&console.warn("DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.");const eo=k(P),to=eo?n(eo):void 0,no=k(_),ro=no?n(no):void 0,[io,so]=i(I(O,A,to,ro)),[ao,co]=i(null),[lo,po]=i(x),[uo]=l(lo),mo=s(null),jo=s(null),fo=a((o=>{jo.current=o,b&&("function"==typeof b?b(o):b.current=o)}),[jo,b]),ho=s(null),Io=a((o=>{z&&ho.current&&(ho.current.contains(o.relatedTarget)||z(o,io,{error:ao,value:o.target.value}))}),[z,io,ao]),ko=a((o=>{q&&q(o,io,{error:ao,value:o.target.value})}),[q,io,ao]),vo=a((o=>{"Escape"===o.key&&(po(!1),o.preventDefault(),o.stopPropagation()),null!=J&&J.onKeyDown&&J.onKeyDown(o)}),[po,J]),yo=a((o=>{if("Escape"===o.key&&(po(!1),o.preventDefault(),o.stopPropagation()),Q){let e=o.currentTarget.value;/[\d.]/.test(o.key)&&(e+=o.key),Q(o,io,{error:ao,value:e})}}),[Q,po,io,ao]),Do=a((o=>{let e=null,t=null;if(o.target.value){const n=k(o.target.value);n?to&&!y(n,to)?t="OUTSIDE_LOWER_BOUND":ro&&!D(n,ro)?t="OUTSIDE_UPPER_BOUND":po(!1):t="WRONG_FORMAT",e=n||null}co(t),so(e),M&&M(o,e,{error:t,value:o.target.value})}),[M,co,so,po,to,ro]),bo=a((o=>{c((()=>{po(!lo)}));const e=uo.current,t=e&&e.querySelector('[aria-pressed="true"]');t&&t.focus(),null!=J&&J.onClick&&J.onClick(o)}),[po,lo,J,uo]),go=a((()=>{po(!lo)}),[po,lo]),wo=a((()=>{po(!1)}),[po]),Co=a((({date:o})=>{if(po(!1),so(o),jo.current){const e=jo.current;e.value=v(o);const t=document.createEvent("HTMLEvents");t.initEvent("input",!0,!1),e.dispatchEvent(t),e.focus(),M&&M(t,o,{error:null,value:e.value})}}),[po,so,M]),Lo=a((o=>{o.preventDefault(),po(!1),mo.current&&mo.current.focus()}),[po]);return p(ho,wo),u(ho,wo),m(uo,["Escape"],(()=>{po(!1),jo.current&&jo.current.focus()})),o(j,{id:w,className:t("jkl-datepicker",C,{"jkl-datepicker--open":lo}),...oo,ref:ho,label:L,labelProps:T,density:U,helpLabel:N,errorLabel:R,supportLabelProps:Z,tooltipProps:$,render:t=>e("div",{"data-testid":"jkl-datepicker__input-wrapper",className:"jkl-datepicker__input-wrapper","data-density":U,tabIndex:-1,onKeyDown:yo,children:[o(f,{ref:fo,"data-testid":"jkl-datepicker__input","data-testautoid":g,className:"jkl-datepicker__input",name:S,defaultValue:A,density:U,value:O,type:"text",placeholder:W,width:G,onFocus:Io,onBlur:ko,onClick:go,onChange:Do,...t,action:{buttonRef:mo,icon:o(d,{}),label:lo?Y:X,...J,onClick:bo,onKeyDown:vo}}),o("div",{className:"jkl-datepicker__calendar-wrapper",children:o(h,{ref:uo,density:U,date:io,minDate:to,maxDate:ro,days:K,months:H,monthLabel:V,yearLabel:F,yearsToShow:E,hidden:!lo,onDateSelected:Co,onTabOutside:Lo})})]})})}));b.displayName="DatePicker";export{b as DatePicker};
+import{jsx as o,jsxs as e}from"react/jsx-runtime";import{c as t}from"../../../clsx-BeLtu-UY.js";import n from"date-fns/startOfDay";import{forwardRef as r,useState as i,useRef as s,useCallback as a}from"react";import{flushSync as c}from"react-dom";import{useAnimatedHeight as l}from"../../hooks/useAnimatedHeight/useAnimatedHeight.js";import"../../hooks/useScreen/useScreen.js";import{useClickOutside as p}from"../../hooks/useClickOutside/useClickOutside.js";import{useFocusOutside as u}from"../../hooks/useFocusOutside/useFocusOutside.js";import"../../hooks/useId/useId.js";import{useKeyListener as m}from"../../hooks/useKeyListener/useKeyListener.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import{CalendarIcon as d}from"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/WarningIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/PenIcon.js";import"../tooltip/Tooltip.js";import"../tooltip/TooltipContent.js";import"../tooltip/TooltipTrigger.js";import{InputGroup as j}from"../input-group/InputGroup.js";import"../text-input/BaseTextArea.js";import{BaseTextInput as f}from"../text-input/BaseTextInput.js";import"../text-input/TextArea.js";import"../text-input/TextInput.js";import{Calendar as h}from"./internal/Calendar.js";import{getInitialDate as I}from"./internal/utils.js";import{parseDateString as k,formatInput as v}from"./utils.js";import{isWithinLowerBound as y,isWithinUpperBound as D}from"./validation.js";const b=r(((r,b)=>{const{"data-testautoid":g,id:w,className:C="",label:L="Velg dato",labelProps:T,defaultValue:x,defaultShow:A=!1,value:O,disableBeforeDate:P,disableAfterDate:_,yearsToShow:E,name:S,helpLabel:N,errorLabel:R,invalid:B,density:U,days:K,months:H,monthLabel:V,yearLabel:F,placeholder:W="dd.mm.åååå",width:G="11.25rem",onChange:M,onBlur:q,onFocus:z,onKeyDown:Q,action:J,showCalendarLabel:X="Åpne kalender",hideCalendarLabel:Y="Lukk kalender",supportLabelProps:Z,tooltipProps:$,...oo}=r;"production"!==process.env.NODE_ENV&&O&&x&&console.warn("DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.");const eo=k(P),to=eo?n(eo):void 0,no=k(_),ro=no?n(no):void 0,[io,so]=i(I(O,x,to,ro)),[ao,co]=i(null),[lo,po]=i(A),[uo]=l(lo),mo=s(null),jo=s(null),fo=a((o=>{jo.current=o,b&&("function"==typeof b?b(o):b.current=o)}),[jo,b]),ho=s(null),Io=a((o=>{z&&ho.current&&(ho.current.contains(o.relatedTarget)||z(o,io,{error:ao,value:o.target.value}))}),[z,io,ao]),ko=a((o=>{q&&q(o,io,{error:ao,value:o.target.value})}),[q,io,ao]),vo=a((o=>{"Escape"===o.key&&(po(!1),o.preventDefault(),o.stopPropagation()),null!=J&&J.onKeyDown&&J.onKeyDown(o)}),[po,J]),yo=a((o=>{if("Escape"===o.key&&(po(!1),o.preventDefault(),o.stopPropagation()),Q){let e=o.currentTarget.value;/[\d.]/.test(o.key)&&(e+=o.key),Q(o,io,{error:ao,value:e})}}),[Q,po,io,ao]),Do=a((o=>{let e=null,t=null;if(o.target.value){const n=k(o.target.value);n?to&&!y(n,to)?t="OUTSIDE_LOWER_BOUND":ro&&!D(n,ro)?t="OUTSIDE_UPPER_BOUND":po(!1):t="WRONG_FORMAT",e=n||null}co(t),so(e),M&&M(o,e,{error:t,value:o.target.value})}),[M,co,so,po,to,ro]),bo=a((o=>{c((()=>{po(!lo)}));const e=uo.current,t=e&&e.querySelector('[aria-pressed="true"]');t&&t.focus(),null!=J&&J.onClick&&J.onClick(o)}),[po,lo,J,uo]),go=a((()=>{po(!lo)}),[po,lo]),wo=a((()=>{po(!1)}),[po]),Co=a((({date:o})=>{if(po(!1),so(o),jo.current){const e=jo.current;e.value=v(o);const t=document.createEvent("HTMLEvents");t.initEvent("input",!0,!1),e.dispatchEvent(t),e.focus(),M&&M(t,o,{error:null,value:e.value})}}),[po,so,M]),Lo=a((o=>{o.preventDefault(),po(!1),mo.current&&mo.current.focus()}),[po]);return p(ho,wo),u(ho,wo),m(uo,["Escape"],(()=>{po(!1),jo.current&&jo.current.focus()})),o(j,{id:w,className:t("jkl-datepicker",C,{"jkl-datepicker--open":lo}),...oo,ref:ho,label:L,labelProps:T,density:U,helpLabel:N,errorLabel:R,supportLabelProps:Z,tooltipProps:$,render:t=>e("div",{"data-testid":"jkl-datepicker__input-wrapper",className:"jkl-datepicker__input-wrapper","data-density":U,tabIndex:-1,onKeyDown:yo,children:[o(f,{ref:fo,"data-testid":"jkl-datepicker__input","data-testautoid":g,className:"jkl-datepicker__input",name:S,defaultValue:x,density:U,value:O,type:"text",placeholder:W,width:G,onFocus:Io,onBlur:ko,onClick:go,onChange:Do,...t,action:{buttonRef:mo,icon:o(d,{}),label:lo?Y:X,...J,onClick:bo,onKeyDown:vo}}),o("div",{className:"jkl-datepicker__calendar-wrapper",children:o(h,{ref:uo,density:U,date:io,minDate:to,maxDate:ro,days:K,months:H,monthLabel:V,yearLabel:F,yearsToShow:E,hidden:!lo,onDateSelected:Co,onTabOutside:Lo})})]})})}));b.displayName="DatePicker";export{b as DatePicker};
 //# sourceMappingURL=DatePicker.js.map

package/build/es/components/datepicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/datepicker/DatePicker.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport startOfDay from \"date-fns/startOfDay\";\nimport React, {\n    ChangeEvent,\n    FocusEvent,\n    KeyboardEvent,\n    MouseEvent,\n    forwardRef,\n    useCallback,\n    useRef,\n    useState,\n} from \"react\";\nimport { flushSync } from \"react-dom\";\nimport { useAnimatedHeight, useClickOutside, useFocusOutside, useKeyListener } from \"../../hooks\";\nimport { CalendarIcon } from \"../icon\";\nimport { InputGroup } from \"../input-group\";\nimport { BaseTextInput } from \"../text-input\";\nimport { Calendar } from \"./internal/Calendar\";\nimport { getInitialDate, DateInfo } from \"./internal/utils\";\nimport { DatePickerProps, DateValidationError } from \"./types\";\nimport { formatInput, parseDateString } from \"./utils\";\nimport { isWithinLowerBound, isWithinUpperBound } from \"./validation\";\n\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>((props, forwardedInputRef) => {\n    const {\n        \"data-testautoid\": testAutoId,\n        id,\n        className = \"\",\n        label = \"Velg dato\",\n        labelProps,\n        defaultValue,\n        defaultShow = false,\n        value,\n        disableBeforeDate: disableBefore,\n        disableAfterDate: disableAfter,\n        yearsToShow,\n        name,\n        helpLabel,\n        errorLabel,\n        invalid,\n        density,\n        days,\n        months,\n        monthLabel,\n        yearLabel,\n        placeholder = \"dd.mm.åååå\",\n        width = \"11.25rem\",\n        onChange,\n        onBlur,\n        onFocus,\n        onKeyDown,\n        action,\n        showCalendarLabel = \"Åpne kalender\",\n        hideCalendarLabel = \"Lukk kalender\",\n        supportLabelProps,\n        tooltipProps,\n        ...rest\n    } = props;\n\n    if (process.env.NODE_ENV !== \"production\" && value && defaultValue) {\n        console.warn(\n            \"DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.\",\n        );\n    }\n    /// Input state\n\n    const disableBeforeDate = parseDateString(disableBefore);\n    const minDate = disableBeforeDate ? startOfDay(disableBeforeDate) : undefined;\n    const disableAfterDate = parseDateString(disableAfter);\n    const maxDate = disableAfterDate ? startOfDay(disableAfterDate) : undefined;\n\n    const [date, setDate] = useState(getInitialDate(value, defaultValue, minDate, maxDate));\n    const [error, setError] = useState<DateValidationError | null>(null);\n\n    /// Calendar state\n\n    const [showCalendar, setShowCalendar] = useState(defaultShow);\n    const [calendarRef] = useAnimatedHeight<HTMLDivElement>(showCalendar);\n\n    /// Input events\n\n    const iconButtonRef = useRef<HTMLButtonElement | null>(null);\n    const inputRef = useRef<HTMLInputElement | null>(null);\n\n    // Hjelper for å gjøre det enklere å både forwarde refen men også bruke den selv internt\n    const unifiedInputRef = useCallback(\n        (instance: HTMLInputElement | null) => {\n            inputRef.current = instance;\n            if (forwardedInputRef) {\n                if (typeof forwardedInputRef === \"function\") {\n                    forwardedInputRef(instance);\n                } else {\n                    forwardedInputRef.current = instance;\n                }\n            }\n        },\n        [inputRef, forwardedInputRef],\n    );\n\n    const datepickerRef = useRef<HTMLDivElement>(null);\n    const handleFocus = useCallback(\n        (e: FocusEvent<HTMLInputElement>) => {\n            if (!onFocus || !datepickerRef.current) {\n                return;\n            }\n\n            const nextFocusIsInside = datepickerRef.current.contains(e.relatedTarget as Node);\n            if (!nextFocusIsInside) {\n                onFocus(e, date, { error, value: e.target.value });\n            }\n        },\n        [onFocus, date, error],\n    );\n\n    const handleBlur = useCallback(\n        (e: FocusEvent<HTMLInputElement>) => {\n            if (onBlur) {\n                onBlur(e, date, { error, value: e.target.value });\n            }\n        },\n        [onBlur, date, error],\n    );\n\n    const handleKeyDownAction = useCallback(\n        (e: React.KeyboardEvent<HTMLButtonElement>) => {\n            if (e.key === \"Escape\") {\n                setShowCalendar(false);\n                e.preventDefault();\n                e.stopPropagation();\n            }\n\n            if (action?.onKeyDown) {\n                action.onKeyDown(e);\n            }\n        },\n        [setShowCalendar, action],\n    );\n\n    const handleKeyDown = useCallback(\n        (e: React.KeyboardEvent<HTMLInputElement>) => {\n            if (e.key === \"Escape\") {\n                setShowCalendar(false);\n                e.preventDefault();\n                e.stopPropagation();\n            }\n\n            if (onKeyDown) {\n                let nextValue = e.currentTarget.value;\n                if (/[\\d.]/.test(e.key)) {\n                    nextValue += e.key;\n                }\n                onKeyDown(e, date, { error, value: nextValue });\n            }\n        },\n        [onKeyDown, setShowCalendar, date, error],\n    );\n\n    const handleChange = useCallback(\n        (e: ChangeEvent<HTMLInputElement>) => {\n            let nextDate: Date | null = null;\n            let nextError: DateValidationError | null = null;\n\n            if (e.target.value) {\n                const val = parseDateString(e.target.value);\n                if (!val) {\n                    nextError = \"WRONG_FORMAT\";\n                } else if (minDate && !isWithinLowerBound(val, minDate)) {\n                    nextError = \"OUTSIDE_LOWER_BOUND\";\n                } else if (maxDate && !isWithinUpperBound(val, maxDate)) {\n                    nextError = \"OUTSIDE_UPPER_BOUND\";\n                } else {\n                    setShowCalendar(false);\n                }\n                nextDate = val || null;\n            }\n\n            setError(nextError);\n            setDate(nextDate);\n\n            if (onChange) {\n                onChange(e, nextDate, { error: nextError, value: e.target.value });\n            }\n        },\n        [onChange, setError, setDate, setShowCalendar, minDate, maxDate],\n    );\n\n    /// Calendar events\n\n    const clickCalendar = useCallback(\n        (e: MouseEvent<HTMLButtonElement>) => {\n            flushSync(() => {\n                setShowCalendar(!showCalendar);\n            });\n\n            const calendarEl = calendarRef.current;\n            const button = calendarEl && (calendarEl.querySelector('[aria-pressed=\"true\"]') as HTMLButtonElement);\n            button && button.focus();\n\n            if (action?.onClick) {\n                action.onClick(e);\n            }\n        },\n        [setShowCalendar, showCalendar, action, calendarRef],\n    );\n\n    const clickInput = useCallback(() => {\n        setShowCalendar(!showCalendar);\n    }, [setShowCalendar, showCalendar]);\n\n    const hideCalendar = useCallback(() => {\n        setShowCalendar(false);\n    }, [setShowCalendar]);\n\n    const handleClickCalendarDay = useCallback(\n        ({ date }: DateInfo) => {\n            setShowCalendar(false);\n            setDate(date);\n\n            if (inputRef.current) {\n                const node = inputRef.current;\n\n                node.value = formatInput(date);\n\n                // Simulér et change-event så APIet blir så likt som mulig en endring av inputfeltet\n                const event = document.createEvent(\"HTMLEvents\");\n                event.initEvent(\"input\", true, false);\n                node.dispatchEvent(event);\n\n                node.focus();\n\n                if (onChange) {\n                    // Det er ikke helt sant at dette er et React.SyntheticEvent, men it's fine – probably?\n                    // Den har tingene man kan forvente, men hvis du gjør serdeles fancy ting med events\n                    // så kan det hende du må utvide denne for å dekke behovet ditt.\n                    onChange(event as unknown as ChangeEvent<HTMLInputElement>, date, {\n                        error: null,\n                        value: node.value,\n                    });\n                }\n            }\n        },\n        [setShowCalendar, setDate, onChange],\n    );\n\n    const handleTabOutsideCalendar = useCallback(\n        (e: KeyboardEvent) => {\n            e.preventDefault();\n            setShowCalendar(false);\n            iconButtonRef.current && iconButtonRef.current.focus();\n        },\n        [setShowCalendar],\n    );\n\n    useClickOutside(datepickerRef, hideCalendar);\n    useFocusOutside(datepickerRef, hideCalendar);\n    useKeyListener(calendarRef, [\"Escape\"], () => {\n        setShowCalendar(false);\n        inputRef.current && inputRef.current.focus();\n    });\n\n    return (\n        <InputGroup\n            id={id}\n            className={cn(\"jkl-datepicker\", className, {\n                \"jkl-datepicker--open\": showCalendar,\n            })}\n            {...rest}\n            ref={datepickerRef}\n            label={label}\n            labelProps={labelProps}\n            density={density}\n            helpLabel={helpLabel}\n            errorLabel={errorLabel}\n            supportLabelProps={supportLabelProps}\n            tooltipProps={tooltipProps}\n            render={(inputProps) => (\n                // The <div> element handles keyboard events that bubble up from <button> elements inside\n                // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n                <div\n                    data-testid=\"jkl-datepicker__input-wrapper\"\n                    className=\"jkl-datepicker__input-wrapper\"\n                    data-density={density}\n                    tabIndex={-1} // Må være her for Safari onBlur quirk! https://bugs.webkit.org/show_bug.cgi?id=22261\n                    onKeyDown={handleKeyDown}\n                >\n                    <BaseTextInput\n                        ref={unifiedInputRef}\n                        data-testid=\"jkl-datepicker__input\"\n                        data-testautoid={testAutoId}\n                        className=\"jkl-datepicker__input\"\n                        name={name}\n                        defaultValue={defaultValue}\n                        density={density}\n                        value={value}\n                        type=\"text\"\n                        placeholder={placeholder}\n                        width={width}\n                        onFocus={handleFocus}\n                        onBlur={handleBlur}\n                        onClick={clickInput}\n                        onChange={handleChange}\n                        {...inputProps}\n                        action={{\n                            buttonRef: iconButtonRef,\n                            icon: <CalendarIcon />,\n                            label: showCalendar ? hideCalendarLabel : showCalendarLabel,\n                            ...action,\n                            onClick: clickCalendar,\n                            onKeyDown: handleKeyDownAction,\n                        }}\n                    />\n                    <div className=\"jkl-datepicker__calendar-wrapper\">\n                        <Calendar\n                            ref={calendarRef}\n                            density={density}\n                            date={date}\n                            minDate={minDate}\n                            maxDate={maxDate}\n                            days={days}\n                            months={months}\n                            monthLabel={monthLabel}\n                            yearLabel={yearLabel}\n                            yearsToShow={yearsToShow}\n                            hidden={!showCalendar}\n                            onDateSelected={handleClickCalendarDay}\n                            onTabOutside={handleTabOutsideCalendar}\n                        />\n                    </div>\n                </div>\n            )}\n        />\n    );\n});\n\nDatePicker.displayName = \"DatePicker\";\n"],"names":["DatePicker","forwardRef","props","forwardedInputRef","testAutoId","id","className","label","labelProps","defaultValue","defaultShow","value","disableBeforeDate","disableBefore","disableAfterDate","disableAfter","yearsToShow","name","helpLabel","errorLabel","invalid","density","days","months","monthLabel","yearLabel","placeholder","width","onChange","onBlur","onFocus","onKeyDown","action","showCalendarLabel","hideCalendarLabel","supportLabelProps","tooltipProps","rest","process","env","NODE_ENV","console","warn","parseDateString","minDate","startOfDay","maxDate","date","setDate","useState","getInitialDate","error","setError","showCalendar","setShowCalendar","calendarRef","useAnimatedHeight","iconButtonRef","useRef","inputRef","unifiedInputRef","useCallback","instance","current","datepickerRef","handleFocus","e","contains","relatedTarget","target","handleBlur","handleKeyDownAction","key","preventDefault","stopPropagation","handleKeyDown","nextValue","currentTarget","test","handleChange","nextDate","nextError","val","isWithinLowerBound","isWithinUpperBound","clickCalendar","flushSync","calendarEl","button","querySelector","focus","onClick","clickInput","hideCalendar","handleClickCalendarDay","node","formatInput","event","document","createEvent","initEvent","dispatchEvent","handleTabOutsideCalendar","useClickOutside","useFocusOutside","useKeyListener","jsx","InputGroup","cn","ref","render","inputProps","jsxs","tabIndex","children","BaseTextInput","type","buttonRef","icon","CalendarIcon","Calendar","hidden","onDateSelected","onTabOutside","displayName"],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/datepicker/DatePicker.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport startOfDay from \"date-fns/startOfDay\";\nimport React, {\n    ChangeEvent,\n    FocusEvent,\n    KeyboardEvent,\n    MouseEvent,\n    forwardRef,\n    useCallback,\n    useRef,\n    useState,\n} from \"react\";\nimport { flushSync } from \"react-dom\";\nimport { useAnimatedHeight, useClickOutside, useFocusOutside, useKeyListener } from \"../../hooks\";\nimport { CalendarIcon } from \"../icon\";\nimport { InputGroup } from \"../input-group\";\nimport { BaseTextInput } from \"../text-input\";\nimport { Calendar } from \"./internal/Calendar\";\nimport { getInitialDate, DateInfo } from \"./internal/utils\";\nimport { DatePickerProps, DateValidationError } from \"./types\";\nimport { formatInput, parseDateString } from \"./utils\";\nimport { isWithinLowerBound, isWithinUpperBound } from \"./validation\";\n\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>((props, forwardedInputRef) => {\n    const {\n        \"data-testautoid\": testAutoId,\n        id,\n        className = \"\",\n        label = \"Velg dato\",\n        labelProps,\n        defaultValue,\n        defaultShow = false,\n        value,\n        disableBeforeDate: disableBefore,\n        disableAfterDate: disableAfter,\n        yearsToShow,\n        name,\n        helpLabel,\n        errorLabel,\n        invalid,\n        density,\n        days,\n        months,\n        monthLabel,\n        yearLabel,\n        placeholder = \"dd.mm.åååå\",\n        width = \"11.25rem\",\n        onChange,\n        onBlur,\n        onFocus,\n        onKeyDown,\n        action,\n        showCalendarLabel = \"Åpne kalender\",\n        hideCalendarLabel = \"Lukk kalender\",\n        supportLabelProps,\n        tooltipProps,\n        ...rest\n    } = props;\n\n    if (process.env.NODE_ENV !== \"production\" && value && defaultValue) {\n        console.warn(\n            \"DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.\",\n        );\n    }\n    /// Input state\n\n    const disableBeforeDate = parseDateString(disableBefore);\n    const minDate = disableBeforeDate ? startOfDay(disableBeforeDate) : undefined;\n    const disableAfterDate = parseDateString(disableAfter);\n    const maxDate = disableAfterDate ? startOfDay(disableAfterDate) : undefined;\n\n    const [date, setDate] = useState(getInitialDate(value, defaultValue, minDate, maxDate));\n    const [error, setError] = useState<DateValidationError | null>(null);\n\n    /// Calendar state\n\n    const [showCalendar, setShowCalendar] = useState(defaultShow);\n    const [calendarRef] = useAnimatedHeight<HTMLDivElement>(showCalendar);\n\n    /// Input events\n\n    const iconButtonRef = useRef<HTMLButtonElement | null>(null);\n    const inputRef = useRef<HTMLInputElement | null>(null);\n\n    // Hjelper for å gjøre det enklere å både forwarde refen men også bruke den selv internt\n    const unifiedInputRef = useCallback(\n        (instance: HTMLInputElement | null) => {\n            inputRef.current = instance;\n            if (forwardedInputRef) {\n                if (typeof forwardedInputRef === \"function\") {\n                    forwardedInputRef(instance);\n                } else {\n                    forwardedInputRef.current = instance;\n                }\n            }\n        },\n        [inputRef, forwardedInputRef],\n    );\n\n    const datepickerRef = useRef<HTMLDivElement>(null);\n    const handleFocus = useCallback(\n        (e: FocusEvent<HTMLInputElement>) => {\n            if (!onFocus || !datepickerRef.current) {\n                return;\n            }\n\n            const nextFocusIsInside = datepickerRef.current.contains(e.relatedTarget as Node);\n            if (!nextFocusIsInside) {\n                onFocus(e, date, { error, value: e.target.value });\n            }\n        },\n        [onFocus, date, error],\n    );\n\n    const handleBlur = useCallback(\n        (e: FocusEvent<HTMLInputElement>) => {\n            if (onBlur) {\n                onBlur(e, date, { error, value: e.target.value });\n            }\n        },\n        [onBlur, date, error],\n    );\n\n    const handleKeyDownAction = useCallback(\n        (e: React.KeyboardEvent<HTMLButtonElement>) => {\n            if (e.key === \"Escape\") {\n                setShowCalendar(false);\n                e.preventDefault();\n                e.stopPropagation();\n            }\n\n            if (action?.onKeyDown) {\n                action.onKeyDown(e);\n            }\n        },\n        [setShowCalendar, action],\n    );\n\n    const handleKeyDown = useCallback(\n        (e: React.KeyboardEvent<HTMLInputElement>) => {\n            if (e.key === \"Escape\") {\n                setShowCalendar(false);\n                e.preventDefault();\n                e.stopPropagation();\n            }\n\n            if (onKeyDown) {\n                let nextValue = e.currentTarget.value;\n                if (/[\\d.]/.test(e.key)) {\n                    nextValue += e.key;\n                }\n                onKeyDown(e, date, { error, value: nextValue });\n            }\n        },\n        [onKeyDown, setShowCalendar, date, error],\n    );\n\n    const handleChange = useCallback(\n        (e: ChangeEvent<HTMLInputElement>) => {\n            let nextDate: Date | null = null;\n            let nextError: DateValidationError | null = null;\n\n            if (e.target.value) {\n                const val = parseDateString(e.target.value);\n                if (!val) {\n                    nextError = \"WRONG_FORMAT\";\n                } else if (minDate && !isWithinLowerBound(val, minDate)) {\n                    nextError = \"OUTSIDE_LOWER_BOUND\";\n                } else if (maxDate && !isWithinUpperBound(val, maxDate)) {\n                    nextError = \"OUTSIDE_UPPER_BOUND\";\n                } else {\n                    setShowCalendar(false);\n                }\n                nextDate = val || null;\n            }\n\n            setError(nextError);\n            setDate(nextDate);\n\n            if (onChange) {\n                onChange(e, nextDate, { error: nextError, value: e.target.value });\n            }\n        },\n        [onChange, setError, setDate, setShowCalendar, minDate, maxDate],\n    );\n\n    /// Calendar events\n\n    const clickCalendar = useCallback(\n        (e: MouseEvent<HTMLButtonElement>) => {\n            flushSync(() => {\n                setShowCalendar(!showCalendar);\n            });\n\n            const calendarEl = calendarRef.current;\n            const button = calendarEl && (calendarEl.querySelector('[aria-pressed=\"true\"]') as HTMLButtonElement);\n            button && button.focus();\n\n            if (action?.onClick) {\n                action.onClick(e);\n            }\n        },\n        [setShowCalendar, showCalendar, action, calendarRef],\n    );\n\n    const clickInput = useCallback(() => {\n        setShowCalendar(!showCalendar);\n    }, [setShowCalendar, showCalendar]);\n\n    const hideCalendar = useCallback(() => {\n        setShowCalendar(false);\n    }, [setShowCalendar]);\n\n    const handleClickCalendarDay = useCallback(\n        ({ date }: DateInfo) => {\n            setShowCalendar(false);\n            setDate(date);\n\n            if (inputRef.current) {\n                const node = inputRef.current;\n\n                node.value = formatInput(date);\n\n                // Simulér et change-event så APIet blir så likt som mulig en endring av inputfeltet\n                const event = document.createEvent(\"HTMLEvents\");\n                event.initEvent(\"input\", true, false);\n                node.dispatchEvent(event);\n\n                node.focus();\n\n                if (onChange) {\n                    // Det er ikke helt sant at dette er et React.SyntheticEvent, men it's fine – probably?\n                    // Den har tingene man kan forvente, men hvis du gjør serdeles fancy ting med events\n                    // så kan det hende du må utvide denne for å dekke behovet ditt.\n                    onChange(event as unknown as ChangeEvent<HTMLInputElement>, date, {\n                        error: null,\n                        value: node.value,\n                    });\n                }\n            }\n        },\n        [setShowCalendar, setDate, onChange],\n    );\n\n    const handleTabOutsideCalendar = useCallback(\n        (e: KeyboardEvent) => {\n            e.preventDefault();\n            setShowCalendar(false);\n            iconButtonRef.current && iconButtonRef.current.focus();\n        },\n        [setShowCalendar],\n    );\n\n    useClickOutside(datepickerRef, hideCalendar);\n    useFocusOutside(datepickerRef, hideCalendar);\n    useKeyListener(calendarRef, [\"Escape\"], () => {\n        setShowCalendar(false);\n        inputRef.current && inputRef.current.focus();\n    });\n\n    return (\n        <InputGroup\n            id={id}\n            className={clsx(\"jkl-datepicker\", className, {\n                \"jkl-datepicker--open\": showCalendar,\n            })}\n            {...rest}\n            ref={datepickerRef}\n            label={label}\n            labelProps={labelProps}\n            density={density}\n            helpLabel={helpLabel}\n            errorLabel={errorLabel}\n            supportLabelProps={supportLabelProps}\n            tooltipProps={tooltipProps}\n            render={(inputProps) => (\n                // The <div> element handles keyboard events that bubble up from <button> elements inside\n                // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n                <div\n                    data-testid=\"jkl-datepicker__input-wrapper\"\n                    className=\"jkl-datepicker__input-wrapper\"\n                    data-density={density}\n                    tabIndex={-1} // Må være her for Safari onBlur quirk! https://bugs.webkit.org/show_bug.cgi?id=22261\n                    onKeyDown={handleKeyDown}\n                >\n                    <BaseTextInput\n                        ref={unifiedInputRef}\n                        data-testid=\"jkl-datepicker__input\"\n                        data-testautoid={testAutoId}\n                        className=\"jkl-datepicker__input\"\n                        name={name}\n                        defaultValue={defaultValue}\n                        density={density}\n                        value={value}\n                        type=\"text\"\n                        placeholder={placeholder}\n                        width={width}\n                        onFocus={handleFocus}\n                        onBlur={handleBlur}\n                        onClick={clickInput}\n                        onChange={handleChange}\n                        {...inputProps}\n                        action={{\n                            buttonRef: iconButtonRef,\n                            icon: <CalendarIcon />,\n                            label: showCalendar ? hideCalendarLabel : showCalendarLabel,\n                            ...action,\n                            onClick: clickCalendar,\n                            onKeyDown: handleKeyDownAction,\n                        }}\n                    />\n                    <div className=\"jkl-datepicker__calendar-wrapper\">\n                        <Calendar\n                            ref={calendarRef}\n                            density={density}\n                            date={date}\n                            minDate={minDate}\n                            maxDate={maxDate}\n                            days={days}\n                            months={months}\n                            monthLabel={monthLabel}\n                            yearLabel={yearLabel}\n                            yearsToShow={yearsToShow}\n                            hidden={!showCalendar}\n                            onDateSelected={handleClickCalendarDay}\n                            onTabOutside={handleTabOutsideCalendar}\n                        />\n                    </div>\n                </div>\n            )}\n        />\n    );\n});\n\nDatePicker.displayName = \"DatePicker\";\n"],"names":["DatePicker","forwardRef","props","forwardedInputRef","testAutoId","id","className","label","labelProps","defaultValue","defaultShow","value","disableBeforeDate","disableBefore","disableAfterDate","disableAfter","yearsToShow","name","helpLabel","errorLabel","invalid","density","days","months","monthLabel","yearLabel","placeholder","width","onChange","onBlur","onFocus","onKeyDown","action","showCalendarLabel","hideCalendarLabel","supportLabelProps","tooltipProps","rest","process","env","NODE_ENV","console","warn","parseDateString","minDate","startOfDay","maxDate","date","setDate","useState","getInitialDate","error","setError","showCalendar","setShowCalendar","calendarRef","useAnimatedHeight","iconButtonRef","useRef","inputRef","unifiedInputRef","useCallback","instance","current","datepickerRef","handleFocus","e","contains","relatedTarget","target","handleBlur","handleKeyDownAction","key","preventDefault","stopPropagation","handleKeyDown","nextValue","currentTarget","test","handleChange","nextDate","nextError","val","isWithinLowerBound","isWithinUpperBound","clickCalendar","flushSync","calendarEl","button","querySelector","focus","onClick","clickInput","hideCalendar","handleClickCalendarDay","node","formatInput","event","document","createEvent","initEvent","dispatchEvent","handleTabOutsideCalendar","useClickOutside","useFocusOutside","useKeyListener","jsx","InputGroup","clsx","ref","render","inputProps","jsxs","tabIndex","children","BaseTextInput","type","buttonRef","icon","CalendarIcon","Calendar","hidden","onDateSelected","onTabOutside","displayName"],"mappings":"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"}

package/build/es/components/datepicker/internal/Calendar.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import n from"classnames";import{forwardRef as a,useReducer as o,useEffect as r,useCallback as c,useRef as i}from"react";import{flushSync as s}from"react-dom";import"../../../hooks/useScreen/useScreen.js";import{useId as l}from"../../../hooks/useId/useId.js";import"../../icon/Icon.js";import"../../icon/icons/animated/ArrowVerticalAnimated.js";import"../../icon/icons/animated/ArrowHorizontalAnimated.js";import"../../icon/icons/animated/PlusRemoveAnimated.js";import"../../icon/icons/ArrowDownIcon.js";import{ArrowLeftIcon as d}from"../../icon/icons/ArrowLeftIcon.js";import"../../icon/icons/ArrowNorthEastIcon.js";import{ArrowRightIcon as u}from"../../icon/icons/ArrowRightIcon.js";import"../../icon/icons/ArrowUpIcon.js";import"../../icon/icons/CalendarIcon.js";import"../../icon/icons/CheckIcon.js";import{ChevronDownIcon as m}from"../../icon/icons/ChevronDownIcon.js";import"../../icon/icons/ChevronLeftIcon.js";import"../../icon/icons/ChevronRightIcon.js";import"../../icon/icons/ChevronUpIcon.js";import"../../icon/icons/CloseIcon.js";import"../../icon/icons/CopyIcon.js";import"../../icon/icons/DotsIcon.js";import"../../icon/icons/DragIcon.js";import"../../icon/icons/ErrorIcon.js";import"../../icon/icons/GreenCheckIcon.js";import"../../icon/icons/HamburgerIcon.js";import"../../icon/icons/InfoIcon.js";import"../../icon/icons/LinkIcon.js";import"../../icon/icons/PlusIcon.js";import"../../icon/icons/QuestionIcon.js";import"../../icon/icons/RedCrossIcon.js";import"../../icon/icons/SearchIcon.js";import"../../icon/icons/SuccessIcon.js";import"../../icon/icons/WarningIcon.js";import"../../icon/icons/MinusIcon.js";import"../../icon/icons/ThumbDownIcon.js";import"../../icon/icons/ThumbUpIcon.js";import"../../icon/icons/TrashCanIcon.js";import"../../icon/icons/PenIcon.js";import{calendarReducer as h,calendarInitializer as p}from"./calendarReducer.js";import{useCalendar as g}from"./useCalendar.js";import{getInitialDateShown as f,isBackDisabled as j,subtractMonth as b,isForwardDisabled as v,addMonth as k,getYearSelectOptions as w,getMonthSelectOptions as D,DEFAULT_YEARS_TO_SHOW as I}from"./utils.js";const y=["Januar","Februar","Mars","April","Mai","Juni","Juli","August","September","Oktober","November","Desember"],A=["man","tir","ons","tor","fre","lør","søn"],S=a(((a,S)=>{const{hidden:_,date:M,defaultSelected:C,density:F,minDate:N,maxDate:E,days:Y=A,months:x=y,monthLabel:O="Velg måned",yearLabel:T="Velg år",yearsToShow:$=I,onTabOutside:R,...L}=a,q=l("jkl-calendar"),[{offset:P,selectedDate:U,shownDate:K},H]=o(h,f(M,C,N,E),p),J=K.getMonth(),V=K.getFullYear();r((()=>{H({type:"SET_SELECTED_DATE",newDate:f(M,C,N,E)})}),[M,C,N,E]);const W=c((e=>{H({type:"SET_OFFSET",newOffset:e})}),[]),{calendars:z,getBackProps:B,getDateProps:G,getForwardProps:Q,handleOffsetChanged:X}=g({date:U,selected:U,minDate:N,maxDate:E,offset:P,onOffsetChanged:W,firstDayOfWeek:1,...L}),Z=i(null),ee=c((e=>{if(!Z.current)return;const t=document.activeElement,n=Z.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]'),a=async e=>{null==t||t.setAttribute("tabindex","-1"),e.setAttribute("tabindex","0"),e.focus()};n.forEach(((o,r)=>{const c=r+e;if(o==t)if(c<=n.length-1&&c>=0)a(n[c]);else if(e<0){if(j({calendars:z,minDate:N})||(s((()=>{X(P-b({calendars:z,offset:1,minDate:N}))})),!Z.current))return;const e=Z.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[e.length+c]&&(e[0].setAttribute("tabindex","-1"),a(e[e.length+c]))}else{if(v({calendars:z,maxDate:E})||(s((()=>{X(P+k({calendars:z,offset:1,maxDate:E}))})),!Z.current))return;const e=Z.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[c-n.length]&&(e[0].setAttribute("tabindex","-1"),a(e[c-n.length]))}}))}),[X,Z,P,z,E,N]),te=c((e=>{switch(e.key){case"ArrowUp":ee(-7),e.preventDefault();break;case"ArrowRight":ee(1),e.preventDefault();break;case"ArrowDown":ee(7),e.preventDefault();break;case"ArrowLeft":ee(-1),e.preventDefault()}}),[ee]),ne=c((e=>{var t;if("Tab"!==e.key)return;const n=null==(t=Z.current)?void 0:t.querySelectorAll('button:not([disabled]):not([tabindex="-1"]), select');if(!n)return;const a=n[0],o=n[n.length-1];e.shiftKey||document.activeElement!==o?e.shiftKey&&document.activeElement===a&&(o.focus(),e.preventDefault()):(a.focus(),e.preventDefault())}),[]),ae=c((e=>{const{date:t,selected:n,selectable:a,prevMonth:o,nextMonth:r}=e;return!!a&&!(!n&&t.toString()!==(null==N?void 0:N.toString())&&(o||r||K.getFullYear()!==t.getFullYear()||U.getMonth()===t.getMonth()||1!==t.getDate()))}),[K,N,U]),oe=c((()=>{N&&K.getFullYear()-N.getFullYear()==0&&K.getMonth()-N.getMonth()==1?document.querySelectorAll(".jkl-calendar-navigation__arrow")[1].focus():E&&E.getFullYear()-K.getFullYear()==0&&E.getMonth()-K.getMonth()==1&&document.querySelectorAll(".jkl-calendar-navigation__arrow")[0].focus()}),[N,E,K]),re=c((e=>{if(4!==e.target.value.length)return;const t=Number.parseInt(e.target.value);if(Number.isNaN(t))return;let n=12*(t-K.getFullYear());const a=new Date(K.getFullYear(),K.getMonth()+n,K.getDate());E&&E.getFullYear()===a.getFullYear()&&E.getMonth()<a.getMonth()?n-=a.getMonth()-E.getMonth():N&&N.getFullYear()===a.getFullYear()&&N.getMonth()>a.getMonth()&&(n+=N.getMonth()-a.getMonth()),H({type:"ADD_OFFSET",addedOffset:n})}),[K,N,E]),ce=c((e=>{if(!U&&!M)return;const t=K.getFullYear()-(U||new Date).getFullYear(),n=Number.parseInt(e.target.value)-(U||new Date).getMonth();H({type:"SET_OFFSET",newOffset:12*t+n})}),[U,M,K]),ie=w(V,N,E,$),se=D(V,x,N,E);return e("div",{ref:S,id:q,className:n("jkl-calendar",{"jkl-calendar--hidden":_}),"data-testid":"jkl-calendar",children:t("div",{className:"jkl-calendar__padding",ref:Z,onKeyDown:ne,children:[t("fieldset",{className:"jkl-calendar-navigation",children:[t("div",{children:[e("button",{...B({calendars:z,onClick:oe}),className:"jkl-calendar-navigation__arrow",type:"button",children:e(d,{variant:"medium",bold:!0})}),e("button",{...Q({calendars:z,onClick:oe}),className:"jkl-calendar-navigation__arrow",type:"button",children:e(u,{variant:"medium",bold:!0})})]}),t("div",{children:[t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:ce,className:"jkl-calendar-navigation-dropdown__select","aria-label":O,value:J.toString(),children:se.map((({label:t,value:n})=>e("option",{value:n,children:t},n)))}),e(m,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]}),t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:re,className:"jkl-calendar-navigation-dropdown__select","aria-label":T,value:V.toString(),children:ie.map((t=>e("option",{value:t,children:t},t)))}),e(m,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]})]})]}),z.map((n=>t("table",{className:"jkl-calendar-table","data-testid":"jkl-datepicker-calendar",children:[t("caption",{className:"jkl-sr-only",children:[x[n.month],", ",n.year]}),e("thead",{children:e("tr",{children:Y.map((t=>e("th",{children:t},`${n.month}${n.year}${t}`)))})}),e("tbody",{"data-testid":"jkl-datepicker-dates",children:n.weeks.map(((t,a)=>e("tr",{children:t.map(((t,o)=>{const r=`${n.month}${n.year}${a}${o}`;if("string"==typeof t)return e("td",{className:"jkl-calendar__date jkl-calendar__date--empty",children:t},r);const{date:c,selectable:i,today:s,prevMonth:l,nextMonth:d}=t;return e("td",{children:e("button",{...G({dateObj:t}),type:"button",className:"jkl-calendar-date-button",tabIndex:ae(t)?0:-1,"aria-label":`${c.getDate()}. ${x[c.getMonth()].toLowerCase()}`,"aria-current":s?"date":void 0,"data-adjacent":l||d?"true":void 0,disabled:!i,onKeyDown:te,children:e("span",{"aria-hidden":"true",children:c.getDate()})})},r)}))},`${n.month}${n.year}${a}`)))})]},`${n.month}${n.year}`)))]})})}));S.displayName="Calendar";export{S as Calendar};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{c as n}from"../../../../clsx-BeLtu-UY.js";import{forwardRef as a,useReducer as o,useEffect as r,useCallback as c,useRef as i}from"react";import{flushSync as s}from"react-dom";import"../../../hooks/useScreen/useScreen.js";import{useId as l}from"../../../hooks/useId/useId.js";import"../../icon/Icon.js";import"../../icon/icons/animated/ArrowVerticalAnimated.js";import"../../icon/icons/animated/ArrowHorizontalAnimated.js";import"../../icon/icons/animated/PlusRemoveAnimated.js";import"../../icon/icons/ArrowDownIcon.js";import{ArrowLeftIcon as d}from"../../icon/icons/ArrowLeftIcon.js";import"../../icon/icons/ArrowNorthEastIcon.js";import{ArrowRightIcon as u}from"../../icon/icons/ArrowRightIcon.js";import"../../icon/icons/ArrowUpIcon.js";import"../../icon/icons/CalendarIcon.js";import"../../icon/icons/CheckIcon.js";import{ChevronDownIcon as m}from"../../icon/icons/ChevronDownIcon.js";import"../../icon/icons/ChevronLeftIcon.js";import"../../icon/icons/ChevronRightIcon.js";import"../../icon/icons/ChevronUpIcon.js";import"../../icon/icons/CloseIcon.js";import"../../icon/icons/CopyIcon.js";import"../../icon/icons/DotsIcon.js";import"../../icon/icons/DragIcon.js";import"../../icon/icons/ErrorIcon.js";import"../../icon/icons/GreenCheckIcon.js";import"../../icon/icons/HamburgerIcon.js";import"../../icon/icons/InfoIcon.js";import"../../icon/icons/LinkIcon.js";import"../../icon/icons/PlusIcon.js";import"../../icon/icons/QuestionIcon.js";import"../../icon/icons/RedCrossIcon.js";import"../../icon/icons/SearchIcon.js";import"../../icon/icons/SuccessIcon.js";import"../../icon/icons/WarningIcon.js";import"../../icon/icons/MinusIcon.js";import"../../icon/icons/ThumbDownIcon.js";import"../../icon/icons/ThumbUpIcon.js";import"../../icon/icons/TrashCanIcon.js";import"../../icon/icons/PenIcon.js";import{calendarReducer as h,calendarInitializer as p}from"./calendarReducer.js";import{useCalendar as g}from"./useCalendar.js";import{getInitialDateShown as j,isBackDisabled as f,subtractMonth as b,isForwardDisabled as v,addMonth as k,getYearSelectOptions as w,getMonthSelectOptions as D,DEFAULT_YEARS_TO_SHOW as I}from"./utils.js";const y=["Januar","Februar","Mars","April","Mai","Juni","Juli","August","September","Oktober","November","Desember"],A=["man","tir","ons","tor","fre","lør","søn"],S=a(((a,S)=>{const{hidden:_,date:M,defaultSelected:C,density:F,minDate:N,maxDate:E,days:x=A,months:Y=y,monthLabel:O="Velg måned",yearLabel:T="Velg år",yearsToShow:$=I,onTabOutside:R,...L}=a,q=l("jkl-calendar"),[{offset:P,selectedDate:U,shownDate:K},H]=o(h,j(M,C,N,E),p),J=K.getMonth(),V=K.getFullYear();r((()=>{H({type:"SET_SELECTED_DATE",newDate:j(M,C,N,E)})}),[M,C,N,E]);const W=c((e=>{H({type:"SET_OFFSET",newOffset:e})}),[]),{calendars:z,getBackProps:B,getDateProps:G,getForwardProps:Q,handleOffsetChanged:X}=g({date:U,selected:U,minDate:N,maxDate:E,offset:P,onOffsetChanged:W,firstDayOfWeek:1,...L}),Z=i(null),ee=c((e=>{if(!Z.current)return;const t=document.activeElement,n=Z.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]'),a=async e=>{null==t||t.setAttribute("tabindex","-1"),e.setAttribute("tabindex","0"),e.focus()};n.forEach(((o,r)=>{const c=r+e;if(o==t)if(c<=n.length-1&&c>=0)a(n[c]);else if(e<0){if(f({calendars:z,minDate:N})||(s((()=>{X(P-b({calendars:z,offset:1,minDate:N}))})),!Z.current))return;const e=Z.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[e.length+c]&&(e[0].setAttribute("tabindex","-1"),a(e[e.length+c]))}else{if(v({calendars:z,maxDate:E})||(s((()=>{X(P+k({calendars:z,offset:1,maxDate:E}))})),!Z.current))return;const e=Z.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[c-n.length]&&(e[0].setAttribute("tabindex","-1"),a(e[c-n.length]))}}))}),[X,Z,P,z,E,N]),te=c((e=>{switch(e.key){case"ArrowUp":ee(-7),e.preventDefault();break;case"ArrowRight":ee(1),e.preventDefault();break;case"ArrowDown":ee(7),e.preventDefault();break;case"ArrowLeft":ee(-1),e.preventDefault()}}),[ee]),ne=c((e=>{var t;if("Tab"!==e.key)return;const n=null==(t=Z.current)?void 0:t.querySelectorAll('button:not([disabled]):not([tabindex="-1"]), select');if(!n)return;const a=n[0],o=n[n.length-1];e.shiftKey||document.activeElement!==o?e.shiftKey&&document.activeElement===a&&(o.focus(),e.preventDefault()):(a.focus(),e.preventDefault())}),[]),ae=c((e=>{const{date:t,selected:n,selectable:a,prevMonth:o,nextMonth:r}=e;return!!a&&!(!n&&t.toString()!==(null==N?void 0:N.toString())&&(o||r||K.getFullYear()!==t.getFullYear()||U.getMonth()===t.getMonth()||1!==t.getDate()))}),[K,N,U]),oe=c((()=>{N&&K.getFullYear()-N.getFullYear()==0&&K.getMonth()-N.getMonth()==1?document.querySelectorAll(".jkl-calendar-navigation__arrow")[1].focus():E&&E.getFullYear()-K.getFullYear()==0&&E.getMonth()-K.getMonth()==1&&document.querySelectorAll(".jkl-calendar-navigation__arrow")[0].focus()}),[N,E,K]),re=c((e=>{if(4!==e.target.value.length)return;const t=Number.parseInt(e.target.value);if(Number.isNaN(t))return;let n=12*(t-K.getFullYear());const a=new Date(K.getFullYear(),K.getMonth()+n,K.getDate());E&&E.getFullYear()===a.getFullYear()&&E.getMonth()<a.getMonth()?n-=a.getMonth()-E.getMonth():N&&N.getFullYear()===a.getFullYear()&&N.getMonth()>a.getMonth()&&(n+=N.getMonth()-a.getMonth()),H({type:"ADD_OFFSET",addedOffset:n})}),[K,N,E]),ce=c((e=>{if(!U&&!M)return;const t=K.getFullYear()-(U||new Date).getFullYear(),n=Number.parseInt(e.target.value)-(U||new Date).getMonth();H({type:"SET_OFFSET",newOffset:12*t+n})}),[U,M,K]),ie=w(V,N,E,$),se=D(V,Y,N,E);return e("div",{ref:S,id:q,className:n("jkl-calendar",{"jkl-calendar--hidden":_}),"data-testid":"jkl-calendar",children:t("div",{className:"jkl-calendar__padding",ref:Z,onKeyDown:ne,children:[t("fieldset",{className:"jkl-calendar-navigation",children:[t("div",{children:[e("button",{...B({calendars:z,onClick:oe}),className:"jkl-calendar-navigation__arrow",type:"button",children:e(d,{variant:"medium",bold:!0})}),e("button",{...Q({calendars:z,onClick:oe}),className:"jkl-calendar-navigation__arrow",type:"button",children:e(u,{variant:"medium",bold:!0})})]}),t("div",{children:[t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:ce,className:"jkl-calendar-navigation-dropdown__select","aria-label":O,value:J.toString(),children:se.map((({label:t,value:n})=>e("option",{value:n,children:t},n)))}),e(m,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]}),t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:re,className:"jkl-calendar-navigation-dropdown__select","aria-label":T,value:V.toString(),children:ie.map((t=>e("option",{value:t,children:t},t)))}),e(m,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]})]})]}),z.map((n=>t("table",{className:"jkl-calendar-table","data-testid":"jkl-datepicker-calendar",children:[t("caption",{className:"jkl-sr-only",children:[Y[n.month],", ",n.year]}),e("thead",{children:e("tr",{children:x.map((t=>e("th",{children:t},`${n.month}${n.year}${t}`)))})}),e("tbody",{"data-testid":"jkl-datepicker-dates",children:n.weeks.map(((t,a)=>e("tr",{children:t.map(((t,o)=>{const r=`${n.month}${n.year}${a}${o}`;if("string"==typeof t)return e("td",{className:"jkl-calendar__date jkl-calendar__date--empty",children:t},r);const{date:c,selectable:i,today:s,prevMonth:l,nextMonth:d}=t;return e("td",{children:e("button",{...G({dateObj:t}),type:"button",className:"jkl-calendar-date-button",tabIndex:ae(t)?0:-1,"aria-label":`${c.getDate()}. ${Y[c.getMonth()].toLowerCase()}`,"aria-current":s?"date":void 0,"data-adjacent":l||d?"true":void 0,disabled:!i,onKeyDown:te,children:e("span",{"aria-hidden":"true",children:c.getDate()})})},r)}))},`${n.month}${n.year}${a}`)))})]},`${n.month}${n.year}`)))]})})}));S.displayName="Calendar";export{S as Calendar};
 //# sourceMappingURL=Calendar.js.map

package/build/es/components/datepicker/internal/Calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","sources":["../../../../../src/components/datepicker/internal/Calendar.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport React, { forwardRef, useCallback, useEffect, useReducer, useRef } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport { Density } from \"../../../core\";\nimport { useId } from \"../../../hooks\";\nimport { ArrowLeftIcon, ArrowRightIcon, ChevronDownIcon } from \"../../icon\";\nimport type { YearsToShow } from \"../types\";\nimport { calendarInitializer, calendarReducer } from \"./calendarReducer\";\nimport { useCalendar, UseCalendarProps } from \"./useCalendar\";\nimport {\n    addMonth,\n    subtractMonth,\n    isBackDisabled,\n    isForwardDisabled,\n    getYearSelectOptions,\n    getMonthSelectOptions,\n    DateInfo,\n    getInitialDateShown,\n    DEFAULT_YEARS_TO_SHOW,\n} from \"./utils\";\n\ninterface CalendarProps\n    extends Omit<UseCalendarProps, \"date\" | \"onOffsetChanged\" | \"offset\" | \"firstDayOfWeek\" | \"selected\"> {\n    date: Date | null;\n    density?: Density;\n    defaultSelected?: Date;\n    hidden?: boolean;\n    days?: string[];\n    months?: string[];\n    monthLabel?: string;\n    yearLabel?: string;\n    yearsToShow?: YearsToShow;\n    onTabOutside: React.KeyboardEventHandler;\n}\n\nconst defaultMonths = [\n    \"Januar\",\n    \"Februar\",\n    \"Mars\",\n    \"April\",\n    \"Mai\",\n    \"Juni\",\n    \"Juli\",\n    \"August\",\n    \"September\",\n    \"Oktober\",\n    \"November\",\n    \"Desember\",\n];\n\nconst defaultDays = [\"man\", \"tir\", \"ons\", \"tor\", \"fre\", \"lør\", \"søn\"];\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>((props, ref) => {\n    const {\n        hidden,\n        date,\n        defaultSelected,\n        density,\n        minDate,\n        maxDate,\n        days = defaultDays,\n        months = defaultMonths,\n        monthLabel = \"Velg måned\",\n        yearLabel = \"Velg år\",\n        yearsToShow = DEFAULT_YEARS_TO_SHOW,\n        onTabOutside,\n        ...rest\n    } = props;\n\n    const id = useId(\"jkl-calendar\");\n\n    const [{ offset, selectedDate, shownDate }, dispatch] = useReducer(\n        calendarReducer,\n        getInitialDateShown(date, defaultSelected, minDate, maxDate),\n        calendarInitializer,\n    );\n\n    const shownMonth = shownDate.getMonth();\n    const shownYear = shownDate.getFullYear();\n\n    useEffect(() => {\n        dispatch({\n            type: \"SET_SELECTED_DATE\",\n            newDate: getInitialDateShown(date, defaultSelected, minDate, maxDate),\n        });\n    }, [date, defaultSelected, minDate, maxDate]);\n\n    const onOffsetChanged = useCallback((newOffset: number) => {\n        dispatch({\n            type: \"SET_OFFSET\",\n            newOffset,\n        });\n    }, []);\n\n    const { calendars, getBackProps, getDateProps, getForwardProps, handleOffsetChanged } = useCalendar({\n        date: selectedDate,\n        selected: selectedDate,\n        minDate,\n        maxDate,\n        offset,\n        onOffsetChanged,\n        firstDayOfWeek: 1,\n        ...rest,\n    });\n\n    /// Calendar keyboard navigation\n\n    const calendarPaddingRef = useRef<HTMLDivElement>(null);\n    const doFocusChange = useCallback(\n        (offsetDiff: number) => {\n            if (!calendarPaddingRef.current) {\n                return;\n            }\n\n            const e = document.activeElement;\n            const buttons = calendarPaddingRef.current.querySelectorAll<HTMLButtonElement>(\n                'button.jkl-calendar-date-button:not([data-adjacent=\"true\"]',\n            );\n\n            const changeFocusTo = async (nextButton: HTMLButtonElement) => {\n                e?.setAttribute(\"tabindex\", \"-1\");\n                nextButton.setAttribute(\"tabindex\", \"0\");\n                nextButton.focus();\n            };\n\n            buttons.forEach((el, i) => {\n                const newNodeKey = i + offsetDiff;\n\n                if (el == e) {\n                    if (newNodeKey <= buttons.length - 1 && newNodeKey >= 0) {\n                        changeFocusTo(buttons[newNodeKey]);\n                    } else if (offsetDiff < 0) {\n                        if (isBackDisabled({ calendars, minDate })) {\n                            return;\n                        }\n\n                        // Hvis newNodeKey er utenfor samlingen med knapper så har vi prøvd å gå til\n                        // en dag utenfor måneden. Er offsetDiff negativ så har vi gått tilbake en\n                        // måned.\n                        flushSync(() => {\n                            handleOffsetChanged(offset - subtractMonth({ calendars, offset: 1, minDate }));\n                        });\n                        if (!calendarPaddingRef.current) {\n                            return;\n                        }\n                        const newButtons = calendarPaddingRef.current.querySelectorAll<HTMLButtonElement>(\n                            'button.jkl-calendar-date-button:not([data-adjacent=\"true\"]',\n                        );\n                        // + - = -\n                        if (newButtons[newButtons.length + newNodeKey]) {\n                            // Sørg for at ikke både 1. i måneden og valgt dag er fokuserbare\n                            newButtons[0].setAttribute(\"tabindex\", \"-1\");\n                            changeFocusTo(newButtons[newButtons.length + newNodeKey]);\n                        }\n                    } else {\n                        if (isForwardDisabled({ calendars, maxDate })) {\n                            return;\n                        }\n\n                        // Hvis newNodeKey er utenfor samlingen med knapper så har vi prøvd å gå til\n                        // en dag utenfor måneden. Er offsetDiff positiv så har vi gått frem en\n                        // måned.\n                        flushSync(() => {\n                            handleOffsetChanged(offset + addMonth({ calendars, offset: 1, maxDate }));\n                        });\n                        if (!calendarPaddingRef.current) {\n                            return;\n                        }\n                        const newButtons = calendarPaddingRef.current.querySelectorAll<HTMLButtonElement>(\n                            'button.jkl-calendar-date-button:not([data-adjacent=\"true\"]',\n                        );\n                        // NewNodeKey er basert på forrige måneds liste med knapper. For at verdien skal bli\n                        // riktig i vår nye måned må vi trekke fra anntal dager fra forrige måned.\n                        if (newButtons[newNodeKey - buttons.length]) {\n                            // Sørg for at ikke både 1. i måneden og valgt dag er fokuserbare\n                            newButtons[0].setAttribute(\"tabindex\", \"-1\");\n                            changeFocusTo(newButtons[newNodeKey - buttons.length]);\n                        }\n                    }\n                }\n            });\n        },\n        [handleOffsetChanged, calendarPaddingRef, offset, calendars, maxDate, minDate],\n    );\n\n    const handleArrowNavigation = useCallback(\n        (event: React.KeyboardEvent) => {\n            switch (event.key) {\n                case \"ArrowUp\":\n                    doFocusChange(-7);\n                    event.preventDefault();\n                    break;\n                case \"ArrowRight\":\n                    doFocusChange(1);\n                    event.preventDefault();\n                    break;\n                case \"ArrowDown\":\n                    doFocusChange(7);\n                    event.preventDefault();\n                    break;\n                case \"ArrowLeft\":\n                    doFocusChange(-1);\n                    event.preventDefault();\n                    break;\n                default:\n                    break;\n            }\n        },\n        [doFocusChange],\n    );\n\n    const handleTabInside: React.KeyboardEventHandler = useCallback((event) => {\n        if (event.key !== \"Tab\") return;\n\n        const focusableElements = calendarPaddingRef.current?.querySelectorAll<HTMLElement>(\n            'button:not([disabled]):not([tabindex=\"-1\"]), select',\n        );\n\n        if (!focusableElements) return;\n\n        const firstElement = focusableElements[0];\n        const lastElement = focusableElements[focusableElements.length - 1];\n\n        if (!event.shiftKey && document.activeElement === lastElement) {\n            firstElement.focus();\n            event.preventDefault();\n        } else if (event.shiftKey && document.activeElement === firstElement) {\n            lastElement.focus();\n            event.preventDefault();\n        }\n    }, []);\n\n    const isFocusableDate = useCallback(\n        (dateInfo: DateInfo) => {\n            const { date, selected, selectable, prevMonth, nextMonth } = dateInfo;\n\n            // Datoen kan ikke velges\n            if (!selectable) {\n                return false;\n            }\n            // Datoen er valgt dato\n            if (selected) {\n                return true;\n            }\n            // Datoen er første valgbare dato\n            if (date.toString() === minDate?.toString()) {\n                return true;\n            }\n\n            // Datoen er første i måneden som vises\n            if (\n                !prevMonth &&\n                !nextMonth &&\n                shownDate.getFullYear() === date.getFullYear() &&\n                selectedDate.getMonth() !== date.getMonth() &&\n                date.getDate() === 1\n            ) {\n                return true;\n            }\n\n            return false;\n        },\n        [shownDate, minDate, selectedDate],\n    );\n\n    const handleGotoEdgeMonth = useCallback(() => {\n        if (\n            // Vi er i ferd med å gå til første måned\n            minDate &&\n            shownDate.getFullYear() - minDate.getFullYear() === 0 &&\n            shownDate.getMonth() - minDate.getMonth() === 1\n        ) {\n            // Fokuser på \"neste månded\"-knappen\n            document.querySelectorAll<HTMLButtonElement>(\".jkl-calendar-navigation__arrow\")[1].focus();\n        } else if (\n            // Vi er i ferd med å gå til siste måned\n            maxDate &&\n            maxDate.getFullYear() - shownDate.getFullYear() === 0 &&\n            maxDate.getMonth() - shownDate.getMonth() === 1\n        ) {\n            // Fokuser på \"forrige månded\"-knappen\n            document.querySelectorAll<HTMLButtonElement>(\".jkl-calendar-navigation__arrow\")[0].focus();\n        }\n    }, [minDate, maxDate, shownDate]);\n\n    /// Extended variant events\n\n    const handleYearChange = useCallback<React.ChangeEventHandler<HTMLSelectElement>>(\n        (event) => {\n            if (event.target.value.length !== 4) {\n                return;\n            }\n\n            const year: number = Number.parseInt(event.target.value);\n            if (Number.isNaN(year)) {\n                return;\n            }\n\n            let offset = (year - shownDate.getFullYear()) * 12;\n            const expectedDate = new Date(shownDate.getFullYear(), shownDate.getMonth() + offset, shownDate.getDate());\n\n            // Pass på at vi ikke hopper forbi maks. eller min. dato\n            if (\n                maxDate &&\n                maxDate.getFullYear() === expectedDate.getFullYear() &&\n                maxDate.getMonth() < expectedDate.getMonth()\n            ) {\n                offset -= expectedDate.getMonth() - maxDate.getMonth();\n            } else if (\n                minDate &&\n                minDate.getFullYear() === expectedDate.getFullYear() &&\n                minDate.getMonth() > expectedDate.getMonth()\n            ) {\n                offset += minDate.getMonth() - expectedDate.getMonth();\n            }\n\n            dispatch({\n                type: \"ADD_OFFSET\",\n                addedOffset: offset,\n            });\n\n            return;\n        },\n        [shownDate, minDate, maxDate],\n    );\n\n    const handleMonthChange = useCallback<React.ChangeEventHandler<HTMLSelectElement>>(\n        (event) => {\n            if (!selectedDate && !date) {\n                return;\n            }\n\n            const yearDiff = shownDate.getFullYear() - (selectedDate || new Date()).getFullYear();\n            const monthDiff = Number.parseInt(event.target.value) - (selectedDate || new Date()).getMonth();\n\n            dispatch({\n                type: \"SET_OFFSET\",\n                newOffset: yearDiff * 12 + monthDiff,\n            });\n\n            return;\n        },\n        [selectedDate, date, shownDate],\n    );\n\n    const yearSelectOptions = getYearSelectOptions(shownYear, minDate, maxDate, yearsToShow);\n    const monthSelectOptions = getMonthSelectOptions(shownYear, months, minDate, maxDate);\n\n    return (\n        <div\n            ref={ref}\n            id={id}\n            className={cn(\"jkl-calendar\", {\n                \"jkl-calendar--hidden\": hidden,\n            })}\n            data-testid=\"jkl-calendar\"\n        >\n            {/* Vi lytter på på trykk på Tab inne i kalenderen for å håndtere fokus */}\n            {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n            <div className=\"jkl-calendar__padding\" ref={calendarPaddingRef} onKeyDown={handleTabInside}>\n                <fieldset className=\"jkl-calendar-navigation\">\n                    <div>\n                        <button\n                            {...getBackProps({ calendars, onClick: handleGotoEdgeMonth })}\n                            className=\"jkl-calendar-navigation__arrow\"\n                            type=\"button\"\n                        >\n                            <ArrowLeftIcon variant=\"medium\" bold />\n                        </button>\n                        <button\n                            {...getForwardProps({ calendars, onClick: handleGotoEdgeMonth })}\n                            className=\"jkl-calendar-navigation__arrow\"\n                            type=\"button\"\n                        >\n                            <ArrowRightIcon variant=\"medium\" bold />\n                        </button>\n                    </div>\n                    <div>\n                        <div className=\"jkl-calendar-navigation-dropdown\">\n                            <select\n                                onChange={handleMonthChange}\n                                className=\"jkl-calendar-navigation-dropdown__select\"\n                                aria-label={monthLabel}\n                                value={shownMonth.toString()}\n                            >\n                                {monthSelectOptions.map(({ label, value }) => (\n                                    <option key={value} value={value}>\n                                        {label}\n                                    </option>\n                                ))}\n                            </select>\n                            <ChevronDownIcon bold className=\"jkl-calendar-navigation-dropdown__chevron\" />\n                        </div>\n                        <div className=\"jkl-calendar-navigation-dropdown\">\n                            <select\n                                onChange={handleYearChange}\n                                className=\"jkl-calendar-navigation-dropdown__select\"\n                                aria-label={yearLabel}\n                                value={shownYear.toString()}\n                            >\n                                {yearSelectOptions.map((year) => (\n                                    <option key={year} value={year}>\n                                        {year}\n                                    </option>\n                                ))}\n                            </select>\n                            <ChevronDownIcon bold className=\"jkl-calendar-navigation-dropdown__chevron\" />\n                        </div>\n                    </div>\n                </fieldset>\n                {calendars.map((calendar) => (\n                    <table\n                        className=\"jkl-calendar-table\"\n                        key={`${calendar.month}${calendar.year}`}\n                        data-testid=\"jkl-datepicker-calendar\"\n                    >\n                        <caption className=\"jkl-sr-only\">\n                            {months[calendar.month]}, {calendar.year}\n                        </caption>\n                        <thead>\n                            <tr>\n                                {days.map((weekday) => (\n                                    <th key={`${calendar.month}${calendar.year}${weekday}`}>{weekday}</th>\n                                ))}\n                            </tr>\n                        </thead>\n                        <tbody data-testid=\"jkl-datepicker-dates\">\n                            {calendar.weeks.map((week, weekIndex) => (\n                                <tr key={`${calendar.month}${calendar.year}${weekIndex}`}>\n                                    {week.map((dateInfo, index) => {\n                                        const key = `${calendar.month}${calendar.year}${weekIndex}${index}`;\n                                        if (typeof dateInfo === \"string\") {\n                                            return (\n                                                <td className=\"jkl-calendar__date jkl-calendar__date--empty\" key={key}>\n                                                    {dateInfo}\n                                                </td>\n                                            );\n                                        }\n                                        const { date, selectable, today, prevMonth, nextMonth } = dateInfo;\n\n                                        return (\n                                            <td key={key}>\n                                                <button\n                                                    {...getDateProps({\n                                                        dateObj: dateInfo,\n                                                    })}\n                                                    type=\"button\"\n                                                    className=\"jkl-calendar-date-button\"\n                                                    tabIndex={isFocusableDate(dateInfo) ? 0 : -1}\n                                                    aria-label={`${date.getDate()}. ${months[\n                                                        date.getMonth()\n                                                    ].toLowerCase()}`}\n                                                    aria-current={today ? \"date\" : undefined}\n                                                    data-adjacent={prevMonth || nextMonth ? \"true\" : undefined}\n                                                    disabled={!selectable}\n                                                    onKeyDown={handleArrowNavigation}\n                                                >\n                                                    <span aria-hidden=\"true\">{date.getDate()}</span>\n                                                </button>\n                                            </td>\n                                        );\n                                    })}\n                                </tr>\n                            ))}\n                        </tbody>\n                    </table>\n                ))}\n            </div>\n        </div>\n    );\n});\n\nCalendar.displayName = \"Calendar\";\n"],"names":["defaultMonths","defaultDays","Calendar","forwardRef","props","ref","hidden","date","defaultSelected","density","minDate","maxDate","days","months","monthLabel","yearLabel","yearsToShow","DEFAULT_YEARS_TO_SHOW","onTabOutside","rest","id","useId","offset","selectedDate","shownDate","dispatch","useReducer","calendarReducer","getInitialDateShown","calendarInitializer","shownMonth","getMonth","shownYear","getFullYear","useEffect","type","newDate","onOffsetChanged","useCallback","newOffset","calendars","getBackProps","getDateProps","getForwardProps","handleOffsetChanged","useCalendar","selected","firstDayOfWeek","calendarPaddingRef","useRef","doFocusChange","offsetDiff","current","e","document","activeElement","buttons","querySelectorAll","changeFocusTo","async","nextButton","setAttribute","focus","forEach","el","i","newNodeKey","length","isBackDisabled","flushSync","subtractMonth","newButtons","isForwardDisabled","addMonth","handleArrowNavigation","event","key","preventDefault","handleTabInside","focusableElements","_a","firstElement","lastElement","shiftKey","isFocusableDate","dateInfo","selectable","prevMonth","nextMonth","toString","getDate","handleGotoEdgeMonth","handleYearChange","target","value","year","Number","parseInt","isNaN","expectedDate","Date","addedOffset","handleMonthChange","yearDiff","monthDiff","yearSelectOptions","getYearSelectOptions","monthSelectOptions","getMonthSelectOptions","jsx","className","cn","children","onKeyDown","jsxs","onClick","ArrowLeftIcon","variant","bold","ArrowRightIcon","onChange","map","label","ChevronDownIcon","calendar","month","weekday","weeks","week","weekIndex","index","today","dateObj","tabIndex","toLowerCase","disabled","displayName"],"mappings":"wnEAmCA,MAAMA,EAAgB,CAClB,SACA,UACA,OACA,QACA,MACA,OACA,OACA,SACA,YACA,UACA,WACA,YAGEC,EAAc,CAAC,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,OAElDC,EAAWC,GAA0C,CAACC,EAAOC,KAChE,MACFC,OAAAA,EACAC,KAAAA,EACAC,gBAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,KAAAA,EAAOX,EACPY,OAAAA,EAASb,EACTc,WAAAA,EAAa,aACbC,UAAAA,EAAY,UACZC,YAAAA,EAAcC,EACdC,aAAAA,KACGC,GACHf,EAEEgB,EAAKC,EAAM,kBAERC,OAAAA,EAAQC,aAAAA,EAAcC,UAAAA,GAAaC,GAAYC,EACpDC,EACAC,EAAoBrB,EAAMC,EAAiBE,EAASC,GACpDkB,GAGEC,EAAaN,EAAUO,WACvBC,EAAYR,EAAUS,cAE5BC,GAAU,KACGT,EAAA,CACLU,KAAM,oBACNC,QAASR,EAAoBrB,EAAMC,EAAiBE,EAASC,IAChE,GACF,CAACJ,EAAMC,EAAiBE,EAASC,IAE9B0B,MAAAA,EAAkBC,GAAaC,IACxBd,EAAA,CACLU,KAAM,aACNI,UAAAA,GACH,GACF,KAEKC,UAAAA,EAAWC,aAAAA,EAAcC,aAAAA,EAAcC,gBAAAA,EAAiBC,oBAAAA,GAAwBC,EAAY,CAChGtC,KAAMgB,EACNuB,SAAUvB,EACVb,QAAAA,EACAC,QAAAA,EACAW,OAAAA,EACAe,gBAAAA,EACAU,eAAgB,KACb5B,IAKD6B,EAAqBC,EAAuB,MAC5CC,GAAgBZ,GACjBa,IACO,IAACH,EAAmBI,QACpB,OAGJ,MAAMC,EAAIC,SAASC,cACbC,EAAUR,EAAmBI,QAAQK,iBACvC,8DAGEC,EAAgBC,MAAOC,IACtB,MAAAP,GAAAA,EAAAQ,aAAa,WAAY,MACjBD,EAAAC,aAAa,WAAY,KACpCD,EAAWE,OAAM,EAGbN,EAAAO,SAAQ,CAACC,EAAIC,KACjB,MAAMC,EAAaD,EAAId,EAEvB,GAAIa,GAAMX,EACN,GAAIa,GAAcV,EAAQW,OAAS,GAAKD,GAAc,EACpCR,EAAAF,EAAQU,SAAW,GAC1Bf,EAAa,EAAG,CACnBiB,GAAAA,EAAe,CAAE5B,UAAAA,EAAW9B,QAAAA,MAOhC2D,GAAU,KACczB,EAAAtB,EAASgD,EAAc,CAAE9B,UAAAA,EAAWlB,OAAQ,EAAGZ,QAAAA,IAAU,KAE5EsC,EAAmBI,SACpB,OAEEmB,MAAAA,EAAavB,EAAmBI,QAAQK,iBAC1C,8DAGAc,EAAWA,EAAWJ,OAASD,KAE/BK,EAAW,GAAGV,aAAa,WAAY,MACvCH,EAAca,EAAWA,EAAWJ,OAASD,IACjD,KACG,CACCM,GAAAA,EAAkB,CAAEhC,UAAAA,EAAW7B,QAAAA,MAOnC0D,GAAU,KACczB,EAAAtB,EAASmD,EAAS,CAAEjC,UAAAA,EAAWlB,OAAQ,EAAGX,QAAAA,IAAU,KAEvEqC,EAAmBI,SACpB,OAEEmB,MAAAA,EAAavB,EAAmBI,QAAQK,iBAC1C,8DAIAc,EAAWL,EAAaV,EAAQW,UAEhCI,EAAW,GAAGV,aAAa,WAAY,MACvCH,EAAca,EAAWL,EAAaV,EAAQW,SAEtD,IAEP,GAEL,CAACvB,EAAqBI,EAAoB1B,EAAQkB,EAAW7B,EAASD,IAGpEgE,GAAwBpC,GACzBqC,IACG,OAAQA,EAAMC,KACV,IAAK,UACD1B,IAAc,GACdyB,EAAME,iBACN,MACJ,IAAK,aACD3B,GAAc,GACdyB,EAAME,iBACN,MACJ,IAAK,YACD3B,GAAc,GACdyB,EAAME,iBACN,MACJ,IAAK,YACD3B,IAAc,GACdyB,EAAME,iBAId,GAEJ,CAAC3B,KAGC4B,GAA8CxC,GAAaqC,UACzDA,GAAc,QAAdA,EAAMC,IAAe,OAEnB,MAAAG,EAAoB,OAAAC,EAAAhC,EAAmBI,gBAAnB4B,EAA4BvB,iBAClD,uDAGJ,IAAKsB,EAAmB,OAElBE,MAAAA,EAAeF,EAAkB,GACjCG,EAAcH,EAAkBA,EAAkBZ,OAAS,GAE5DQ,EAAMQ,UAAY7B,SAASC,gBAAkB2B,EAGvCP,EAAMQ,UAAY7B,SAASC,gBAAkB0B,IACpDC,EAAYpB,QACZa,EAAME,mBAJNI,EAAanB,QACba,EAAME,iBAGe,GAE1B,IAEGO,GAAkB9C,GACnB+C,IACS,MAAE9E,KAAAA,EAAMuC,SAAAA,EAAUwC,WAAAA,EAAYC,UAAAA,EAAWC,UAAAA,GAAcH,EAG7D,QAAKC,MAIDxC,GAIAvC,EAAKkF,cAAe,MAAA/E,OAAA,EAAAA,EAAS+E,cAM5BF,GACAC,GACDhE,EAAUS,gBAAkB1B,EAAK0B,eACjCV,EAAaQ,aAAexB,EAAKwB,YACd,IAAnBxB,EAAKmF,WAjBE,GAwBf,CAAClE,EAAWd,EAASa,IAGnBoE,GAAsBrD,GAAY,KAGhC5B,GACAc,EAAUS,cAAgBvB,EAAQuB,eAAkB,GACpDT,EAAUO,WAAarB,EAAQqB,YAAe,EAG9CuB,SAASG,iBAAoC,mCAAmC,GAAGK,QAGnFnD,GACAA,EAAQsB,cAAgBT,EAAUS,eAAkB,GACpDtB,EAAQoB,WAAaP,EAAUO,YAAe,GAG9CuB,SAASG,iBAAoC,mCAAmC,GAAGK,OAAM,GAE9F,CAACpD,EAASC,EAASa,IAIhBoE,GAAmBtD,GACpBqC,IACOA,GAA8B,IAA9BA,EAAMkB,OAAOC,MAAM3B,OACnB,OAGJ,MAAM4B,EAAeC,OAAOC,SAAStB,EAAMkB,OAAOC,OAC9C,GAAAE,OAAOE,MAAMH,GACb,OAGJ,IAAIzE,EAA4C,IAAlCyE,EAAOvE,EAAUS,eAC/B,MAAMkE,EAAe,IAAIC,KAAK5E,EAAUS,cAAeT,EAAUO,WAAaT,EAAQE,EAAUkE,WAI5F/E,GACAA,EAAQsB,gBAAkBkE,EAAalE,eACvCtB,EAAQoB,WAAaoE,EAAapE,WAElCT,GAAU6E,EAAapE,WAAapB,EAAQoB,WAE5CrB,GACAA,EAAQuB,gBAAkBkE,EAAalE,eACvCvB,EAAQqB,WAAaoE,EAAapE,aAElCT,GAAUZ,EAAQqB,WAAaoE,EAAapE,YAGvCN,EAAA,CACLU,KAAM,aACNkE,YAAa/E,GAChB,GAIL,CAACE,EAAWd,EAASC,IAGnB2F,GAAoBhE,GACrBqC,IACO,IAACpD,IAAiBhB,EAClB,OAGEgG,MAAAA,EAAW/E,EAAUS,eAAiBV,GAAoB,IAAA6E,MAAQnE,cAClEuE,EAAYR,OAAOC,SAAStB,EAAMkB,OAAOC,QAAUvE,GAAgB,IAAI6E,MAAQrE,WAE5EN,EAAA,CACLU,KAAM,aACNI,UAAsB,GAAXgE,EAAgBC,GAC9B,GAIL,CAACjF,EAAchB,EAAMiB,IAGnBiF,GAAoBC,EAAqB1E,EAAWtB,EAASC,EAASK,GACtE2F,GAAqBC,EAAsB5E,EAAWnB,EAAQH,EAASC,GAGzE,OAAAkG,EAAC,MAAA,CACGxG,IAAAA,EACAe,GAAAA,EACA0F,UAAWC,EAAG,eAAgB,CAC1B,uBAAwBzG,IAE5B,cAAY,eAIZ0G,WAAC,MAAI,CAAAF,UAAU,wBAAwBzG,IAAK2C,EAAoBiE,UAAWnC,GACvEkC,SAAA,CAACE,EAAA,WAAA,CAASJ,UAAU,0BAChBE,SAAA,CAAAE,EAAC,MACG,CAAAF,SAAA,CAAAH,EAAC,SAAA,IACOpE,EAAa,CAAED,UAAAA,EAAW2E,QAASxB,KACvCmB,UAAU,iCACV3E,KAAK,SAEL6E,SAACH,EAAAO,EAAA,CAAcC,QAAQ,SAASC,MAAI,MAExCT,EAAC,SAAA,IACOlE,EAAgB,CAAEH,UAAAA,EAAW2E,QAASxB,KAC1CmB,UAAU,iCACV3E,KAAK,SAEL6E,SAACH,EAAAU,EAAA,CAAeF,QAAQ,SAASC,MAAI,WAG5C,MACG,CAAAN,SAAA,CAACE,EAAA,MAAA,CAAIJ,UAAU,mCACXE,SAAA,CAAAH,EAAC,SAAA,CACGW,SAAUlB,GACVQ,UAAU,2CACV,aAAYhG,EACZgF,MAAOhE,EAAW2D,WAEjBuB,SAAmBL,GAAAc,KAAI,EAAGC,MAAAA,EAAO5B,MAAAA,KAC9Be,EAAC,SAAmB,CAAAf,MAAAA,EACfkB,SADQU,GAAA5B,OAKpBe,EAAAc,EAAA,CAAgBL,MAAI,EAACR,UAAU,iDAEpCI,EAAC,MAAI,CAAAJ,UAAU,mCACXE,SAAA,CAAAH,EAAC,SAAA,CACGW,SAAU5B,GACVkB,UAAU,2CACV,aAAY/F,EACZ+E,MAAO9D,EAAUyD,WAEhBuB,SAAAP,GAAkBgB,KAAK1B,GACpBc,EAAC,UAAkBf,MAAOC,EACrBiB,SADQjB,GAAAA,OAKpBc,EAAAc,EAAA,CAAgBL,MAAI,EAACR,UAAU,uDAI3CtE,EAAUiF,KAAKG,GACZV,EAAC,QAAA,CACGJ,UAAU,qBAEV,cAAY,0BAEZE,SAAA,CAACE,EAAA,UAAA,CAAQJ,UAAU,cACdE,SAAA,CAAAnG,EAAO+G,EAASC,OAAO,KAAGD,EAAS7B,QAExCc,EAAC,SACGG,SAACH,EAAA,KAAA,CACIG,WAAKS,KAAKK,GACPjB,EAAC,KAAwD,CAAAG,SAAAc,GAAhD,GAAGF,EAASC,QAAQD,EAAS7B,OAAO+B,aAIxD,QAAM,CAAA,cAAY,uBACdd,SAAAY,EAASG,MAAMN,KAAI,CAACO,EAAMC,MACtB,KACI,CAAAjB,SAAAgB,EAAKP,KAAI,CAACpC,EAAU6C,KACXtD,MAAAA,EAAM,GAAGgD,EAASC,QAAQD,EAAS7B,OAAOkC,IAAYC,IACxD,GAAoB,iBAAb7C,EAEF,OAAAwB,EAAA,KAAA,CAAGC,UAAU,+CACTE,YAD6DpC,GAKpE,MAAErE,KAAAA,EAAM+E,WAAAA,EAAY6C,MAAAA,EAAO5C,UAAAA,EAAWC,UAAAA,GAAcH,EAE1D,SACK,KACG,CAAA2B,SAAAH,EAAC,SAAA,IACOnE,EAAa,CACb0F,QAAS/C,IAEblD,KAAK,SACL2E,UAAU,2BACVuB,SAAUjD,GAAgBC,GAAY,GAAI,EAC1C,aAAY,GAAG9E,EAAKmF,cAAc7E,EAC9BN,EAAKwB,YACPuG,gBACF,eAAcH,EAAQ,YAAS,EAC/B,gBAAe5C,GAAaC,EAAY,YAAS,EACjD+C,UAAWjD,EACX2B,UAAWvC,GAEXsC,WAAC,OAAK,CAAA,cAAY,OAAQA,SAAAzG,EAAKmF,eAhB9Bd,EAkBT,KA/BH,GAAGgD,EAASC,QAAQD,EAAS7B,OAAOkC,WAfhD,GAAGL,EAASC,QAAQD,EAAS7B,cAsD9C,IAKZ7F,EAASsI,YAAc"}
+{"version":3,"file":"Calendar.js","sources":["../../../../../src/components/datepicker/internal/Calendar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback, useEffect, useReducer, useRef } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport { Density } from \"../../../core\";\nimport { useId } from \"../../../hooks\";\nimport { ArrowLeftIcon, ArrowRightIcon, ChevronDownIcon } from \"../../icon\";\nimport type { YearsToShow } from \"../types\";\nimport { calendarInitializer, calendarReducer } from \"./calendarReducer\";\nimport { useCalendar, UseCalendarProps } from \"./useCalendar\";\nimport {\n    addMonth,\n    subtractMonth,\n    isBackDisabled,\n    isForwardDisabled,\n    getYearSelectOptions,\n    getMonthSelectOptions,\n    DateInfo,\n    getInitialDateShown,\n    DEFAULT_YEARS_TO_SHOW,\n} from \"./utils\";\n\ninterface CalendarProps\n    extends Omit<UseCalendarProps, \"date\" | \"onOffsetChanged\" | \"offset\" | \"firstDayOfWeek\" | \"selected\"> {\n    date: Date | null;\n    density?: Density;\n    defaultSelected?: Date;\n    hidden?: boolean;\n    days?: string[];\n    months?: string[];\n    monthLabel?: string;\n    yearLabel?: string;\n    yearsToShow?: YearsToShow;\n    onTabOutside: React.KeyboardEventHandler;\n}\n\nconst defaultMonths = [\n    \"Januar\",\n    \"Februar\",\n    \"Mars\",\n    \"April\",\n    \"Mai\",\n    \"Juni\",\n    \"Juli\",\n    \"August\",\n    \"September\",\n    \"Oktober\",\n    \"November\",\n    \"Desember\",\n];\n\nconst defaultDays = [\"man\", \"tir\", \"ons\", \"tor\", \"fre\", \"lør\", \"søn\"];\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>((props, ref) => {\n    const {\n        hidden,\n        date,\n        defaultSelected,\n        density,\n        minDate,\n        maxDate,\n        days = defaultDays,\n        months = defaultMonths,\n        monthLabel = \"Velg måned\",\n        yearLabel = \"Velg år\",\n        yearsToShow = DEFAULT_YEARS_TO_SHOW,\n        onTabOutside,\n        ...rest\n    } = props;\n\n    const id = useId(\"jkl-calendar\");\n\n    const [{ offset, selectedDate, shownDate }, dispatch] = useReducer(\n        calendarReducer,\n        getInitialDateShown(date, defaultSelected, minDate, maxDate),\n        calendarInitializer,\n    );\n\n    const shownMonth = shownDate.getMonth();\n    const shownYear = shownDate.getFullYear();\n\n    useEffect(() => {\n        dispatch({\n            type: \"SET_SELECTED_DATE\",\n            newDate: getInitialDateShown(date, defaultSelected, minDate, maxDate),\n        });\n    }, [date, defaultSelected, minDate, maxDate]);\n\n    const onOffsetChanged = useCallback((newOffset: number) => {\n        dispatch({\n            type: \"SET_OFFSET\",\n            newOffset,\n        });\n    }, []);\n\n    const { calendars, getBackProps, getDateProps, getForwardProps, handleOffsetChanged } = useCalendar({\n        date: selectedDate,\n        selected: selectedDate,\n        minDate,\n        maxDate,\n        offset,\n        onOffsetChanged,\n        firstDayOfWeek: 1,\n        ...rest,\n    });\n\n    /// Calendar keyboard navigation\n\n    const calendarPaddingRef = useRef<HTMLDivElement>(null);\n    const doFocusChange = useCallback(\n        (offsetDiff: number) => {\n            if (!calendarPaddingRef.current) {\n                return;\n            }\n\n            const e = document.activeElement;\n            const buttons = calendarPaddingRef.current.querySelectorAll<HTMLButtonElement>(\n                'button.jkl-calendar-date-button:not([data-adjacent=\"true\"]',\n            );\n\n            const changeFocusTo = async (nextButton: HTMLButtonElement) => {\n                e?.setAttribute(\"tabindex\", \"-1\");\n                nextButton.setAttribute(\"tabindex\", \"0\");\n                nextButton.focus();\n            };\n\n            buttons.forEach((el, i) => {\n                const newNodeKey = i + offsetDiff;\n\n                if (el == e) {\n                    if (newNodeKey <= buttons.length - 1 && newNodeKey >= 0) {\n                        changeFocusTo(buttons[newNodeKey]);\n                    } else if (offsetDiff < 0) {\n                        if (isBackDisabled({ calendars, minDate })) {\n                            return;\n                        }\n\n                        // Hvis newNodeKey er utenfor samlingen med knapper så har vi prøvd å gå til\n                        // en dag utenfor måneden. Er offsetDiff negativ så har vi gått tilbake en\n                        // måned.\n                        flushSync(() => {\n                            handleOffsetChanged(offset - subtractMonth({ calendars, offset: 1, minDate }));\n                        });\n                        if (!calendarPaddingRef.current) {\n                            return;\n                        }\n                        const newButtons = calendarPaddingRef.current.querySelectorAll<HTMLButtonElement>(\n                            'button.jkl-calendar-date-button:not([data-adjacent=\"true\"]',\n                        );\n                        // + - = -\n                        if (newButtons[newButtons.length + newNodeKey]) {\n                            // Sørg for at ikke både 1. i måneden og valgt dag er fokuserbare\n                            newButtons[0].setAttribute(\"tabindex\", \"-1\");\n                            changeFocusTo(newButtons[newButtons.length + newNodeKey]);\n                        }\n                    } else {\n                        if (isForwardDisabled({ calendars, maxDate })) {\n                            return;\n                        }\n\n                        // Hvis newNodeKey er utenfor samlingen med knapper så har vi prøvd å gå til\n                        // en dag utenfor måneden. Er offsetDiff positiv så har vi gått frem en\n                        // måned.\n                        flushSync(() => {\n                            handleOffsetChanged(offset + addMonth({ calendars, offset: 1, maxDate }));\n                        });\n                        if (!calendarPaddingRef.current) {\n                            return;\n                        }\n                        const newButtons = calendarPaddingRef.current.querySelectorAll<HTMLButtonElement>(\n                            'button.jkl-calendar-date-button:not([data-adjacent=\"true\"]',\n                        );\n                        // NewNodeKey er basert på forrige måneds liste med knapper. For at verdien skal bli\n                        // riktig i vår nye måned må vi trekke fra anntal dager fra forrige måned.\n                        if (newButtons[newNodeKey - buttons.length]) {\n                            // Sørg for at ikke både 1. i måneden og valgt dag er fokuserbare\n                            newButtons[0].setAttribute(\"tabindex\", \"-1\");\n                            changeFocusTo(newButtons[newNodeKey - buttons.length]);\n                        }\n                    }\n                }\n            });\n        },\n        [handleOffsetChanged, calendarPaddingRef, offset, calendars, maxDate, minDate],\n    );\n\n    const handleArrowNavigation = useCallback(\n        (event: React.KeyboardEvent) => {\n            switch (event.key) {\n                case \"ArrowUp\":\n                    doFocusChange(-7);\n                    event.preventDefault();\n                    break;\n                case \"ArrowRight\":\n                    doFocusChange(1);\n                    event.preventDefault();\n                    break;\n                case \"ArrowDown\":\n                    doFocusChange(7);\n                    event.preventDefault();\n                    break;\n                case \"ArrowLeft\":\n                    doFocusChange(-1);\n                    event.preventDefault();\n                    break;\n                default:\n                    break;\n            }\n        },\n        [doFocusChange],\n    );\n\n    const handleTabInside: React.KeyboardEventHandler = useCallback((event) => {\n        if (event.key !== \"Tab\") return;\n\n        const focusableElements = calendarPaddingRef.current?.querySelectorAll<HTMLElement>(\n            'button:not([disabled]):not([tabindex=\"-1\"]), select',\n        );\n\n        if (!focusableElements) return;\n\n        const firstElement = focusableElements[0];\n        const lastElement = focusableElements[focusableElements.length - 1];\n\n        if (!event.shiftKey && document.activeElement === lastElement) {\n            firstElement.focus();\n            event.preventDefault();\n        } else if (event.shiftKey && document.activeElement === firstElement) {\n            lastElement.focus();\n            event.preventDefault();\n        }\n    }, []);\n\n    const isFocusableDate = useCallback(\n        (dateInfo: DateInfo) => {\n            const { date, selected, selectable, prevMonth, nextMonth } = dateInfo;\n\n            // Datoen kan ikke velges\n            if (!selectable) {\n                return false;\n            }\n            // Datoen er valgt dato\n            if (selected) {\n                return true;\n            }\n            // Datoen er første valgbare dato\n            if (date.toString() === minDate?.toString()) {\n                return true;\n            }\n\n            // Datoen er første i måneden som vises\n            if (\n                !prevMonth &&\n                !nextMonth &&\n                shownDate.getFullYear() === date.getFullYear() &&\n                selectedDate.getMonth() !== date.getMonth() &&\n                date.getDate() === 1\n            ) {\n                return true;\n            }\n\n            return false;\n        },\n        [shownDate, minDate, selectedDate],\n    );\n\n    const handleGotoEdgeMonth = useCallback(() => {\n        if (\n            // Vi er i ferd med å gå til første måned\n            minDate &&\n            shownDate.getFullYear() - minDate.getFullYear() === 0 &&\n            shownDate.getMonth() - minDate.getMonth() === 1\n        ) {\n            // Fokuser på \"neste månded\"-knappen\n            document.querySelectorAll<HTMLButtonElement>(\".jkl-calendar-navigation__arrow\")[1].focus();\n        } else if (\n            // Vi er i ferd med å gå til siste måned\n            maxDate &&\n            maxDate.getFullYear() - shownDate.getFullYear() === 0 &&\n            maxDate.getMonth() - shownDate.getMonth() === 1\n        ) {\n            // Fokuser på \"forrige månded\"-knappen\n            document.querySelectorAll<HTMLButtonElement>(\".jkl-calendar-navigation__arrow\")[0].focus();\n        }\n    }, [minDate, maxDate, shownDate]);\n\n    /// Extended variant events\n\n    const handleYearChange = useCallback<React.ChangeEventHandler<HTMLSelectElement>>(\n        (event) => {\n            if (event.target.value.length !== 4) {\n                return;\n            }\n\n            const year: number = Number.parseInt(event.target.value);\n            if (Number.isNaN(year)) {\n                return;\n            }\n\n            let offset = (year - shownDate.getFullYear()) * 12;\n            const expectedDate = new Date(shownDate.getFullYear(), shownDate.getMonth() + offset, shownDate.getDate());\n\n            // Pass på at vi ikke hopper forbi maks. eller min. dato\n            if (\n                maxDate &&\n                maxDate.getFullYear() === expectedDate.getFullYear() &&\n                maxDate.getMonth() < expectedDate.getMonth()\n            ) {\n                offset -= expectedDate.getMonth() - maxDate.getMonth();\n            } else if (\n                minDate &&\n                minDate.getFullYear() === expectedDate.getFullYear() &&\n                minDate.getMonth() > expectedDate.getMonth()\n            ) {\n                offset += minDate.getMonth() - expectedDate.getMonth();\n            }\n\n            dispatch({\n                type: \"ADD_OFFSET\",\n                addedOffset: offset,\n            });\n\n            return;\n        },\n        [shownDate, minDate, maxDate],\n    );\n\n    const handleMonthChange = useCallback<React.ChangeEventHandler<HTMLSelectElement>>(\n        (event) => {\n            if (!selectedDate && !date) {\n                return;\n            }\n\n            const yearDiff = shownDate.getFullYear() - (selectedDate || new Date()).getFullYear();\n            const monthDiff = Number.parseInt(event.target.value) - (selectedDate || new Date()).getMonth();\n\n            dispatch({\n                type: \"SET_OFFSET\",\n                newOffset: yearDiff * 12 + monthDiff,\n            });\n\n            return;\n        },\n        [selectedDate, date, shownDate],\n    );\n\n    const yearSelectOptions = getYearSelectOptions(shownYear, minDate, maxDate, yearsToShow);\n    const monthSelectOptions = getMonthSelectOptions(shownYear, months, minDate, maxDate);\n\n    return (\n        <div\n            ref={ref}\n            id={id}\n            className={clsx(\"jkl-calendar\", {\n                \"jkl-calendar--hidden\": hidden,\n            })}\n            data-testid=\"jkl-calendar\"\n        >\n            {/* Vi lytter på på trykk på Tab inne i kalenderen for å håndtere fokus */}\n            {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n            <div className=\"jkl-calendar__padding\" ref={calendarPaddingRef} onKeyDown={handleTabInside}>\n                <fieldset className=\"jkl-calendar-navigation\">\n                    <div>\n                        <button\n                            {...getBackProps({ calendars, onClick: handleGotoEdgeMonth })}\n                            className=\"jkl-calendar-navigation__arrow\"\n                            type=\"button\"\n                        >\n                            <ArrowLeftIcon variant=\"medium\" bold />\n                        </button>\n                        <button\n                            {...getForwardProps({ calendars, onClick: handleGotoEdgeMonth })}\n                            className=\"jkl-calendar-navigation__arrow\"\n                            type=\"button\"\n                        >\n                            <ArrowRightIcon variant=\"medium\" bold />\n                        </button>\n                    </div>\n                    <div>\n                        <div className=\"jkl-calendar-navigation-dropdown\">\n                            <select\n                                onChange={handleMonthChange}\n                                className=\"jkl-calendar-navigation-dropdown__select\"\n                                aria-label={monthLabel}\n                                value={shownMonth.toString()}\n                            >\n                                {monthSelectOptions.map(({ label, value }) => (\n                                    <option key={value} value={value}>\n                                        {label}\n                                    </option>\n                                ))}\n                            </select>\n                            <ChevronDownIcon bold className=\"jkl-calendar-navigation-dropdown__chevron\" />\n                        </div>\n                        <div className=\"jkl-calendar-navigation-dropdown\">\n                            <select\n                                onChange={handleYearChange}\n                                className=\"jkl-calendar-navigation-dropdown__select\"\n                                aria-label={yearLabel}\n                                value={shownYear.toString()}\n                            >\n                                {yearSelectOptions.map((year) => (\n                                    <option key={year} value={year}>\n                                        {year}\n                                    </option>\n                                ))}\n                            </select>\n                            <ChevronDownIcon bold className=\"jkl-calendar-navigation-dropdown__chevron\" />\n                        </div>\n                    </div>\n                </fieldset>\n                {calendars.map((calendar) => (\n                    <table\n                        className=\"jkl-calendar-table\"\n                        key={`${calendar.month}${calendar.year}`}\n                        data-testid=\"jkl-datepicker-calendar\"\n                    >\n                        <caption className=\"jkl-sr-only\">\n                            {months[calendar.month]}, {calendar.year}\n                        </caption>\n                        <thead>\n                            <tr>\n                                {days.map((weekday) => (\n                                    <th key={`${calendar.month}${calendar.year}${weekday}`}>{weekday}</th>\n                                ))}\n                            </tr>\n                        </thead>\n                        <tbody data-testid=\"jkl-datepicker-dates\">\n                            {calendar.weeks.map((week, weekIndex) => (\n                                <tr key={`${calendar.month}${calendar.year}${weekIndex}`}>\n                                    {week.map((dateInfo, index) => {\n                                        const key = `${calendar.month}${calendar.year}${weekIndex}${index}`;\n                                        if (typeof dateInfo === \"string\") {\n                                            return (\n                                                <td className=\"jkl-calendar__date jkl-calendar__date--empty\" key={key}>\n                                                    {dateInfo}\n                                                </td>\n                                            );\n                                        }\n                                        const { date, selectable, today, prevMonth, nextMonth } = dateInfo;\n\n                                        return (\n                                            <td key={key}>\n                                                <button\n                                                    {...getDateProps({\n                                                        dateObj: dateInfo,\n                                                    })}\n                                                    type=\"button\"\n                                                    className=\"jkl-calendar-date-button\"\n                                                    tabIndex={isFocusableDate(dateInfo) ? 0 : -1}\n                                                    aria-label={`${date.getDate()}. ${months[\n                                                        date.getMonth()\n                                                    ].toLowerCase()}`}\n                                                    aria-current={today ? \"date\" : undefined}\n                                                    data-adjacent={prevMonth || nextMonth ? \"true\" : undefined}\n                                                    disabled={!selectable}\n                                                    onKeyDown={handleArrowNavigation}\n                                                >\n                                                    <span aria-hidden=\"true\">{date.getDate()}</span>\n                                                </button>\n                                            </td>\n                                        );\n                                    })}\n                                </tr>\n                            ))}\n                        </tbody>\n                    </table>\n                ))}\n            </div>\n        </div>\n    );\n});\n\nCalendar.displayName = \"Calendar\";\n"],"names":["defaultMonths","defaultDays","Calendar","forwardRef","props","ref","hidden","date","defaultSelected","density","minDate","maxDate","days","months","monthLabel","yearLabel","yearsToShow","DEFAULT_YEARS_TO_SHOW","onTabOutside","rest","id","useId","offset","selectedDate","shownDate","dispatch","useReducer","calendarReducer","getInitialDateShown","calendarInitializer","shownMonth","getMonth","shownYear","getFullYear","useEffect","type","newDate","onOffsetChanged","useCallback","newOffset","calendars","getBackProps","getDateProps","getForwardProps","handleOffsetChanged","useCalendar","selected","firstDayOfWeek","calendarPaddingRef","useRef","doFocusChange","offsetDiff","current","e","document","activeElement","buttons","querySelectorAll","changeFocusTo","async","nextButton","setAttribute","focus","forEach","el","i","newNodeKey","length","isBackDisabled","flushSync","subtractMonth","newButtons","isForwardDisabled","addMonth","handleArrowNavigation","event","key","preventDefault","handleTabInside","focusableElements","_a","firstElement","lastElement","shiftKey","isFocusableDate","dateInfo","selectable","prevMonth","nextMonth","toString","getDate","handleGotoEdgeMonth","handleYearChange","target","value","year","Number","parseInt","isNaN","expectedDate","Date","addedOffset","handleMonthChange","yearDiff","monthDiff","yearSelectOptions","getYearSelectOptions","monthSelectOptions","getMonthSelectOptions","jsx","className","clsx","children","onKeyDown","jsxs","onClick","ArrowLeftIcon","variant","bold","ArrowRightIcon","onChange","map","label","ChevronDownIcon","calendar","month","weekday","weeks","week","weekIndex","index","today","dateObj","tabIndex","toLowerCase","disabled","displayName"],"mappings":"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"}