@fremtind/jokul 0.15.0 → 0.16.1

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),n=require("date-fns/startOfDay"),o=require("react"),i=require("react-dom"),s=require("../../hooks/useAnimatedHeight/useAnimatedHeight.js");require("../../hooks/useScreen/useScreen.js");const t=require("../../hooks/useClickOutside/useClickOutside.js"),a=require("../../hooks/useFocusOutside/useFocusOutside.js");require("../../hooks/useId/useId.js");const u=require("../../hooks/useKeyListener/useKeyListener.js");require("../icon/Icon.js"),require("../icon/icons/animated/ArrowVerticalAnimated.js"),require("../icon/icons/animated/ArrowHorizontalAnimated.js"),require("../icon/icons/animated/PlusRemoveAnimated.js"),require("../icon/icons/ArrowDownIcon.js"),require("../icon/icons/ArrowLeftIcon.js"),require("../icon/icons/ArrowNorthEastIcon.js"),require("../icon/icons/ArrowRightIcon.js"),require("../icon/icons/ArrowUpIcon.js");const c=require("../icon/icons/CalendarIcon.js");require("../icon/icons/CheckIcon.js"),require("../icon/icons/ChevronDownIcon.js"),require("../icon/icons/ChevronLeftIcon.js"),require("../icon/icons/ChevronRightIcon.js"),require("../icon/icons/ChevronUpIcon.js"),require("../icon/icons/CloseIcon.js"),require("../icon/icons/CopyIcon.js"),require("../icon/icons/DotsIcon.js"),require("../icon/icons/DragIcon.js"),require("../icon/icons/ErrorIcon.js"),require("../icon/icons/GreenCheckIcon.js"),require("../icon/icons/HamburgerIcon.js"),require("../icon/icons/InfoIcon.js"),require("../icon/icons/LinkIcon.js"),require("../icon/icons/PlusIcon.js"),require("../icon/icons/QuestionIcon.js"),require("../icon/icons/RedCrossIcon.js"),require("../icon/icons/SearchIcon.js"),require("../icon/icons/SuccessIcon.js"),require("../icon/icons/WarningIcon.js"),require("../icon/icons/MinusIcon.js"),require("../icon/icons/ThumbDownIcon.js"),require("../icon/icons/ThumbUpIcon.js"),require("../icon/icons/TrashCanIcon.js"),require("../icon/icons/PenIcon.js"),require("../tooltip/Tooltip.js"),require("../tooltip/TooltipContent.js"),require("../tooltip/TooltipTrigger.js");const l=require("../input-group/InputGroup.js");require("../text-input/BaseTextArea.js");const d=require("../text-input/BaseTextInput.js");require("../text-input/TextArea.js"),require("../text-input/TextInput.js");const p=require("./internal/Calendar.js"),j=require("./internal/utils.js"),q=require("./utils.js"),k=require("./validation.js"),h=o.forwardRef(((h,I)=>{const{"data-testautoid":b,id:v,className:m="",label:C="Velg dato",labelProps:f,defaultValue:y,defaultShow:g=!1,value:D,disableBeforeDate:w,disableAfterDate:x,yearsToShow:L,name:T,helpLabel:S,errorLabel:A,invalid:O,density:P,days:_,months:E,monthLabel:R,yearLabel:N,placeholder:B="dd.mm.åååå",width:U="11.25rem",onChange:K,onBlur:H,onFocus:V,onKeyDown:F,action:W,showCalendarLabel:G="Åpne kalender",hideCalendarLabel:M="Lukk kalender",supportLabelProps:z,tooltipProps:Q,...J}=h;"production"!==process.env.NODE_ENV&&D&&y&&console.warn("DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.");const X=q.parseDateString(w),Y=X?n(X):void 0,Z=q.parseDateString(x),$=Z?n(Z):void 0,[ee,re]=o.useState(j.getInitialDate(D,y,Y,$)),[ne,oe]=o.useState(null),[ie,se]=o.useState(g),[te]=s.useAnimatedHeight(ie),ae=o.useRef(null),ue=o.useRef(null),ce=o.useCallback((e=>{ue.current=e,I&&("function"==typeof I?I(e):I.current=e)}),[ue,I]),le=o.useRef(null),de=o.useCallback((e=>{V&&le.current&&(le.current.contains(e.relatedTarget)||V(e,ee,{error:ne,value:e.target.value}))}),[V,ee,ne]),pe=o.useCallback((e=>{H&&H(e,ee,{error:ne,value:e.target.value})}),[H,ee,ne]),je=o.useCallback((e=>{"Escape"===e.key&&(se(!1),e.preventDefault(),e.stopPropagation()),null!=W&&W.onKeyDown&&W.onKeyDown(e)}),[se,W]),qe=o.useCallback((e=>{if("Escape"===e.key&&(se(!1),e.preventDefault(),e.stopPropagation()),F){let r=e.currentTarget.value;/[\d.]/.test(e.key)&&(r+=e.key),F(e,ee,{error:ne,value:r})}}),[F,se,ee,ne]),ke=o.useCallback((e=>{let r=null,n=null;if(e.target.value){const o=q.parseDateString(e.target.value);o?Y&&!k.isWithinLowerBound(o,Y)?n="OUTSIDE_LOWER_BOUND":$&&!k.isWithinUpperBound(o,$)?n="OUTSIDE_UPPER_BOUND":se(!1):n="WRONG_FORMAT",r=o||null}oe(n),re(r),K&&K(e,r,{error:n,value:e.target.value})}),[K,oe,re,se,Y,$]),he=o.useCallback((e=>{i.flushSync((()=>{se(!ie)}));const r=te.current,n=r&&r.querySelector('[aria-pressed="true"]');n&&n.focus(),null!=W&&W.onClick&&W.onClick(e)}),[se,ie,W,te]),Ie=o.useCallback((()=>{se(!ie)}),[se,ie]),be=o.useCallback((()=>{se(!1)}),[se]),ve=o.useCallback((({date:e})=>{if(se(!1),re(e),ue.current){const r=ue.current;r.value=q.formatInput(e);const n=document.createEvent("HTMLEvents");n.initEvent("input",!0,!1),r.dispatchEvent(n),r.focus(),K&&K(n,e,{error:null,value:r.value})}}),[se,re,K]),me=o.useCallback((e=>{e.preventDefault(),se(!1),ae.current&&ae.current.focus()}),[se]);return t.useClickOutside(le,be),a.useFocusOutside(le,be),u.useKeyListener(te,["Escape"],(()=>{se(!1),ue.current&&ue.current.focus()})),e.jsx(l.InputGroup,{id:v,className:r.clsx("jkl-datepicker",m,{"jkl-datepicker--open":ie}),...J,ref:le,label:C,labelProps:f,density:P,helpLabel:S,errorLabel:A,supportLabelProps:z,tooltipProps:Q,render:r=>e.jsxs("div",{"data-testid":"jkl-datepicker__input-wrapper",className:"jkl-datepicker__input-wrapper","data-density":P,tabIndex:-1,onKeyDown:qe,children:[e.jsx(d.BaseTextInput,{ref:ce,"data-testid":"jkl-datepicker__input","data-testautoid":b,className:"jkl-datepicker__input",name:T,defaultValue:y,density:P,value:D,type:"text",placeholder:B,width:U,onFocus:de,onBlur:pe,onClick:Ie,onChange:ke,...r,action:{buttonRef:ae,icon:e.jsx(c.CalendarIcon,{}),label:ie?M:G,...W,onClick:he,onKeyDown:je}}),e.jsx("div",{className:"jkl-datepicker__calendar-wrapper",children:e.jsx(p.Calendar,{ref:te,density:P,date:ee,minDate:Y,maxDate:$,days:_,months:E,monthLabel:R,yearLabel:N,yearsToShow:L,hidden:!ie,onDateSelected:ve,onTabOutside:me})})]})})}));h.displayName="DatePicker",exports.DatePicker=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),n=require("date-fns/startOfDay"),o=require("react"),i=require("react-dom");require("../icon/Icon.js"),require("../icon/icons/animated/ArrowVerticalAnimated.js"),require("../icon/icons/animated/ArrowHorizontalAnimated.js"),require("../icon/icons/animated/PlusRemoveAnimated.js"),require("../icon/icons/ArrowDownIcon.js"),require("../icon/icons/ArrowLeftIcon.js"),require("../icon/icons/ArrowNorthEastIcon.js"),require("../icon/icons/ArrowRightIcon.js"),require("../icon/icons/ArrowUpIcon.js");const t=require("../icon/icons/CalendarIcon.js");require("../icon/icons/CheckIcon.js"),require("../icon/icons/ChevronDownIcon.js"),require("../icon/icons/ChevronLeftIcon.js"),require("../icon/icons/ChevronRightIcon.js"),require("../icon/icons/ChevronUpIcon.js"),require("../icon/icons/CloseIcon.js"),require("../icon/icons/CopyIcon.js"),require("../icon/icons/DotsIcon.js"),require("../icon/icons/DragIcon.js"),require("../icon/icons/ErrorIcon.js"),require("../icon/icons/GreenCheckIcon.js"),require("../icon/icons/HamburgerIcon.js"),require("../icon/icons/InfoIcon.js"),require("../icon/icons/LinkIcon.js"),require("../icon/icons/PlusIcon.js"),require("../icon/icons/QuestionIcon.js"),require("../icon/icons/RedCrossIcon.js"),require("../icon/icons/SearchIcon.js"),require("../icon/icons/SuccessIcon.js"),require("../icon/icons/WarningIcon.js"),require("../icon/icons/MinusIcon.js"),require("../icon/icons/ThumbDownIcon.js"),require("../icon/icons/ThumbUpIcon.js"),require("../icon/icons/TrashCanIcon.js"),require("../icon/icons/PenIcon.js");const s=require("../icon-button/IconButton.js");require("../../hooks/useScreen/useScreen.js"),require("../../hooks/useId/useId.js"),require("../tooltip/Tooltip.js"),require("../tooltip/TooltipContent.js"),require("../tooltip/TooltipTrigger.js");const a=require("../input-group/InputGroup.js"),c=require("../popover/Popover.js");require("../text-input/BaseTextArea.js");const u=require("../text-input/BaseTextInput.js");require("../text-input/TextArea.js"),require("../text-input/TextInput.js");const l=require("./internal/Calendar.js"),d=require("./internal/utils.js"),p=require("./utils.js"),j=require("./validation.js"),q=o.forwardRef(((q,I)=>{const{"data-testautoid":h,id:b,className:f="",label:k="Velg dato",labelProps:v,defaultValue:m,defaultShow:C=!1,value:g,disableBeforeDate:D,disableAfterDate:x,yearsToShow:y,name:w,helpLabel:T,errorLabel:S,invalid:L,density:P,days:A,months:R,monthLabel:B,yearLabel:E,placeholder:O="dd.mm.åååå",width:_="11.25rem",onChange:N,onBlur:U,onFocus:V,onKeyDown:W,action:F,showCalendarLabel:G="Åpne kalender",hideCalendarLabel:H="Lukk kalender",supportLabelProps:K,tooltipProps:M,...z}=q;"production"!==process.env.NODE_ENV&&g&&m&&console.warn("DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.");const Q=p.parseDateString(D),J=Q?n(Q):void 0,X=p.parseDateString(x),Y=X?n(X):void 0,[Z,$]=o.useState(d.getInitialDate(g,m,J,Y)),[ee,re]=o.useState(null),[ne,oe]=o.useState(C),ie=o.useRef(null),te=o.useRef(null),se=o.useRef(null),ae=o.useRef(null),ce=o.useCallback((e=>{ae.current=e,I&&("function"==typeof I?I(e):I.current=e)}),[ae,I]),ue=o.useCallback((e=>{V&&te.current&&(te.current.contains(e.relatedTarget)||V(e,Z,{error:ee,value:e.target.value}))}),[V,Z,ee]),le=o.useCallback((e=>{U&&U(e,Z,{error:ee,value:e.target.value})}),[U,Z,ee]),de=o.useCallback((e=>{"Escape"===e.key&&(oe(!1),e.preventDefault(),e.stopPropagation()),null!=F&&F.onKeyDown&&F.onKeyDown(e)}),[oe,F]),pe=o.useCallback((e=>{let r=null,n=null;if(e.target.value){const o=p.parseDateString(e.target.value);o?J&&!j.isWithinLowerBound(o,J)?n="OUTSIDE_LOWER_BOUND":Y&&!j.isWithinUpperBound(o,Y)?n="OUTSIDE_UPPER_BOUND":oe(!1):n="WRONG_FORMAT",r=o||null}re(n),$(r),N&&N(e,r,{error:n,value:e.target.value})}),[N,re,$,oe,J,Y]),je=o.useCallback((e=>{i.flushSync((()=>{oe(!ne)}));const r=ie.current,n=r&&r.querySelector('[aria-pressed="true"]');n&&n.focus(),null!=F&&F.onClick&&F.onClick(e)}),[oe,ne,F,ie]),qe=o.useCallback((({date:e})=>{if(oe(!1),$(e),ae.current){const r=ae.current;r.value=p.formatInput(e);const n=document.createEvent("HTMLEvents");n.initEvent("input",!0,!1),r.dispatchEvent(n),r.focus(),N&&N(n,e,{error:null,value:r.value})}}),[oe,$,N]),Ie=o.useCallback((e=>{e.preventDefault(),oe(!1),se.current&&se.current.focus()}),[oe]);return e.jsx(a.InputGroup,{id:b,className:r.clsx("jkl-datepicker",f,{"jkl-datepicker--open":ne}),...z,ref:te,label:k,labelProps:v,density:P,helpLabel:T,errorLabel:S,supportLabelProps:K,tooltipProps:M,render:r=>e.jsx(u.BaseTextInput,{ref:ce,"data-testid":"jkl-datepicker__input","data-testautoid":h,className:"jkl-datepicker__input",name:w,defaultValue:m,density:P,value:g,type:"text",placeholder:O,width:_,onFocus:ue,onBlur:le,onChange:pe,actionButton:e.jsxs(c,{positionReference:ae,open:ne,onOpenChange:()=>oe(!ne),offset:8,children:[e.jsx(c.Trigger,{"data-testid":"jkl-datepicker__trigger",title:ne?H:G,className:"jkl-text-input-action-button",onClick:je,onKeyDown:de,tabIndex:0,asChild:!0,children:e.jsx(s.IconButton,{...F,children:e.jsx(t.CalendarIcon,{})})}),e.jsx(c.Content,{initialFocus:-1,padding:24,children:e.jsx(l.Calendar,{ref:ie,density:P,date:Z,minDate:J,maxDate:Y,days:A,months:R,monthLabel:B,yearLabel:E,yearsToShow:y,onDateSelected:qe,onTabOutside:Ie})})]}),...r})})}));q.displayName="DatePicker",exports.DatePicker=q;
 //# sourceMappingURL=DatePicker.js.map

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

@@ -1 +1 @@
-{"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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"}
+{"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 { CalendarIcon } from \"../icon\";\nimport { IconButton } from \"../icon-button\";\nimport { InputGroup } from \"../input-group\";\nimport { Popover } from \"../popover\";\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\n    const calendarRef = useRef<HTMLDivElement>(null);\n    const datepickerRef = useRef<HTMLDivElement>(null);\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 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 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 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    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                <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                    onChange={handleChange}\n                    actionButton={\n                        <Popover\n                            positionReference={inputRef}\n                            open={showCalendar}\n                            onOpenChange={() => setShowCalendar(!showCalendar)}\n                            offset={8}\n                        >\n                            <Popover.Trigger\n                                data-testid=\"jkl-datepicker__trigger\"\n                                title={showCalendar ? hideCalendarLabel : showCalendarLabel}\n                                className=\"jkl-text-input-action-button\"\n                                onClick={clickCalendar}\n                                onKeyDown={handleKeyDownAction}\n                                tabIndex={0}\n                                asChild\n                            >\n                                <IconButton {...action}>\n                                    <CalendarIcon />\n                                </IconButton>\n                            </Popover.Trigger>\n                            <Popover.Content initialFocus={-1} padding={24}>\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                                    onDateSelected={handleClickCalendarDay}\n                                    onTabOutside={handleTabOutsideCalendar}\n                                />\n                            </Popover.Content>\n                        </Popover>\n                    }\n                    {...inputProps}\n                />\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","useRef","datepickerRef","iconButtonRef","inputRef","unifiedInputRef","useCallback","instance","current","handleFocus","e","contains","relatedTarget","target","handleBlur","handleKeyDownAction","key","preventDefault","stopPropagation","handleChange","nextDate","nextError","val","isWithinLowerBound","isWithinUpperBound","clickCalendar","flushSync","calendarEl","button","querySelector","focus","onClick","handleClickCalendarDay","node","formatInput","event","document","createEvent","initEvent","dispatchEvent","handleTabOutsideCalendar","jsx","InputGroup","clsx","ref","render","inputProps","BaseTextInput","type","actionButton","jsxs","Popover","positionReference","open","onOpenChange","offset","children","Trigger","title","tabIndex","asChild","IconButton","CalendarIcon","Content","initialFocus","padding","Calendar","onDateSelected","onTabOutside","displayName"],"mappings":"0wEAwBaA,EAAaC,EAAAA,YAA8C,CAACC,EAAOC,KACtE,MACF,kBAAmBC,EACnBC,GAAAA,EACAC,UAAAA,EAAY,GACZC,MAAAA,EAAQ,YACRC,WAAAA,EACAC,aAAAA,EACAC,YAAAA,GAAc,EACdC,MAAAA,EACAC,kBAAmBC,EACnBC,iBAAkBC,EAClBC,YAAAA,EACAC,KAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,KAAAA,EACAC,OAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,YAAAA,EAAc,aACdC,MAAAA,EAAQ,WACRC,SAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,kBAAAA,EAAoB,gBACpBC,kBAAAA,EAAoB,gBACpBC,kBAAAA,EACAC,aAAAA,KACGC,GACHnC,EAEyB,eAAzBoC,QAAQC,IAAIC,UAA6B7B,GAASF,GAC1CgC,QAAAC,KACJ,sIAKF,MAAA9B,EAAoB+B,kBAAgB9B,GACpC+B,EAAUhC,EAAoBiC,EAAWjC,QAAqB,EAC9DE,EAAmB6B,kBAAgB5B,GACnC+B,EAAUhC,EAAmB+B,EAAW/B,QAAoB,GAE3DiC,EAAMC,GAAWC,WAASC,EAAAA,eAAevC,EAAOF,EAAcmC,EAASE,KACvEK,GAAOC,IAAYH,WAAqC,OAIxDI,GAAcC,IAAmBL,WAASvC,GAE3C6C,GAAcC,SAAuB,MACrCC,GAAgBD,SAAuB,MAIvCE,GAAgBF,SAAiC,MACjDG,GAAWH,SAAgC,MAG3CI,GAAkBC,EAAAA,aACnBC,IACGH,GAASI,QAAUD,EACf3D,IACiC,mBAAtBA,EACPA,EAAkB2D,GAElB3D,EAAkB4D,QAAUD,EAGxC,GACA,CAACH,GAAUxD,IAGT6D,GAAcH,EAAAA,aACfI,IACQnC,GAAY2B,GAAcM,UAILN,GAAcM,QAAQG,SAASD,EAAEE,gBAE/CrC,EAAAmC,EAAGlB,EAAM,CAAEI,MAAAA,GAAOxC,MAAOsD,EAAEG,OAAOzD,QAAO,GAGzD,CAACmB,EAASiB,EAAMI,KAGdkB,GAAaR,EAAAA,aACdI,IACOpC,GACOA,EAAAoC,EAAGlB,EAAM,CAAEI,MAAAA,GAAOxC,MAAOsD,EAAEG,OAAOzD,OAAO,GAGxD,CAACkB,EAAQkB,EAAMI,KAGbmB,GAAsBT,EAAAA,aACvBI,IACiB,WAAVA,EAAEM,MACFjB,IAAgB,GAChBW,EAAEO,iBACFP,EAAEQ,mBAGF,MAAAzC,GAAAA,EAAQD,WACRC,EAAOD,UAAUkC,EAAC,GAG1B,CAACX,GAAiBtB,IAGhB0C,GAAeb,EAAAA,aAChBI,IACG,IAAIU,EAAwB,KACxBC,EAAwC,KAExC,GAAAX,EAAEG,OAAOzD,MAAO,CAChB,MAAMkE,EAAMlC,EAAAA,gBAAgBsB,EAAEG,OAAOzD,OAChCkE,EAEMjC,IAAYkC,EAAmBA,mBAAAD,EAAKjC,GAC/BgC,EAAA,sBACL9B,IAAYiC,EAAmBA,mBAAAF,EAAK/B,GAC/B8B,EAAA,sBAEZtB,IAAgB,GANJsB,EAAA,eAQhBD,EAAWE,GAAO,IACtB,CAEAzB,GAASwB,GACT5B,EAAQ2B,GAEJ/C,GACSA,EAAAqC,EAAGU,EAAU,CAAExB,MAAOyB,EAAWjE,MAAOsD,EAAEG,OAAOzD,OAAO,GAGzE,CAACiB,EAAUwB,GAAUJ,EAASM,GAAiBV,EAASE,IAKtDkC,GAAgBnB,EAAAA,aACjBI,IACGgB,EAAAA,WAAU,KACN3B,IAAiBD,GAAY,IAGjC,MAAM6B,EAAa3B,GAAYQ,QACzBoB,EAASD,GAAeA,EAAWE,cAAc,yBACvDD,GAAUA,EAAOE,QAEb,MAAArD,GAAAA,EAAQsD,SACRtD,EAAOsD,QAAQrB,EAAC,GAGxB,CAACX,GAAiBD,GAAcrB,EAAQuB,KAGtCgC,GAAyB1B,EAAAA,aAC3B,EAAGd,KAAAA,MAIC,GAHAO,IAAgB,GAChBN,EAAQD,GAEJY,GAASI,QAAS,CAClB,MAAMyB,EAAO7B,GAASI,QAEjByB,EAAA7E,MAAQ8E,cAAY1C,GAGnB,MAAA2C,EAAQC,SAASC,YAAY,cAC7BF,EAAAG,UAAU,SAAS,GAAM,GAC/BL,EAAKM,cAAcJ,GAEnBF,EAAKH,QAEDzD,GAIAA,EAAS8D,EAAmD3C,EAAM,CAC9DI,MAAO,KACPxC,MAAO6E,EAAK7E,OAGxB,IAEJ,CAAC2C,GAAiBN,EAASpB,IAGzBmE,GAA2BlC,EAAAA,aAC5BI,IACGA,EAAEO,iBACFlB,IAAgB,GACFI,GAAAK,SAAWL,GAAcK,QAAQsB,OAAM,GAEzD,CAAC/B,KAID,OAAA0C,EAAAA,IAACC,EAAAA,WAAA,CACG5F,GAAAA,EACAC,UAAW4F,EAAAA,KAAK,iBAAkB5F,EAAW,CACzC,uBAAwB+C,QAExBhB,EACJ8D,IAAK1C,GACLlD,MAAAA,EACAC,WAAAA,EACAa,QAAAA,EACAH,UAAAA,EACAC,WAAAA,EACAgB,kBAAAA,EACAC,aAAAA,EACAgE,OAASC,GACLL,EAAAA,IAACM,EAAAA,cAAA,CACGH,IAAKvC,GACL,cAAY,wBACZ,kBAAiBxD,EACjBE,UAAU,wBACVW,KAAAA,EACAR,aAAAA,EACAY,QAAAA,EACAV,MAAAA,EACA4F,KAAK,OACL7E,YAAAA,EACAC,MAAAA,EACAG,QAASkC,GACTnC,OAAQwC,GACRzC,SAAU8C,GACV8B,aACIC,EAAAA,KAACC,EAAA,CACGC,kBAAmBhD,GACnBiD,KAAMvD,GACNwD,aAAc,IAAMvD,IAAiBD,IACrCyD,OAAQ,EAERC,SAAA,CAAAf,EAAAA,IAACU,EAAQM,QAAR,CACG,cAAY,0BACZC,MAAO5D,GAAenB,EAAoBD,EAC1C3B,UAAU,+BACVgF,QAASN,GACTjD,UAAWuC,GACX4C,SAAU,EACVC,SAAO,EAEPJ,eAACK,EAAYA,WAAA,IAAGpF,EACZ+E,SAAAf,MAACqB,EAAAA,cAAa,aAGrBX,EAAQY,QAAR,CAAgBC,cAAc,EAAIC,QAAS,GACxCT,SAAAf,EAAAA,IAACyB,EAAAA,SAAA,CACGtB,IAAK5C,GACLlC,QAAAA,EACA0B,KAAAA,EACAH,QAAAA,EACAE,QAAAA,EACAxB,KAAAA,EACAC,OAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAT,YAAAA,EACA0G,eAAgBnC,GAChBoC,aAAc5B,aAK1BM,KACR,IAMhBrG,EAAW4H,YAAc"}

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

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

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

@@ -1 +1 @@
-{"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","setAttribute","nextButton","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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"}
+{"version":3,"file":"Calendar.js","sources":["../../../../../src/components/datepicker/internal/Calendar.tsx"],"sourcesContent":["import 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    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        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 ref={ref} id={id} className=\"jkl-calendar\" data-testid=\"jkl-calendar\">\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","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","setAttribute","nextButton","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","children","jsxs","onKeyDown","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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"}

package/build/cjs/components/popover/Popover.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("react/jsx-runtime"),t=require("@floating-ui/react"),n=require("../../../clsx-E3yX_9sL.cjs"),o=require("react"),r=require("./utils.js");const s=function(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const n in e)if("default"!==n){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>e[n]})}return t.default=e,Object.freeze(t)}(o),l=s.createContext(null),a=()=>{const e=s.useContext(l);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},i=({children:n,...o})=>{const r=(({open:e,onOpenChange:n,placement:o="bottom-start",strategy:r="absolute",modal:l=!0,offset:a=4,hoverOptions:i,focusOptions:c,clickOptions:u,roleOptions:d,dismissOptions:p})=>{const[f,g]=s.useState(e),m=e??f,h=n??g,b=t.useFloating({open:m,onOpenChange:h,placement:o,strategy:r,middleware:[t.offset(a),t.flip({padding:5,fallbackPlacements:["bottom","top"]}),t.shift({padding:12})],whileElementsMounted:t.autoUpdate}),j=b.context,x=t.useClick(j,{enabled:!1,...u}),O=t.useHover(j,{enabled:!1,...i}),v=t.useFocus(j,{enabled:!1,...c}),y=t.useDismiss(j,p),k=t.useRole(j,d),C=t.useInteractions([x,y,v,O,k]);return s.useMemo((()=>({open:m,onOpenChange:h,modal:l,...C,...b})),[m,h,l,C,b])})({...o});return e.jsx(l.Provider,{value:r,children:n})},c=s.forwardRef((function({children:n,asChild:o=!1,...r},l){const{refs:i,getReferenceProps:c,open:u,onOpenChange:d}=a(),p=n.ref,f=t.useMergeRefs([i.setReference,l,p]);return o&&s.isValidElement(n)?s.cloneElement(n,c({ref:f,...r,...n.props})):e.jsx("button",{ref:f,onClick:()=>null==d?void 0:d(!u),"aria-expanded":u,...c(r),children:n})})),u=s.forwardRef((function({style:o,className:s,padding:l,...i},c){const{context:u,modal:d,refs:p,open:f,floatingStyles:g,getFloatingProps:m}=a(),h=t.useMergeRefs([p.setFloating,c]),{theme:b,density:j}=r.getThemeAndDensity(p.reference.current);return f?e.jsx(t.FloatingPortal,{children:e.jsx(t.FloatingFocusManager,{context:u,modal:d,children:e.jsx("div",{"data-theme":b,"data-layout-density":j,className:n.clsx("jkl jkl-popover",s),ref:h,style:{...o,...g,"--popover-padding":`var(--jkl-spacing-${l})`},...m(i),children:i.children})})}):null}));i.Trigger=c,i.Content=u,module.exports=i;
+"use strict";const e=require("react/jsx-runtime"),t=require("@floating-ui/react"),n=require("../../../clsx-E3yX_9sL.cjs"),o=require("react"),r=require("./utils.js");const s=function(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const n in e)if("default"!==n){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>e[n]})}return t.default=e,Object.freeze(t)}(o),i=s.createContext(null),l=()=>{const e=s.useContext(i);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},a=({children:n,...o})=>{const r=(({open:e,onOpenChange:n,placement:o="bottom-start",strategy:r="absolute",modal:i=!0,offset:l=4,positionReference:a,hoverOptions:c,focusOptions:u,clickOptions:d,roleOptions:f,dismissOptions:p})=>{const[g,m]=s.useState(e),h=e??g,x=n??m,b=t.useFloating({open:h,onOpenChange:x,placement:o,strategy:r,middleware:[t.offset(l),t.flip({padding:5,fallbackPlacements:["bottom","top"]}),t.shift({padding:12})],whileElementsMounted:t.autoUpdate}),j=b.context,v=t.useClick(j,{enabled:!1,...d}),y=t.useHover(j,{enabled:!1,...c}),O=t.useFocus(j,{enabled:!1,...u}),F=t.useDismiss(j,p),k=t.useRole(j,f),C=t.useInteractions([v,F,O,y,k]);return s.useLayoutEffect((()=>{a&&b.refs.setPositionReference(null==a?void 0:a.current)}),[a,b.refs]),s.useMemo((()=>({open:h,onOpenChange:x,modal:i,...C,...b})),[h,x,i,C,b])})({...o});return e.jsx(i.Provider,{value:r,children:n})},c=s.forwardRef((function({children:n,asChild:o=!1,...r},i){const{refs:a,getReferenceProps:c,open:u,onOpenChange:d}=l(),f=n.ref,p=t.useMergeRefs([a.setReference,i,f]);return o&&s.isValidElement(n)?s.cloneElement(n,c({ref:p,...r,...n.props})):e.jsx("button",{ref:p,onClick:()=>null==d?void 0:d(!u),"aria-expanded":u,...c(r),children:n})})),u=s.forwardRef((function({style:o,className:s,padding:i=0,initialFocus:a=0,returnFocus:c=!0,...u},d){const{context:f,modal:p,refs:g,open:m,floatingStyles:h,getFloatingProps:x}=l(),b=t.useMergeRefs([g.setFloating,d]),j=g.reference.current,{theme:v,density:y}=(O=j)&&"contextElement"in O?r.getThemeAndDensity(j.contextElement):r.getThemeAndDensity(j);var O;return m?e.jsx(t.FloatingPortal,{children:e.jsx(t.FloatingFocusManager,{context:f,modal:p,initialFocus:a,returnFocus:c,children:e.jsx("div",{"data-theme":v,"data-layout-density":y,className:n.clsx("jkl jkl-popover",s),ref:b,style:{...o,...h,"--popover-padding":`var(--jkl-spacing-${i})`},...x(u),children:u.children})})}):null}));a.Trigger=c,a.Content=u,module.exports=a;
 //# sourceMappingURL=Popover.js.map

package/build/cjs/components/popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import {\n    useFloating,\n    useFocus,\n    useHover,\n    useClick,\n    useDismiss,\n    autoUpdate,\n    useRole,\n    useMergeRefs,\n    offset,\n    flip,\n    shift,\n    useInteractions,\n    FloatingPortal,\n    FloatingFocusManager,\n    UseFloatingOptions,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { getThemeAndDensity } from \"./utils\";\n\ntype ClickOptions = Parameters<typeof useClick>[1];\ntype DismissOptions = Parameters<typeof useDismiss>[1];\ntype FocusOptions = Parameters<typeof useFocus>[1];\ntype HoverOptions = Parameters<typeof useHover>[1];\ntype RoleOptions = Parameters<typeof useRole>[1];\n\ninterface PopoverOptions {\n    /**\n     * Angir om popoveren er åpen eller lukket.\n     * @see https://floating-ui.com/docs/useFloating#open\n     */\n    open?: boolean;\n    /**\n     * Callback som trigges når popoveren åpnes eller lukkes.\n     * @see https://floating-ui.com/docs/useFloating#onOpenChange\n     */\n    onOpenChange?: UseFloatingOptions[\"onOpenChange\"];\n    /**\n     * Bestemmer plasseringen av popoveren.\n     * @default \"bottom-start\"\n     * @see https://floating-ui.com/docs/useFloating#placement\n     */\n    placement?: UseFloatingOptions[\"placement\"];\n    /**\n     * Definerer strategien for posisjonering av popoveren.\n     * @default \"absolute\"\n     * @see https://floating-ui.com/docs/useFloating#strategy\n     */\n    strategy?: UseFloatingOptions[\"strategy\"];\n    /**\n     * Angir om popoveren skal fungere som en modal, der fokus er låst til det flytende elementet\n     * og innhold utenfor ikke kan interageres med.\n     * @default true\n     * @see https://floating-ui.com/docs/useFloating#modal\n     */\n    modal?: boolean;\n    /**\n     * Offset til det flytende elementet.\n     * @see https://floating-ui.com/docs/offset\n     * @default 4\n     * */\n    /**\n     * Justerer avstanden mellom referanse-elementet og popoveren.\n     * @see https://floating-ui.com/docs/offset\n     * @default 4\n     */\n    offset?: number;\n    /**\n     * Options for hover-interaksjoner.\n     * @see https://floating-ui.com/docs/useHover\n     * @default { enabled: false }\n     */\n    hoverOptions?: HoverOptions;\n    /**\n     * Options for fokus-interaksjoner.\n     * @see https://floating-ui.com/docs/useFocus\n     * @default { enabled: false }\n     */\n    focusOptions?: FocusOptions;\n    /**\n     * Options for klikk-interaksjoner.\n     * @see https://floating-ui.com/docs/useClick\n     * @default { enabled: false }\n     */\n    clickOptions?: ClickOptions;\n    /**\n     * Konfigurerer rollen for popoveren.\n     * @see https://floating-ui.com/docs/useRole\n     * @default { enabled: true, role: \"dialog\" }\n     */\n    roleOptions?: RoleOptions;\n    /**\n     * Options for å lukke popoveren når en dismissal skjer,\n     * som ved å klikke utenfor eller trykke på \"Escape\"-tasten.\n     * @see https://floating-ui.com/docs/useDismiss\n     * @default { enabled: true }\n     */\n    dismissOptions?: DismissOptions;\n}\n\nconst usePopover = ({\n    open: _open,\n    onOpenChange: _onOpenChange,\n    placement = \"bottom-start\",\n    strategy = \"absolute\",\n    modal = true,\n    offset: _offset = 4,\n    hoverOptions,\n    focusOptions,\n    clickOptions,\n    roleOptions,\n    dismissOptions,\n}: PopoverOptions) => {\n    const [uncontrolledOpen, setUncontrolledOpen] = React.useState(_open);\n\n    const open = _open ?? uncontrolledOpen;\n    const onOpenChange = _onOpenChange ?? setUncontrolledOpen;\n\n    const data = useFloating({\n        open,\n        onOpenChange,\n        placement,\n        strategy,\n        middleware: [\n            offset(_offset),\n            flip({ padding: 5, fallbackPlacements: [\"bottom\", \"top\"] }),\n            shift({ padding: 12 }),\n        ],\n        whileElementsMounted: autoUpdate,\n    });\n\n    const context = data.context;\n\n    const click = useClick(context, {\n        enabled: false,\n        ...clickOptions,\n    });\n    const hover = useHover(context, { enabled: false, ...hoverOptions });\n    const focus = useFocus(context, { enabled: false, ...focusOptions });\n    const dismiss = useDismiss(context, dismissOptions);\n    const role = useRole(context, roleOptions);\n\n    const interactions = useInteractions([click, dismiss, focus, hover, role]);\n\n    return React.useMemo(\n        () => ({\n            open,\n            onOpenChange,\n            modal,\n            ...interactions,\n            ...data,\n        }),\n        [open, onOpenChange, modal, interactions, data],\n    );\n};\n\ntype PopoverContextType = ReturnType<typeof usePopover> | null;\n\nconst PopoverContext = React.createContext<PopoverContextType>(null);\n\nconst usePopoverContext = () => {\n    const context = React.useContext(PopoverContext);\n\n    if (context == null) {\n        throw new Error(\"Popover komponenter må brukes innenfor en <Popover /> komponent\");\n    }\n\n    return context;\n};\n\nconst Popover = ({\n    children,\n    ...restOptions\n}: {\n    children: React.ReactNode;\n} & PopoverOptions) => {\n    const popover = usePopover({ ...restOptions });\n    return <PopoverContext.Provider value={popover}>{children}</PopoverContext.Provider>;\n};\n\ninterface PopoverTriggerProps {\n    children: React.ReactNode;\n    /**\n     * Rendrer komponenten som child-elementet sitt, og slår\n     * sammen egenskaper og props.\n     * @example\n     * ```tsx\n     * <Component asChild foo=\"bar\">\n     *    <Child baz=\"qux\" />\n     * </Component>\n     *\n     * // Rendrer følgende:\n     * <Child foo=\"bar\" baz=\"qux\" />\n     * ```\n     *\n     * @default false\n     */\n    asChild?: boolean;\n}\n\nconst PopoverTrigger = React.forwardRef<HTMLElement, React.HTMLProps<HTMLElement> & PopoverTriggerProps>(\n    function PopoverTrigger({ children, asChild = false, ...props }, propRef) {\n        const { refs, getReferenceProps, open, onOpenChange } = usePopoverContext();\n        const childrenRef = (children as any).ref;\n        const ref = useMergeRefs([refs.setReference, propRef, childrenRef]);\n\n        if (asChild && React.isValidElement(children)) {\n            return React.cloneElement(\n                children,\n                getReferenceProps({\n                    ref,\n                    ...props,\n                    ...children.props,\n                }),\n            );\n        }\n\n        return (\n            <button ref={ref} onClick={() => onOpenChange?.(!open)} aria-expanded={open} {...getReferenceProps(props)}>\n                {children}\n            </button>\n        );\n    },\n);\n\ninterface PopoverContentProps {\n    /**\n     * Padding rundt innholdet i popoveren.\n     * @default 0\n     */\n    padding?: 0 | 8 | 16 | 24;\n}\n\nconst PopoverContent = React.forwardRef<HTMLDivElement, React.HTMLProps<HTMLDivElement> & PopoverContentProps>(\n    function PopoverContent({ style, className, padding, ...props }, propRef) {\n        const { context, modal, refs, open, floatingStyles, getFloatingProps } = usePopoverContext();\n        const ref = useMergeRefs([refs.setFloating, propRef]);\n\n        const { theme, density } = getThemeAndDensity(refs.reference.current as HTMLElement);\n\n        if (!open) return null;\n\n        return (\n            <FloatingPortal>\n                <FloatingFocusManager context={context} modal={modal}>\n                    <div\n                        data-theme={theme}\n                        data-layout-density={density}\n                        className={clsx(\"jkl jkl-popover\", className)}\n                        ref={ref}\n                        style={\n                            {\n                                ...style,\n                                ...floatingStyles,\n                                \"--popover-padding\": `var(--jkl-spacing-${padding})`,\n                            } as React.CSSProperties\n                        }\n                        {...getFloatingProps(props)}\n                    >\n                        {props.children}\n                    </div>\n                </FloatingFocusManager>\n            </FloatingPortal>\n        );\n    },\n);\n\nPopover.Trigger = PopoverTrigger;\nPopover.Content = PopoverContent;\n\nexport default Popover;\n"],"names":["PopoverContext","React","createContext","usePopoverContext","context","useContext","Error","Popover","children","restOptions","popover","open","_open","onOpenChange","_onOpenChange","placement","strategy","modal","offset","_offset","hoverOptions","focusOptions","clickOptions","roleOptions","dismissOptions","uncontrolledOpen","setUncontrolledOpen","useState","data","useFloating","middleware","flip","padding","fallbackPlacements","shift","whileElementsMounted","autoUpdate","click","useClick","enabled","hover","useHover","focus","useFocus","dismiss","useDismiss","role","useRole","interactions","useInteractions","useMemo","usePopover","Provider","value","PopoverTrigger","forwardRef","asChild","props","propRef","refs","getReferenceProps","childrenRef","ref","useMergeRefs","setReference","isValidElement","cloneElement","jsx","onClick","PopoverContent","style","className","floatingStyles","getFloatingProps","setFloating","theme","density","getThemeAndDensity","reference","current","FloatingPortal","FloatingFocusManager","clsx","Trigger","Content"],"mappings":"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"}
+{"version":3,"file":"Popover.js","sources":["../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import {\n    useFloating,\n    useFocus,\n    useHover,\n    useClick,\n    useDismiss,\n    autoUpdate,\n    useRole,\n    useMergeRefs,\n    offset,\n    flip,\n    shift,\n    useInteractions,\n    FloatingPortal,\n    FloatingFocusManager,\n    UseFloatingOptions,\n    VirtualElement,\n    ReferenceElement,\n    ReferenceType,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { getThemeAndDensity } from \"./utils\";\n\ntype ClickOptions = Parameters<typeof useClick>[1];\ntype DismissOptions = Parameters<typeof useDismiss>[1];\ntype FocusOptions = Parameters<typeof useFocus>[1];\ntype HoverOptions = Parameters<typeof useHover>[1];\ntype RoleOptions = Parameters<typeof useRole>[1];\n\ninterface PopoverOptions {\n    /**\n     * Angir om popoveren er åpen eller lukket.\n     *\n     * @see https://floating-ui.com/docs/usefloating#open\n     */\n    open?: boolean;\n    /**\n     * Callback som trigges når popoveren åpnes eller lukkes.\n     *\n     * @see https://floating-ui.com/docs/usefloating#onopenchange\n     */\n    onOpenChange?: UseFloatingOptions[\"onOpenChange\"];\n    /**\n     * Bestemmer plasseringen av popoveren.\n     *\n     * @see https://floating-ui.com/docs/usefloating#placement\n     *\n     * @default \"bottom-start\"\n     */\n    placement?: UseFloatingOptions[\"placement\"];\n    /**\n     * Definerer strategien for posisjonering av popoveren.\n     *\n     * @see https://floating-ui.com/docs/usefloating#strategy\n     *\n     * @default \"absolute\"\n     */\n    strategy?: UseFloatingOptions[\"strategy\"];\n    /**\n     * Angir om popoveren skal fungere som en modal, der fokus er låst til det flytende elementet\n     * og innhold utenfor ikke kan interageres med.\n     *\n     * @see https://floating-ui.com/docs/usefloating#modal\n     *\n     * @default true\n     */\n    modal?: boolean;\n    /**\n     * Justerer avstanden mellom referanse-elementet og popoveren.\n     *\n     * @see https://floating-ui.com/docs/offset\n     *\n     * @default 4\n     */\n    offset?: number;\n    /**\n     * Referanse til elementet som popoveren skal posisjoneres i forhold til.\n     *\n     * @see https://floating-ui.com/docs/usefloating#setpositionreference\n     *\n     * @default Popover.Trigger\n     */\n    positionReference?: React.RefObject<ReferenceType>;\n    /**\n     * Options for hover-interaksjoner.\n     *\n     * @see https://floating-ui.com/docs/usehover\n     *\n     * @default { enabled: false }\n     */\n    hoverOptions?: HoverOptions;\n    /**\n     * Options for fokus-interaksjoner.\n     *\n     * @see https://floating-ui.com/docs/usefocus\n     *\n     * @default { enabled: false }\n     */\n    focusOptions?: FocusOptions;\n    /**\n     * Options for klikk-interaksjoner.\n     *\n     * @see https://floating-ui.com/docs/useclick\n     *\n     * @default { enabled: false }\n     */\n    clickOptions?: ClickOptions;\n    /**\n     * Konfigurerer rollen for popoveren.\n     *\n     * @see https://floating-ui.com/docs/userole\n     *\n     * @default { enabled: true, role: \"dialog\" }\n     */\n    roleOptions?: RoleOptions;\n    /**\n     * Options for å lukke popoveren når en dismissal skjer,\n     * som ved å klikke utenfor eller trykke på \"Escape\"-tasten.\n     *\n     * @see https://floating-ui.com/docs/usedismiss\n     *\n     * @default { enabled: true }\n     */\n    dismissOptions?: DismissOptions;\n}\n\nconst usePopover = ({\n    open: _open,\n    onOpenChange: _onOpenChange,\n    placement = \"bottom-start\",\n    strategy = \"absolute\",\n    modal = true,\n    offset: _offset = 4,\n    positionReference,\n    hoverOptions,\n    focusOptions,\n    clickOptions,\n    roleOptions,\n    dismissOptions,\n}: PopoverOptions) => {\n    const [uncontrolledOpen, setUncontrolledOpen] = React.useState(_open);\n\n    const open = _open ?? uncontrolledOpen;\n    const onOpenChange = _onOpenChange ?? setUncontrolledOpen;\n\n    const data = useFloating({\n        open,\n        onOpenChange,\n        placement,\n        strategy,\n        middleware: [\n            offset(_offset),\n            flip({ padding: 5, fallbackPlacements: [\"bottom\", \"top\"] }),\n            shift({ padding: 12 }),\n        ],\n        whileElementsMounted: autoUpdate,\n    });\n\n    const context = data.context;\n\n    const click = useClick(context, {\n        enabled: false,\n        ...clickOptions,\n    });\n    const hover = useHover(context, { enabled: false, ...hoverOptions });\n    const focus = useFocus(context, { enabled: false, ...focusOptions });\n    const dismiss = useDismiss(context, dismissOptions);\n    const role = useRole(context, roleOptions);\n\n    const interactions = useInteractions([click, dismiss, focus, hover, role]);\n\n    React.useLayoutEffect(() => {\n        if (positionReference) {\n            data.refs.setPositionReference(positionReference?.current);\n        }\n    }, [positionReference, data.refs]);\n\n    return React.useMemo(\n        () => ({\n            open,\n            onOpenChange,\n            modal,\n            ...interactions,\n            ...data,\n        }),\n        [open, onOpenChange, modal, interactions, data],\n    );\n};\n\ntype PopoverContextType = ReturnType<typeof usePopover> | null;\n\nconst PopoverContext = React.createContext<PopoverContextType>(null);\n\nconst usePopoverContext = () => {\n    const context = React.useContext(PopoverContext);\n\n    if (context == null) {\n        throw new Error(\"Popover komponenter må brukes innenfor en <Popover /> komponent\");\n    }\n\n    return context;\n};\n\nconst Popover = ({\n    children,\n    ...restOptions\n}: {\n    children: React.ReactNode;\n} & PopoverOptions) => {\n    const popover = usePopover({ ...restOptions });\n    return <PopoverContext.Provider value={popover}>{children}</PopoverContext.Provider>;\n};\n\ninterface PopoverTriggerProps {\n    children: React.ReactNode;\n    /**\n     * Rendrer komponenten som child-elementet sitt, og slår sammen egenskaper og props.\n     *\n     * Default er `false`.\n     *\n     * @example\n     * ```tsx\n     * <Component asChild foo=\"bar\">\n     *    <Child baz=\"qux\" />\n     * </Component>\n     *\n     * // Rendrer følgende:\n     * <Child foo=\"bar\" baz=\"qux\" />\n     * ```\n     */\n    asChild?: boolean;\n}\n\nconst PopoverTrigger = React.forwardRef<HTMLElement, React.HTMLProps<HTMLElement> & PopoverTriggerProps>(\n    function PopoverTrigger({ children, asChild = false, ...props }, propRef) {\n        const { refs, getReferenceProps, open, onOpenChange } = usePopoverContext();\n        const childrenRef = (children as any).ref;\n        const ref = useMergeRefs([refs.setReference, propRef, childrenRef]);\n\n        if (asChild && React.isValidElement(children)) {\n            return React.cloneElement(\n                children,\n                getReferenceProps({\n                    ref,\n                    ...props,\n                    ...children.props,\n                }),\n            );\n        }\n\n        return (\n            <button ref={ref} onClick={() => onOpenChange?.(!open)} aria-expanded={open} {...getReferenceProps(props)}>\n                {children}\n            </button>\n        );\n    },\n);\n\ninterface PopoverContentProps {\n    /**\n     * Padding rundt innholdet i popoveren.\n     *\n     * Default er `0`.\n     */\n    padding?: 0 | 8 | 16 | 24;\n    /**\n     *\n     * Angir hvilket element som skal motta fokus ved åpning.\n     * Kan være en tabbar index eller en referanse til et element.\"\n     *\n     * Default er `0`, som betyr at det første fokuserbare elementet i popoveren får fokus.\n     * @see https://floating-ui.com/docs/FloatingFocusManager#initialfocus\n     */\n    initialFocus?: number | React.RefObject<HTMLElement>;\n    /**\n     * Angir om fokus skal returneres til triggeren når popoveren lukkes.\n     *\n     * Default er `true`.\n     * @see https://floating-ui.com/docs/FloatingFocusManager#returnfocus\n     */\n    returnFocus?: boolean;\n}\n\n// Er popover-elementet posisjonert i forhold til et annet element enn triggeren?\nconst isCustomPositioned = (referenceElement: ReferenceElement): referenceElement is VirtualElement => {\n    if (!referenceElement) return false;\n\n    return \"contextElement\" in referenceElement;\n};\n\nconst PopoverContent = React.forwardRef<HTMLDivElement, React.HTMLProps<HTMLDivElement> & PopoverContentProps>(\n    function PopoverContent(\n        { style, className, padding = 0, initialFocus = 0, returnFocus = true, ...props },\n        propRef,\n    ) {\n        const { context, modal, refs, open, floatingStyles, getFloatingProps } = usePopoverContext();\n        const ref = useMergeRefs([refs.setFloating, propRef]);\n\n        const referenceElement = refs.reference.current as ReferenceElement;\n\n        const { theme, density } = isCustomPositioned(referenceElement)\n            ? getThemeAndDensity(referenceElement.contextElement)\n            : getThemeAndDensity(referenceElement);\n\n        if (!open) return null;\n\n        return (\n            <FloatingPortal>\n                <FloatingFocusManager\n                    context={context}\n                    modal={modal}\n                    initialFocus={initialFocus}\n                    returnFocus={returnFocus}\n                >\n                    <div\n                        data-theme={theme}\n                        data-layout-density={density}\n                        className={clsx(\"jkl jkl-popover\", className)}\n                        ref={ref}\n                        style={\n                            {\n                                ...style,\n                                ...floatingStyles,\n                                \"--popover-padding\": `var(--jkl-spacing-${padding})`,\n                            } as React.CSSProperties\n                        }\n                        {...getFloatingProps(props)}\n                    >\n                        {props.children}\n                    </div>\n                </FloatingFocusManager>\n            </FloatingPortal>\n        );\n    },\n);\n\nPopover.Trigger = PopoverTrigger;\nPopover.Content = PopoverContent;\n\nexport default Popover;\n"],"names":["PopoverContext","React","createContext","usePopoverContext","context","useContext","Error","Popover","children","restOptions","popover","open","_open","onOpenChange","_onOpenChange","placement","strategy","modal","offset","_offset","positionReference","hoverOptions","focusOptions","clickOptions","roleOptions","dismissOptions","uncontrolledOpen","setUncontrolledOpen","useState","data","useFloating","middleware","flip","padding","fallbackPlacements","shift","whileElementsMounted","autoUpdate","click","useClick","enabled","hover","useHover","focus","useFocus","dismiss","useDismiss","role","useRole","interactions","useInteractions","useLayoutEffect","refs","setPositionReference","current","useMemo","usePopover","Provider","value","PopoverTrigger","forwardRef","asChild","props","propRef","getReferenceProps","childrenRef","ref","useMergeRefs","setReference","isValidElement","cloneElement","jsx","onClick","PopoverContent","style","className","initialFocus","returnFocus","floatingStyles","getFloatingProps","setFloating","referenceElement","reference","theme","density","getThemeAndDensity","contextElement","FloatingPortal","FloatingFocusManager","clsx","Trigger","Content"],"mappings":"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"}

package/build/cjs/components/popover/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../src/components/popover/utils.ts"],"sourcesContent":["export const getThemeAndDensity = (element: HTMLElement | null): { theme?: string; density?: string } => {\n    if (!element) return {};\n\n    const computedStyles = getComputedStyle(element);\n\n    const theme =\n        parseInt(computedStyles.getPropertyValue(\"--jkl-background-color\").replace(\"#\", \"\"), 16) < 0xffffff / 2\n            ? \"dark\"\n            : \"light\";\n\n    const density = computedStyles.getPropertyValue(\"--jkl-density\") === '\"compact\"' ? \"compact\" : \"comfortable\";\n\n    return { theme, density };\n};\n"],"names":["element","computedStyles","getComputedStyle","theme","parseInt","getPropertyValue","replace","density"],"mappings":"2GAAmCA,IAC3B,IAACA,EAAS,MAAO,GAEf,MAAAC,EAAiBC,iBAAiBF,GASjC,MAAA,CAAEG,MANLC,SAASH,EAAeI,iBAAiB,0BAA0BC,QAAQ,IAAK,IAAK,IAAM,UACrF,OACA,QAIMC,QAFqD,cAArDN,EAAeI,iBAAiB,iBAAmC,UAAY"}
+{"version":3,"file":"utils.js","sources":["../../../../src/components/popover/utils.ts"],"sourcesContent":["export const getThemeAndDensity = (element: Element | undefined): { theme?: string; density?: string } => {\n    if (!element) return {};\n\n    const computedStyles = getComputedStyle(element);\n\n    const theme =\n        parseInt(computedStyles.getPropertyValue(\"--jkl-background-color\").replace(\"#\", \"\"), 16) < 0xffffff / 2\n            ? \"dark\"\n            : \"light\";\n\n    const density = computedStyles.getPropertyValue(\"--jkl-density\") === '\"compact\"' ? \"compact\" : \"comfortable\";\n\n    return { theme, density };\n};\n"],"names":["element","computedStyles","getComputedStyle","theme","parseInt","getPropertyValue","replace","density"],"mappings":"2GAAmCA,IAC3B,IAACA,EAAS,MAAO,GAEf,MAAAC,EAAiBC,iBAAiBF,GASjC,MAAA,CAAEG,MANLC,SAASH,EAAeI,iBAAiB,0BAA0BC,QAAQ,IAAK,IAAK,IAAM,UACrF,OACA,QAIMC,QAFqD,cAArDN,EAAeI,iBAAiB,iBAAmC,UAAY"}

package/build/cjs/components/text-input/BaseTextInput.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("../../../clsx-E3yX_9sL.cjs"),n=require("react"),i=require("../icon-button/IconButton.js");function a(t,e){return t?{width:t}:e?{width:`calc(${Math.min(e,40)}ch + 24px)`}:void 0}const s=n.forwardRef(((n,s)=>{const{action:l,align:r="left","aria-invalid":c,className:u="",density:o,maxLength:p,style:x,type:d="text",unit:j,width:h,...m}=n;return t.jsxs("div",{className:"jkl-text-input-wrapper","data-invalid":c,style:{...x,...a(h,p)},children:[t.jsx("input",{"aria-invalid":c,ref:s,className:e.clsx("jkl-text-input__input",u,{"jkl-text-input__input--align-right":"right"===r}),maxLength:p,type:d,...m}),j&&t.jsx("span",{className:"jkl-text-input__unit",children:j}),l&&t.jsx(i.IconButton,{density:o,className:e.clsx("jkl-text-input-action-button",l.className),title:l.label,onClick:l.onClick,onFocus:l.onFocus,onBlur:l.onBlur,ref:l.buttonRef,type:l.type||"button",children:l.icon})]})}));s.displayName="BaseInputField",exports.BaseTextInput=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("../../../clsx-E3yX_9sL.cjs"),n=require("react"),i=require("../icon-button/IconButton.js");function a(t,e){return t?{width:t}:e?{width:`calc(${Math.min(e,40)}ch + 24px)`}:void 0}const s=n.forwardRef(((n,s)=>{const{action:l,align:r="left","aria-invalid":c,className:o="",density:u,maxLength:p,style:x,type:d="text",unit:j,width:h,actionButton:m,...y}=n;return t.jsxs("div",{className:"jkl-text-input-wrapper","data-invalid":c,style:{...x,...a(h,p)},children:[t.jsx("input",{"aria-invalid":c,ref:s,className:e.clsx("jkl-text-input__input",o,{"jkl-text-input__input--align-right":"right"===r}),maxLength:p,type:d,...y}),j&&t.jsx("span",{className:"jkl-text-input__unit",children:j}),!l&&m&&m,l&&!m&&t.jsx(i.IconButton,{density:u,className:e.clsx("jkl-text-input-action-button",l.className),title:l.label,onClick:l.onClick,onFocus:l.onFocus,onBlur:l.onBlur,ref:l.buttonRef,type:l.type||"button",children:l.icon})]})}));s.displayName="BaseInputField",exports.BaseTextInput=s;
 //# sourceMappingURL=BaseTextInput.js.map

package/build/cjs/components/text-input/BaseTextInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseTextInput.js","sources":["../../../../src/components/text-input/BaseTextInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type CSSProperties,\n    forwardRef,\n    type MouseEventHandler,\n    type ReactNode,\n    InputHTMLAttributes,\n    HTMLProps,\n} from \"react\";\nimport { Density } from \"../../core\";\nimport { IconProps } from \"../icon\";\nimport { IconButton } from \"../icon-button\";\n\nfunction getWidthAsStyle(width?: string, maxLength?: number): CSSProperties | undefined {\n    if (width) {\n        return { width }; // prioritize width prop\n    }\n\n    if (maxLength) {\n        // adapt to maxLength, but capped at 40ch\n        const length = `${Math.min(maxLength, 40)}ch`;\n        const padding = \"24px\"; // left + right padding\n        return { width: `calc(${length} + ${padding})` };\n    }\n\n    return undefined;\n}\n\ninterface ActionBaseProps extends Exclude<HTMLProps<HTMLButtonElement>, \"disabled\"> {\n    icon: React.ReactElement<IconProps>;\n    label: string;\n    buttonRef?: React.Ref<HTMLButtonElement>;\n}\n\nexport interface ActionButton extends ActionBaseProps {\n    type?: \"button\" | \"reset\";\n    onClick: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport interface ActionSubmit extends ActionBaseProps {\n    type: \"submit\";\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport type Action = ActionButton | ActionSubmit;\n\nexport interface BaseTextInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"children\"> {\n    /**\n     * Brukes til inputfelter hvor det brukes maskering, for formatering av store tall. Brukes typisk bare til valuta.\n     * @default \"left\"\n     */\n    align?: \"left\" | \"right\";\n    action?: Action;\n    density?: Density;\n    /**\n     * Benevnelse for feltet. Unngå å bruke både benevnelse og handling samtidig\n     * @example \"kr\"\n     * */\n    unit?: ReactNode;\n    width?: string;\n}\n\nexport const BaseTextInput = forwardRef<HTMLInputElement, BaseTextInputProps>((props, ref) => {\n    const {\n        action,\n        align = \"left\",\n        \"aria-invalid\": ariaInvalid,\n        className = \"\",\n        density,\n        maxLength,\n        style,\n        type = \"text\",\n        unit,\n        width,\n        ...rest\n    } = props;\n\n    return (\n        <div\n            className=\"jkl-text-input-wrapper\"\n            data-invalid={ariaInvalid}\n            style={{ ...style, ...getWidthAsStyle(width, maxLength) }}\n        >\n            <input\n                aria-invalid={ariaInvalid}\n                ref={ref}\n                className={clsx(\"jkl-text-input__input\", className, {\n                    \"jkl-text-input__input--align-right\": align === \"right\",\n                })}\n                maxLength={maxLength}\n                type={type}\n                {...rest}\n            />\n            {unit && <span className=\"jkl-text-input__unit\">{unit}</span>}\n            {action && (\n                <IconButton\n                    density={density}\n                    className={clsx(\"jkl-text-input-action-button\", action.className)}\n                    title={action.label}\n                    onClick={action.onClick}\n                    onFocus={action.onFocus}\n                    onBlur={action.onBlur}\n                    ref={action.buttonRef}\n                    type={action.type || \"button\"}\n                >\n                    {action.icon}\n                </IconButton>\n            )}\n        </div>\n    );\n});\n\nBaseTextInput.displayName = \"BaseInputField\";\n"],"names":["getWidthAsStyle","width","maxLength","Math","min","BaseTextInput","forwardRef","props","ref","action","align","ariaInvalid","className","density","style","type","unit","rest","jsxs","children","jsx","clsx","IconButton","title","label","onClick","onFocus","onBlur","buttonRef","icon","displayName"],"mappings":"0NAaA,SAASA,EAAgBC,EAAgBC,GACrC,OAAID,EACO,CAAEA,MAAAA,GAGTC,EAIO,CAAED,MAAO,QAFEE,KAAKC,IAAIF,EAAW,sBAF1C,CAQJ,CAoCO,MAAMG,EAAgBC,EAAAA,YAAiD,CAACC,EAAOC,KAC5E,MACFC,OAAAA,EACAC,MAAAA,EAAQ,OACR,eAAgBC,EAChBC,UAAAA,EAAY,GACZC,QAAAA,EACAX,UAAAA,EACAY,MAAAA,EACAC,KAAAA,EAAO,OACPC,KAAAA,EACAf,MAAAA,KACGgB,GACHV,EAGA,OAAAW,EAAAA,KAAC,MAAA,CACGN,UAAU,yBACV,eAAcD,EACdG,MAAO,IAAKA,KAAUd,EAAgBC,EAAOC,IAE7CiB,SAAA,CAAAC,EAAAA,IAAC,QAAA,CACG,eAAcT,EACdH,IAAAA,EACAI,UAAWS,EAAAA,KAAK,wBAAyBT,EAAW,CAChD,qCAAgD,UAAVF,IAE1CR,UAAAA,EACAa,KAAAA,KACIE,IAEPD,GAAQI,EAAAA,IAAC,OAAK,CAAAR,UAAU,uBAAwBO,SAAKH,IACrDP,GACGW,EAAAA,IAACE,EAAAA,WAAA,CACGT,QAAAA,EACAD,UAAWS,EAAAA,KAAK,+BAAgCZ,EAAOG,WACvDW,MAAOd,EAAOe,MACdC,QAAShB,EAAOgB,QAChBC,QAASjB,EAAOiB,QAChBC,OAAQlB,EAAOkB,OACfnB,IAAKC,EAAOmB,UACZb,KAAMN,EAAOM,MAAQ,SAEpBI,SAAOV,EAAAoB,SACZ,IAMhBxB,EAAcyB,YAAc"}
+{"version":3,"file":"BaseTextInput.js","sources":["../../../../src/components/text-input/BaseTextInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type CSSProperties,\n    forwardRef,\n    type MouseEventHandler,\n    type ReactNode,\n    InputHTMLAttributes,\n    HTMLProps,\n} from \"react\";\nimport { Density } from \"../../core\";\nimport { IconProps } from \"../icon\";\nimport { IconButton } from \"../icon-button\";\n\nfunction getWidthAsStyle(width?: string, maxLength?: number): CSSProperties | undefined {\n    if (width) {\n        return { width }; // prioritize width prop\n    }\n\n    if (maxLength) {\n        // adapt to maxLength, but capped at 40ch\n        const length = `${Math.min(maxLength, 40)}ch`;\n        const padding = \"24px\"; // left + right padding\n        return { width: `calc(${length} + ${padding})` };\n    }\n\n    return undefined;\n}\n\ninterface ActionBaseProps extends Exclude<HTMLProps<HTMLButtonElement>, \"disabled\"> {\n    icon: React.ReactElement<IconProps>;\n    label: string;\n    buttonRef?: React.Ref<HTMLButtonElement>;\n}\n\nexport interface ActionButton extends ActionBaseProps {\n    type?: \"button\" | \"reset\";\n    onClick: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport interface ActionSubmit extends ActionBaseProps {\n    type: \"submit\";\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport type Action = ActionButton | ActionSubmit;\n\nexport interface BaseTextInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"children\"> {\n    /**\n     * Brukes til inputfelter hvor det brukes maskering, for formatering av store tall. Brukes typisk bare til valuta.\n     * @default \"left\"\n     */\n    align?: \"left\" | \"right\";\n    /**\n     * @deprecated Bruk heller actionButton\n     *\n     */\n    action?: Action;\n    density?: Density;\n    /**\n     * Benevnelse for feltet. Unngå å bruke både benevnelse og handling samtidig\n     * @example \"kr\"\n     * */\n    unit?: ReactNode;\n    width?: string;\n    /**\n     * Element som vises til høyre for inputfeltet. Brukes typisk til å trigge en handling som f.eks. å vise/skjule passord.\n     */\n    actionButton?: React.ReactElement<IconProps>;\n}\n\nexport const BaseTextInput = forwardRef<HTMLInputElement, BaseTextInputProps>((props, ref) => {\n    const {\n        action,\n        align = \"left\",\n        \"aria-invalid\": ariaInvalid,\n        className = \"\",\n        density,\n        maxLength,\n        style,\n        type = \"text\",\n        unit,\n        width,\n        actionButton,\n        ...rest\n    } = props;\n\n    return (\n        <div\n            className=\"jkl-text-input-wrapper\"\n            data-invalid={ariaInvalid}\n            style={{ ...style, ...getWidthAsStyle(width, maxLength) }}\n        >\n            <input\n                aria-invalid={ariaInvalid}\n                ref={ref}\n                className={clsx(\"jkl-text-input__input\", className, {\n                    \"jkl-text-input__input--align-right\": align === \"right\",\n                })}\n                maxLength={maxLength}\n                type={type}\n                {...rest}\n            />\n            {unit && <span className=\"jkl-text-input__unit\">{unit}</span>}\n            {!action && actionButton && actionButton}\n            {action && !actionButton && (\n                <IconButton\n                    density={density}\n                    className={clsx(\"jkl-text-input-action-button\", action.className)}\n                    title={action.label}\n                    onClick={action.onClick}\n                    onFocus={action.onFocus}\n                    onBlur={action.onBlur}\n                    ref={action.buttonRef}\n                    type={action.type || \"button\"}\n                >\n                    {action.icon}\n                </IconButton>\n            )}\n        </div>\n    );\n});\n\nBaseTextInput.displayName = \"BaseInputField\";\n"],"names":["getWidthAsStyle","width","maxLength","Math","min","BaseTextInput","forwardRef","props","ref","action","align","ariaInvalid","className","density","style","type","unit","actionButton","rest","jsxs","children","jsx","clsx","IconButton","title","label","onClick","onFocus","onBlur","buttonRef","icon","displayName"],"mappings":"0NAaA,SAASA,EAAgBC,EAAgBC,GACrC,OAAID,EACO,CAAEA,MAAAA,GAGTC,EAIO,CAAED,MAAO,QAFEE,KAAKC,IAAIF,EAAW,sBAF1C,CAQJ,CA4CO,MAAMG,EAAgBC,EAAAA,YAAiD,CAACC,EAAOC,KAC5E,MACFC,OAAAA,EACAC,MAAAA,EAAQ,OACR,eAAgBC,EAChBC,UAAAA,EAAY,GACZC,QAAAA,EACAX,UAAAA,EACAY,MAAAA,EACAC,KAAAA,EAAO,OACPC,KAAAA,EACAf,MAAAA,EACAgB,aAAAA,KACGC,GACHX,EAGA,OAAAY,EAAAA,KAAC,MAAA,CACGP,UAAU,yBACV,eAAcD,EACdG,MAAO,IAAKA,KAAUd,EAAgBC,EAAOC,IAE7CkB,SAAA,CAAAC,EAAAA,IAAC,QAAA,CACG,eAAcV,EACdH,IAAAA,EACAI,UAAWU,EAAAA,KAAK,wBAAyBV,EAAW,CAChD,qCAAgD,UAAVF,IAE1CR,UAAAA,EACAa,KAAAA,KACIG,IAEPF,GAAQK,EAAAA,IAAC,OAAK,CAAAT,UAAU,uBAAwBQ,SAAKJ,KACpDP,GAAUQ,GAAgBA,EAC3BR,IAAWQ,GACRI,EAAAA,IAACE,EAAAA,WAAA,CACGV,QAAAA,EACAD,UAAWU,EAAAA,KAAK,+BAAgCb,EAAOG,WACvDY,MAAOf,EAAOgB,MACdC,QAASjB,EAAOiB,QAChBC,QAASlB,EAAOkB,QAChBC,OAAQnB,EAAOmB,OACfpB,IAAKC,EAAOoB,UACZd,KAAMN,EAAOM,MAAQ,SAEpBK,SAAOX,EAAAqB,SACZ,IAMhBzB,EAAc0B,YAAc"}

package/build/cjs/components/toggle-switch/documentation/Example.js

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),o=require("../../../../formatCode-C0vvPbYm.cjs");require("react"),require("../ToggleSwitch.js"),require("../../../hooks/useScreen/useScreen.js"),require("../../../hooks/useId/useId.js"),require("../../button/Button.js");const t=[{type:"bool",label:"Deaktivert",boolOptions:{trueValue:!0,falseValue:!1}}],n=o.formatCode('import React from "react";\nimport { ToggleSwitch } from "..";\nimport { PrimaryButton } from "../../button";\n\nexport const knobs = [\n    {\n        type: "bool",\n        label: "Deaktivert",\n        boolOptions: {\n            trueValue: true,\n            falseValue: false,\n        },\n    },\n];\n\nexport const ToggleSwitchExample = () => {\n    /* -- EXAMPLE CODE START -- */\n    const isDisabled = boolKnob("Deaktivert");\n\n    const handleToggle = (event, pressed) => console.log("Mørk modus satt til: ", pressed, event);\n\n    return (\n        <ToggleSwitch disabled={isDisabled} onChange={handleToggle}>\n            Mørk modus\n        </ToggleSwitch>\n    );\n    /* -- EXAMPLE CODE END -- */\n};\n');module.exports=function(){const r=o.useInteractiveCodeControls(n,t);return e.jsx("div",{className:"jkl",children:e.jsx(o.InteractiveCode,{title:"Loader",defaultCode:n,defaultShowEditor:!0,noInline:!0,controls:r})})};
+//# sourceMappingURL=Example.js.map

package/build/cjs/components/toggle-switch/documentation/Example.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Example.js","sources":["../../../../../src/components/toggle-switch/documentation/ToggleSwitchExample.jsx","../../../../../src/components/toggle-switch/documentation/Example.tsx","../../../../../src/components/toggle-switch/documentation/ToggleSwitchExample.jsx?raw"],"sourcesContent":["import React from \"react\";\nimport { ToggleSwitch } from \"..\";\nimport { PrimaryButton } from \"../../button\";\n\nexport const knobs = [\n    {\n        type: \"bool\",\n        label: \"Deaktivert\",\n        boolOptions: {\n            trueValue: true,\n            falseValue: false,\n        },\n    },\n];\n\nexport const ToggleSwitchExample = () => {\n    /* -- EXAMPLE CODE START -- */\n    const isDisabled = boolKnob(\"Deaktivert\");\n\n    const handleToggle = (event, pressed) => console.log(\"Mørk modus satt til: \", pressed, event);\n\n    return (\n        <ToggleSwitch disabled={isDisabled} onChange={handleToggle}>\n            Mørk modus\n        </ToggleSwitch>\n    );\n    /* -- EXAMPLE CODE END -- */\n};\n","import React from \"react\";\nimport { formatCode, InteractiveCode, useInteractiveCodeControls } from \"../../../../../../utils/interactive-code\";\n// @ts-ignore\nimport { knobs } from \"./ToggleSwitchExample\";\n// @ts-ignore\nimport ToggleSwitchExample from \"./ToggleSwitchExample?raw\";\n\nimport \"../styles/toggle-switch.scss\";\n\nconst code = formatCode(ToggleSwitchExample);\n\nexport default function Example() {\n    const controls = useInteractiveCodeControls(code, knobs);\n\n    return (\n        <div className={\"jkl\"}>\n            <InteractiveCode\n                title={\"Loader\"}\n                defaultCode={code}\n                defaultShowEditor={true}\n                noInline={true}\n                controls={controls}\n            />\n        </div>\n    );\n}\n","export default \"import React from \\\"react\\\";\\nimport { ToggleSwitch } from \\\"..\\\";\\nimport { PrimaryButton } from \\\"../../button\\\";\\n\\nexport const knobs = [\\n    {\\n        type: \\\"bool\\\",\\n        label: \\\"Deaktivert\\\",\\n        boolOptions: {\\n            trueValue: true,\\n            falseValue: false,\\n        },\\n    },\\n];\\n\\nexport const ToggleSwitchExample = () => {\\n    /* -- EXAMPLE CODE START -- */\\n    const isDisabled = boolKnob(\\\"Deaktivert\\\");\\n\\n    const handleToggle = (event, pressed) => console.log(\\\"Mørk modus satt til: \\\", pressed, event);\\n\\n    return (\\n        <ToggleSwitch disabled={isDisabled} onChange={handleToggle}>\\n            Mørk modus\\n        </ToggleSwitch>\\n    );\\n    /* -- EXAMPLE CODE END -- */\\n};\\n\""],"names":["knobs","type","label","boolOptions","trueValue","falseValue","code","formatCode","controls","useInteractiveCodeControls","jsx","className","children","InteractiveCode","title","defaultCode","defaultShowEditor","noInline"],"mappings":"8QAIO,MAAMA,EAAQ,CACjB,CACIC,KAAM,OACNC,MAAO,aACPC,YAAa,CACTC,WAAW,EACXC,YAAY,KCDlBC,EAAOC,EAAAA,WCTE,muBDWf,WACU,MAAAC,EAAWC,EAAAA,2BAA2BH,EAAMN,GAG9C,OAAAU,EAAAA,IAAC,MAAI,CAAAC,UAAW,MACZC,SAAAF,EAAAA,IAACG,EAAAA,gBAAA,CACGC,MAAO,SACPC,YAAaT,EACbU,mBAAmB,EACnBC,UAAU,EACVT,SAAAA,KAIhB"}

package/build/cjs/components/toggle-switch/documentation/main.js

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),r=require("react-dom/client");require("react"),require("../../../hooks/useScreen/useScreen.js"),require("../../../hooks/useId/useId.js"),require("../../icon/Icon.js"),require("../../icon/icons/animated/ArrowVerticalAnimated.js"),require("../../icon/icons/animated/ArrowHorizontalAnimated.js"),require("../../icon/icons/animated/PlusRemoveAnimated.js"),require("../../icon/icons/ArrowDownIcon.js"),require("../../icon/icons/ArrowLeftIcon.js"),require("../../icon/icons/ArrowNorthEastIcon.js"),require("../../icon/icons/ArrowRightIcon.js"),require("../../icon/icons/ArrowUpIcon.js"),require("../../icon/icons/CalendarIcon.js"),require("../../icon/icons/CheckIcon.js"),require("../../icon/icons/ChevronDownIcon.js"),require("../../icon/icons/ChevronLeftIcon.js"),require("../../icon/icons/ChevronRightIcon.js"),require("../../icon/icons/ChevronUpIcon.js"),require("../../icon/icons/CloseIcon.js"),require("../../icon/icons/CopyIcon.js"),require("../../icon/icons/DotsIcon.js"),require("../../icon/icons/DragIcon.js"),require("../../icon/icons/ErrorIcon.js"),require("../../icon/icons/GreenCheckIcon.js"),require("../../icon/icons/HamburgerIcon.js"),require("../../icon/icons/InfoIcon.js"),require("../../icon/icons/LinkIcon.js"),require("../../icon/icons/PlusIcon.js"),require("../../icon/icons/QuestionIcon.js"),require("../../icon/icons/RedCrossIcon.js"),require("../../icon/icons/SearchIcon.js"),require("../../icon/icons/SuccessIcon.js"),require("../../icon/icons/WarningIcon.js"),require("../../icon/icons/MinusIcon.js"),require("../../icon/icons/ThumbDownIcon.js"),require("../../icon/icons/ThumbUpIcon.js"),require("../../icon/icons/TrashCanIcon.js"),require("../../icon/icons/PenIcon.js"),require("../../button/Button.js"),require("../../card/Card.js"),require("../../card/CardImage.js"),require("../../card/NavCard.js"),require("../../checkbox/Checkbox.js"),require("../../combobox/Combobox.js"),require("../../cookie-consent/CookieConsentContext.js"),require("react-dom"),require("../../modal/Modal.js"),require("react-a11y-dialog"),require("../../list/List.js"),require("../../list/ListItem.js"),require("../../datepicker/DatePicker.js"),require("../../feedback/feedbackContext.js"),require("../../message/Message.js"),require("../../message/FormErrorMessage.js"),require("../../tooltip/Tooltip.js"),require("../../tooltip/TooltipContent.js"),require("../../tooltip/TooltipTrigger.js"),require("../../input-group/InputGroup.js"),require("../../feedback/followup/followupContext.js"),require("../../feedback/main-question/mainQuestionContext.js"),require("../../radio-button/RadioButton.js"),require("../../radio-button/radioGroupContext.js"),require("../../radio-button/BaseRadioButton.js"),require("../../text-input/BaseTextArea.js"),require("../../text-input/BaseTextInput.js"),require("../../text-input/TextArea.js"),require("../../text-input/TextInput.js"),require("../../../utilities/polymorphism/SlotComponent.js");const i=require("../../../utilities/tabListener.js");require("../../../../ExpandableTableRow-BQjBxKCX.cjs"),require("../../icon-button/IconButton.js"),require("../../link/Link.js"),require("../../link/NavLink.js"),require("../../link-list/LinkList.js"),require("../../logo/text-paths/ForsikringLevertAvFremtind.js"),require("../../logo/text-paths/FraSB1ogDNB.js"),require("../../logo/text-paths/InnovasjonFraFremtind.js"),require("../../logo/text-paths/TeknologiFraFremtind.js"),require("../../logo/text-paths/VartEgetForsikringsselskap.js"),require("../../logo/text-paths/VartForsikringsselskap.js"),require("../../popover/Popover.js"),require("../../system-message/SystemMessage.js"),require("../../table/DataTable.js"),require("../../table/Table.js"),require("../../table/TableBody.js"),require("../../table/TableCaption.js"),require("../../table/TableCell.js"),require("../../table/TableColumn.js"),require("../../table/TableColumnGroup.js"),require("../../table/tableContext.js"),require("../../table/tableSectionContext.js"),require("../../table/TableFooter.js"),require("../../table/TableHead.js"),require("../../table/TableHeader.js"),require("../../table/TableRow.js"),require("../../tabs/NavTab.js"),require("../../tabs/tabsContext.js"),require("../../tabs/Tab.js"),require("../../tag/Tag.js"),require("../../toast/toastContext.js"),require("../ToggleSwitch.js");const o=require("./Example.js");i.initTabListener(),r.createRoot(document.getElementById("root")).render(e.jsx(o,{}));
+//# sourceMappingURL=main.js.map

package/build/cjs/components/toggle-switch/documentation/main.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.js","sources":["../../../../../src/components/toggle-switch/documentation/main.tsx"],"sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom/client\";\nimport { initTabListener } from \"../../..\";\nimport Example from \"./Example\";\n\ninitTabListener();\n\nReactDOM.createRoot(document.getElementById(\"root\")!).render(<Example />);\n"],"names":["initTabListener","ReactDOM","createRoot","document","getElementById","render","jsx","Example"],"mappings":"gyIAKAA,EAAAA,kBAEAC,EAASC,WAAWC,SAASC,eAAe,SAAUC,OAAQC,EAAAA,IAAAC,EAAA,CAAA"}

package/build/cjs/components/toggle-switch/documentation/vite.dev.config.js

@@ -0,0 +1,2 @@
+"use strict";const e=require("node:path"),i=require("@vitejs/plugin-react-swc"),r=require("vite"),s=require("../../../../copy-jkl-fonts-BEH11kbT.cjs"),o=r.defineConfig({plugins:[i(),s.copyJklFonts(e.resolve(__dirname,"public","fonts"))]});module.exports=o;
+//# sourceMappingURL=vite.dev.config.js.map

package/build/cjs/components/toggle-switch/documentation/vite.dev.config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vite.dev.config.js","sources":["../../../../../src/components/toggle-switch/documentation/vite.dev.config.ts"],"sourcesContent":["import { resolve } from \"path\";\nimport react from \"@vitejs/plugin-react-swc\";\nimport { defineConfig } from \"vite\";\nimport { copyJklFonts } from \"../../../../../../utils/vite\";\n\nexport default defineConfig({\n    plugins: [react(), copyJklFonts(resolve(__dirname, \"public\", \"fonts\"))],\n});\n"],"names":["vite_dev_config","defineConfig","plugins","react","copyJklFonts","resolve","__dirname"],"mappings":"uJAKAA,EAAeC,eAAa,CACxBC,QAAS,CAACC,IAASC,EAAAA,aAAaC,UAAQC,UAAW,SAAU"}