@fremtind/jokul 0.27.1 → 0.27.3

package/build/cjs/components/menu/MenuItemCheckbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItemCheckbox.cjs","sources":["../../../../src/components/menu/MenuItemCheckbox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    forwardRef,\n    type HTMLAttributes,\n    type KeyboardEventHandler,\n    type MouseEventHandler,\n    type ReactNode,\n} from \"react\";\nimport { SwipeChangeHandler, useSwipeGesture } from \"../../hooks/useSwipeGesture/useSwipeGesture.js\";\nimport { CheckIcon } from \"../icon/index.js\";\n\nexport interface MenuItemCheckboxProps extends Omit<HTMLAttributes<HTMLDivElement>, \"aria-checked\" | \"onChange\"> {\n    \"aria-checked\": boolean;\n    /**\n     * Et ikon som vises før innholdet i menypunktet\n     */\n    icon?: ReactNode;\n    onChange?: SwipeChangeHandler<HTMLDivElement> &\n        ((event: React.KeyboardEvent<HTMLDivElement> | React.PointerEvent<HTMLDivElement>, pressed: boolean) => void);\n}\n\nexport const MenuItemCheckbox = forwardRef<HTMLDivElement, MenuItemCheckboxProps>((props, ref) => {\n    const {\n        \"aria-checked\": checked,\n        className,\n        children,\n        icon,\n        onChange,\n        onClick,\n        onPointerCancel,\n        onPointerDown,\n        onPointerMove,\n        onPointerUp,\n        onKeyDown,\n        ...rest\n    } = props;\n\n    const handleClick: MouseEventHandler<HTMLDivElement> = (event) => {\n        event.preventDefault(); // Prevents the menu from closing on toggle\n        onChange?.(event, !checked);\n        onClick?.(event);\n    };\n\n    const handleChange: SwipeChangeHandler<HTMLDivElement> = (event, toggleTo) => {\n        if (toggleTo !== checked) {\n            onChange?.(event, toggleTo);\n        }\n    };\n\n    const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = (event) => {\n        if (event.key === \"Enter\") {\n            onChange?.(event, !checked);\n        } else if (event.key === \" \") {\n            event.preventDefault(); // Prevents the menu from closing on toggle, https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menuitemcheckbox_role#keyboard_interactions\n            onChange?.(event, !checked);\n        }\n        onKeyDown?.(event);\n    };\n\n    const { gestureHandlers } = useSwipeGesture({\n        onClick: handleClick,\n        onChange: handleChange,\n        onPointerCancel,\n        onPointerDown,\n        onPointerMove,\n        onPointerUp,\n    });\n\n    return (\n        <div\n            ref={ref}\n            tabIndex={-1}\n            {...rest}\n            role=\"menuitemcheckbox\"\n            aria-checked={checked}\n            className={clsx(\"jkl-menu-item\", \"jkl-menu-item--checkbox\", className)}\n            {...gestureHandlers}\n            onKeyDown={handleKeyDown}\n        >\n            {icon && <span className=\"jkl-menu-item__icon\">{icon}</span>}\n            <div className=\"jkl-menu-item__content\">{children}</div>\n            <div className=\"jkl-toggle-switch\">\n                <div className=\"jkl-toggle-switch-widget\">\n                    <div className=\"jkl-toggle-switch-widget__slider\">\n                        <div className=\"jkl-toggle-switch-widget__knob\" />\n                        <CheckIcon variant=\"small\" bold className=\"jkl-toggle-switch-widget__indicator\" />\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n});\n\nMenuItemCheckbox.displayName = \"MenuItemCheckbox\";\n"],"names":["MenuItemCheckbox","forwardRef","props","ref","checked","className","children","icon","onChange","onClick","onPointerCancel","onPointerDown","onPointerMove","onPointerUp","onKeyDown","rest","gestureHandlers","useSwipeGesture","event","preventDefault","toggleTo","jsxs","tabIndex","role","clsx","key","jsx","CheckIcon","variant","bold","displayName"],"mappings":"osDAqBO,MAAMA,EAAmBC,EAAAA,YAAkD,CAACC,EAAOC,KAChF,MACF,eAAgBC,EAChBC,UAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,gBAAAA,EACAC,cAAAA,EACAC,cAAAA,EACAC,YAAAA,EACAC,UAAAA,KACGC,GACHb,GAwBIc,gBAAAA,GAAoBC,kBAAgB,CACxCR,QAvBoDS,IACpDA,EAAMC,iBACK,MAAAX,GAAAA,EAAAU,GAAQd,GACnB,MAAAK,GAAAA,EAAUS,EAAK,EAqBfV,SAlBqD,CAACU,EAAOE,KACzDA,IAAahB,IACb,MAAAI,GAAAA,EAAWU,EAAOE,KAiBtBV,gBAAAA,EACAC,cAAAA,EACAC,cAAAA,EACAC,YAAAA,IAIA,OAAAQ,EAAAA,KAAC,MAAA,CACGlB,IAAAA,EACAmB,UACC,KAAGP,EACJQ,KAAK,mBACL,eAAcnB,EACdC,UAAWmB,EAAAA,KAAK,gBAAiB,0BAA2BnB,MACxDW,EACJF,UA5BqDI,IACvC,UAAdA,EAAMO,IACK,MAAAjB,GAAAA,EAAAU,GAAQd,GACE,MAAdc,EAAMO,MACbP,EAAMC,iBACK,MAAAX,GAAAA,EAAAU,GAAQd,IAEvB,MAAAU,GAAAA,EAAYI,EAAK,EAuBZZ,SAAA,CAAAC,GAASmB,EAAAA,IAAA,OAAA,CAAKrB,UAAU,sBAAuBC,SAAKC,IACpDmB,EAAAA,IAAA,MAAA,CAAIrB,UAAU,yBAA0BC,SAAAA,IACzCoB,EAAAA,IAAC,MAAI,CAAArB,UAAU,oBACXC,SAAAoB,EAAAA,IAAC,MAAI,CAAArB,UAAU,2BACXC,SAAAe,OAAC,MAAI,CAAAhB,UAAU,mCACXC,SAAA,CAACoB,EAAAA,IAAA,MAAA,CAAIrB,UAAU,yCACdsB,EAAAA,UAAU,CAAAC,QAAQ,QAAQC,MAAI,EAACxB,UAAU,iDAGtD,IAKZL,EAAiB8B,YAAc"}
+{"version":3,"file":"MenuItemCheckbox.cjs","sources":["../../../../src/components/menu/MenuItemCheckbox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    forwardRef,\n    type HTMLAttributes,\n    type KeyboardEventHandler,\n    type MouseEventHandler,\n    type ReactNode,\n} from \"react\";\nimport {\n    SwipeChangeHandler,\n    useSwipeGesture,\n} from \"../../hooks/useSwipeGesture/useSwipeGesture.js\";\nimport { CheckIcon } from \"../icon/index.js\";\n\nexport interface MenuItemCheckboxProps\n    extends Omit<HTMLAttributes<HTMLDivElement>, \"aria-checked\" | \"onChange\"> {\n    \"aria-checked\": boolean;\n    /**\n     * Et ikon som vises før innholdet i menypunktet\n     */\n    icon?: ReactNode;\n    onChange?: SwipeChangeHandler<HTMLDivElement> &\n        ((\n            event:\n                | React.KeyboardEvent<HTMLDivElement>\n                | React.PointerEvent<HTMLDivElement>,\n            pressed: boolean,\n        ) => void);\n}\n\nexport const MenuItemCheckbox = forwardRef<\n    HTMLDivElement,\n    MenuItemCheckboxProps\n>((props, ref) => {\n    const {\n        \"aria-checked\": checked,\n        className,\n        children,\n        icon,\n        onChange,\n        onClick,\n        onPointerCancel,\n        onPointerDown,\n        onPointerMove,\n        onPointerUp,\n        onKeyDown,\n        ...rest\n    } = props;\n\n    const handleClick: MouseEventHandler<HTMLDivElement> = (event) => {\n        event.preventDefault(); // Prevents the menu from closing on toggle\n        onChange?.(event, !checked);\n        onClick?.(event);\n    };\n\n    const handleChange: SwipeChangeHandler<HTMLDivElement> = (\n        event,\n        toggleTo,\n    ) => {\n        if (toggleTo !== checked) {\n            onChange?.(event, toggleTo);\n        }\n    };\n\n    const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = (event) => {\n        if (event.key === \"Enter\") {\n            onChange?.(event, !checked);\n        } else if (event.key === \" \") {\n            event.preventDefault(); // Prevents the menu from closing on toggle, https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menuitemcheckbox_role#keyboard_interactions\n            onChange?.(event, !checked);\n        }\n        onKeyDown?.(event);\n    };\n\n    const { gestureHandlers } = useSwipeGesture({\n        onClick: handleClick,\n        onChange: handleChange,\n        onPointerCancel,\n        onPointerDown,\n        onPointerMove,\n        onPointerUp,\n    });\n\n    return (\n        <div\n            ref={ref}\n            tabIndex={-1}\n            {...rest}\n            role=\"menuitemcheckbox\"\n            aria-checked={checked}\n            className={clsx(\n                \"jkl-menu-item\",\n                \"jkl-menu-item--checkbox\",\n                className,\n            )}\n            {...gestureHandlers}\n            onKeyDown={handleKeyDown}\n        >\n            {icon && <span className=\"jkl-menu-item__icon\">{icon}</span>}\n            <div className=\"jkl-menu-item__content\">{children}</div>\n            <div className=\"jkl-toggle-switch\">\n                <div className=\"jkl-toggle-switch-widget\">\n                    <div className=\"jkl-toggle-switch-widget__slider\">\n                        <div className=\"jkl-toggle-switch-widget__knob\" />\n                        <CheckIcon\n                            variant=\"small\"\n                            bold\n                            className=\"jkl-toggle-switch-widget__indicator\"\n                        />\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n});\n\nMenuItemCheckbox.displayName = \"MenuItemCheckbox\";\n"],"names":["MenuItemCheckbox","forwardRef","props","ref","checked","className","children","icon","onChange","onClick","onPointerCancel","onPointerDown","onPointerMove","onPointerUp","onKeyDown","rest","gestureHandlers","useSwipeGesture","event","preventDefault","toggleTo","jsxs","tabIndex","role","clsx","key","jsx","CheckIcon","variant","bold","displayName"],"mappings":"osDA8BO,MAAMA,EAAmBC,EAAAA,YAG9B,CAACC,EAAOC,KACA,MACF,eAAgBC,EAChBC,UAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,gBAAAA,EACAC,cAAAA,EACAC,cAAAA,EACAC,YAAAA,EACAC,UAAAA,KACGC,GACHb,GA2BIc,gBAAAA,GAAoBC,kBAAgB,CACxCR,QA1BoDS,IACpDA,EAAMC,iBACK,MAAAX,GAAAA,EAAAU,GAAQd,GACnB,MAAAK,GAAAA,EAAUS,EAAK,EAwBfV,SArBqD,CACrDU,EACAE,KAEIA,IAAahB,IACb,MAAAI,GAAAA,EAAWU,EAAOE,KAiBtBV,gBAAAA,EACAC,cAAAA,EACAC,cAAAA,EACAC,YAAAA,IAIA,OAAAQ,EAAAA,KAAC,MAAA,CACGlB,IAAAA,EACAmB,UACC,KAAGP,EACJQ,KAAK,mBACL,eAAcnB,EACdC,UAAWmB,EAAAA,KACP,gBACA,0BACAnB,MAEAW,EACJF,UAhCqDI,IACvC,UAAdA,EAAMO,IACK,MAAAjB,GAAAA,EAAAU,GAAQd,GACE,MAAdc,EAAMO,MACbP,EAAMC,iBACK,MAAAX,GAAAA,EAAAU,GAAQd,IAEvB,MAAAU,GAAAA,EAAYI,EAAK,EA2BZZ,SAAA,CAAAC,GAASmB,EAAAA,IAAA,OAAA,CAAKrB,UAAU,sBAAuBC,SAAKC,IACpDmB,EAAAA,IAAA,MAAA,CAAIrB,UAAU,yBAA0BC,SAAAA,IACzCoB,EAAAA,IAAC,MAAI,CAAArB,UAAU,oBACXC,SAAAoB,EAAAA,IAAC,MAAI,CAAArB,UAAU,2BACXC,SAAAe,OAAC,MAAI,CAAAhB,UAAU,mCACXC,SAAA,CAACoB,EAAAA,IAAA,MAAA,CAAIrB,UAAU,mCACfqB,EAAAA,IAACC,EAAAA,UAAA,CACGC,QAAQ,QACRC,MAAI,EACJxB,UAAU,iDAI1B,IAKZL,EAAiB8B,YAAc"}

package/build/cjs/components/menu/index.d.cts

@@ -1,4 +1,4 @@
 export { Menu, type MenuProps } from './Menu.cjs';
 export { MenuItem, type MenuItemProps } from './MenuItem.cjs';
-export { MenuItemCheckbox, type MenuItemCheckboxProps } from './MenuItemCheckbox.cjs';
+export { MenuItemCheckbox, type MenuItemCheckboxProps, } from './MenuItemCheckbox.cjs';
 export { MenuDivider } from './MenuDivider.cjs';

package/build/cjs/components/message/DismissButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DismissButton.cjs","sources":["../../../../src/components/message/DismissButton.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, forwardRef } from \"react\";\nimport { CloseIcon } from \"../icon/index.js\";\n\nexport interface DismissButtonProps extends Exclude<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n    label?: string;\n}\n\nexport const DismissButton = forwardRef<HTMLButtonElement, DismissButtonProps>(({ label = \"Lukk\", ...rest }, ref) => {\n    return (\n        <button ref={ref} type=\"button\" title={label} {...rest}>\n            <CloseIcon variant=\"small\" bold />\n            <span className=\"jkl-sr-only\">{label}</span>\n        </button>\n    );\n});\n\nDismissButton.displayName = \"DismissButton\";\n"],"names":["DismissButton","forwardRef","label","rest","ref","jsxs","type","title","children","jsx","CloseIcon","variant","bold","className","displayName"],"mappings":"+lDAOa,MAAAA,EAAgBC,cAAkD,EAAGC,MAAAA,EAAQ,UAAWC,GAAQC,IAErGC,OAAC,UAAOD,IAAAA,EAAUE,KAAK,SAASC,MAAOL,KAAWC,EAC9CK,SAAA,CAAAC,EAAAA,IAACC,EAAUA,UAAA,CAAAC,QAAQ,QAAQC,MAAI,IAC9BH,EAAAA,IAAA,OAAA,CAAKI,UAAU,cAAeL,SAAMN,SAKjDF,EAAcc,YAAc"}
+{"version":3,"file":"DismissButton.cjs","sources":["../../../../src/components/message/DismissButton.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, forwardRef } from \"react\";\nimport { CloseIcon } from \"../icon/index.js\";\n\nexport interface DismissButtonProps\n    extends Exclude<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n    label?: string;\n}\n\nexport const DismissButton = forwardRef<HTMLButtonElement, DismissButtonProps>(\n    ({ label = \"Lukk\", ...rest }, ref) => {\n        return (\n            <button ref={ref} type=\"button\" title={label} {...rest}>\n                <CloseIcon variant=\"small\" bold />\n                <span className=\"jkl-sr-only\">{label}</span>\n            </button>\n        );\n    },\n);\n\nDismissButton.displayName = \"DismissButton\";\n"],"names":["DismissButton","forwardRef","label","rest","ref","jsxs","type","title","children","jsx","CloseIcon","variant","bold","className","displayName"],"mappings":"+lDAQO,MAAMA,EAAgBC,EAAAA,YACzB,EAAGC,MAAAA,EAAQ,UAAWC,GAAQC,IAEtBC,OAAC,UAAOD,IAAAA,EAAUE,KAAK,SAASC,MAAOL,KAAWC,EAC9CK,SAAA,CAAAC,EAAAA,IAACC,EAAUA,UAAA,CAAAC,QAAQ,QAAQC,MAAI,IAC9BH,EAAAA,IAAA,OAAA,CAAKI,UAAU,cAAeL,SAAMN,SAMrDF,EAAcc,YAAc"}

package/build/cjs/components/message/FormErrorMessage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormErrorMessage.cjs","sources":["../../../../src/components/message/FormErrorMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useRef } from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { MessageProps, ErrorMessage } from \"./Message.js\";\n\nexport interface FormErrorMessageProps {\n    className?: string;\n    id?: string;\n    /**\n     * @default { title: \"Feil og mangler i skjemaet\" }\n     */\n    messageProps?: Partial<MessageProps>;\n    errors: (string | undefined)[];\n    isSubmitted: boolean;\n    isValid: boolean;\n}\n\nconst defaultMessageProps = {\n    title: \"Feil og mangler i skjemaet\",\n};\n\nexport const FormErrorMessage = forwardRef<HTMLDivElement, FormErrorMessageProps>(\n    (props, forwardedRef): JSX.Element | null => {\n        const { className, errors, isSubmitted, isValid, messageProps, ...rest } = props;\n\n        const showSummary = isSubmitted && !isValid;\n\n        const [messageRef] = useAnimatedHeight<HTMLDivElement>(showSummary, { display: \"grid\" });\n\n        const previousErrors = useRef<Array<string | undefined>>(errors);\n        useEffect(() => {\n            previousErrors.current = errors;\n        }, [errors]);\n        const hasNewErrors = errors.length > previousErrors.current.length;\n\n        return (\n            <div ref={forwardedRef} className={clsx(\"jkl-form-error-message\", className)} {...rest}>\n                <ErrorMessage\n                    {...defaultMessageProps}\n                    {...messageProps}\n                    ref={messageRef}\n                    role={hasNewErrors ? \"alert\" : \"presentation\"} // Unngå å repetere hele oppsummeringen etter hvert som feilene rettes\n                >\n                    <ul className=\"jkl-list\">\n                        {errors\n                            .filter((error) => typeof error !== \"undefined\")\n                            .map((error) => (\n                                <li className=\"jkl-list__item\" key={error}>\n                                    {error}\n                                </li>\n                            ))}\n                    </ul>\n                </ErrorMessage>\n            </div>\n        );\n    },\n);\n\nFormErrorMessage.displayName = \"FormErrorMessage\";\n"],"names":["defaultMessageProps","title","FormErrorMessage","forwardRef","props","forwardedRef","className","errors","isSubmitted","isValid","messageProps","rest","showSummary","messageRef","useAnimatedHeight","display","previousErrors","useRef","useEffect","current","hasNewErrors","length","jsx","ref","clsx","children","ErrorMessage","role","filter","error","map","displayName"],"mappings":"4QAiBMA,EAAsB,CACxBC,MAAO,8BAGEC,EAAmBC,EAAAA,YAC5B,CAACC,EAAOC,KACE,MAAEC,UAAAA,EAAWC,OAAAA,EAAQC,YAAAA,EAAaC,QAAAA,EAASC,aAAAA,KAAiBC,GAASP,EAErEQ,EAAcJ,IAAgBC,GAE7BI,GAAcC,EAAAA,kBAAkCF,EAAa,CAAEG,QAAS,SAEzEC,EAAiBC,SAAkCV,GACzDW,EAAAA,WAAU,KACNF,EAAeG,QAAUZ,IAC1B,CAACA,IACJ,MAAMa,EAAeb,EAAOc,OAASL,EAAeG,QAAQE,OAGxD,OAAAC,EAAAA,IAAC,MAAI,CAAAC,IAAKlB,EAAcC,UAAWkB,OAAK,yBAA0BlB,MAAgBK,EAC9Ec,SAAAH,EAAAA,IAACI,EAAAA,aAAA,IACO1B,KACAU,EACJa,IAAKV,EACLc,KAAMP,EAAe,QAAU,eAE/BK,SAAAH,EAAAA,IAAC,MAAGhB,UAAU,WACTmB,WACIG,QAAQC,UAAiBA,EAAU,MACnCC,KAAKD,GACDP,EAAAA,IAAA,KAAA,CAAGhB,UAAU,iBACTmB,SAAAI,GAD+BA,UAMxD,IAKZ3B,EAAiB6B,YAAc"}
+{"version":3,"file":"FormErrorMessage.cjs","sources":["../../../../src/components/message/FormErrorMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useRef } from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { MessageProps, ErrorMessage } from \"./Message.js\";\n\nexport interface FormErrorMessageProps {\n    className?: string;\n    id?: string;\n    /**\n     * @default { title: \"Feil og mangler i skjemaet\" }\n     */\n    messageProps?: Partial<MessageProps>;\n    errors: (string | undefined)[];\n    isSubmitted: boolean;\n    isValid: boolean;\n}\n\nconst defaultMessageProps = {\n    title: \"Feil og mangler i skjemaet\",\n};\n\nexport const FormErrorMessage = forwardRef<\n    HTMLDivElement,\n    FormErrorMessageProps\n>((props, forwardedRef): JSX.Element | null => {\n    const { className, errors, isSubmitted, isValid, messageProps, ...rest } =\n        props;\n\n    const showSummary = isSubmitted && !isValid;\n\n    const [messageRef] = useAnimatedHeight<HTMLDivElement>(showSummary, {\n        display: \"grid\",\n    });\n\n    const previousErrors = useRef<Array<string | undefined>>(errors);\n    useEffect(() => {\n        previousErrors.current = errors;\n    }, [errors]);\n    const hasNewErrors = errors.length > previousErrors.current.length;\n\n    return (\n        <div\n            ref={forwardedRef}\n            className={clsx(\"jkl-form-error-message\", className)}\n            {...rest}\n        >\n            <ErrorMessage\n                {...defaultMessageProps}\n                {...messageProps}\n                ref={messageRef}\n                role={hasNewErrors ? \"alert\" : \"presentation\"} // Unngå å repetere hele oppsummeringen etter hvert som feilene rettes\n            >\n                <ul className=\"jkl-list\">\n                    {errors\n                        .filter((error) => typeof error !== \"undefined\")\n                        .map((error) => (\n                            <li className=\"jkl-list__item\" key={error}>\n                                {error}\n                            </li>\n                        ))}\n                </ul>\n            </ErrorMessage>\n        </div>\n    );\n});\n\nFormErrorMessage.displayName = \"FormErrorMessage\";\n"],"names":["defaultMessageProps","title","FormErrorMessage","forwardRef","props","forwardedRef","className","errors","isSubmitted","isValid","messageProps","rest","showSummary","messageRef","useAnimatedHeight","display","previousErrors","useRef","useEffect","current","hasNewErrors","length","jsx","ref","clsx","children","ErrorMessage","role","filter","error","map","displayName"],"mappings":"4QAiBMA,EAAsB,CACxBC,MAAO,8BAGEC,EAAmBC,EAAAA,YAG9B,CAACC,EAAOC,KACA,MAAEC,UAAAA,EAAWC,OAAAA,EAAQC,YAAAA,EAAaC,QAAAA,EAASC,aAAAA,KAAiBC,GAC9DP,EAEEQ,EAAcJ,IAAgBC,GAE7BI,GAAcC,EAAAA,kBAAkCF,EAAa,CAChEG,QAAS,SAGPC,EAAiBC,SAAkCV,GACzDW,EAAAA,WAAU,KACNF,EAAeG,QAAUZ,IAC1B,CAACA,IACJ,MAAMa,EAAeb,EAAOc,OAASL,EAAeG,QAAQE,OAGxD,OAAAC,EAAAA,IAAC,MAAA,CACGC,IAAKlB,EACLC,UAAWkB,EAAAA,KAAK,yBAA0BlB,MACtCK,EAEJc,SAAAH,EAAAA,IAACI,EAAAA,aAAA,IACO1B,KACAU,EACJa,IAAKV,EACLc,KAAMP,EAAe,QAAU,eAE/BK,SAAAH,EAAAA,IAAC,MAAGhB,UAAU,WACTmB,WACIG,QAAQC,UAAiBA,EAAU,MACnCC,KAAKD,GACDP,EAAAA,IAAA,KAAA,CAAGhB,UAAU,iBACTmB,SAAAI,GAD+BA,UAKpD,IAKZ3B,EAAiB6B,YAAc"}

package/build/cjs/components/message/Message.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Message.cjs","sources":["../../../../src/components/message/Message.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AriaRole, forwardRef } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ErrorIcon, InfoIcon, SuccessIcon, WarningIcon } from \"../icon/index.js\";\nimport { DismissButton } from \"./DismissButton.js\";\n\nexport interface MessageProps extends WithChildren {\n    id?: string;\n    title?: string;\n    fullWidth?: boolean;\n    density?: Density;\n    className?: string;\n    dismissed?: boolean;\n    dismissAction?: {\n        handleDismiss: () => void;\n        buttonTitle?: string;\n    };\n    role?: AriaRole;\n}\n\ntype messageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\nconst getIcon = (messageType: messageTypes) => {\n    switch (messageType) {\n        case \"error\":\n            return <ErrorIcon className=\"jkl-message__icon\" />;\n        case \"info\":\n            return <InfoIcon className=\"jkl-message__icon\" />;\n        case \"success\":\n            return <SuccessIcon className=\"jkl-message__icon\" />;\n        case \"warning\":\n            return <WarningIcon className=\"jkl-message__icon\" />;\n        default:\n            return null;\n    }\n};\n\nfunction messageFactory(messageType: messageTypes) {\n    const Message = forwardRef<HTMLDivElement, MessageProps>((props, ref) => {\n        const {\n            id,\n            title,\n            fullWidth,\n            density,\n            className = \"\",\n            dismissed,\n            dismissAction,\n            children,\n            role,\n            ...rest\n        } = props;\n\n        const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n        const hasStringChild = React.Children.map(children, (child) => typeof child === \"string\");\n        const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n        return (\n            <div\n                {...rest}\n                id={id}\n                ref={ref}\n                className={clsx(\"jkl-message\", \"jkl-message--\" + messageType, className, {\n                    \"jkl-message--full\": fullWidth,\n                    \"jkl-message--dismissed\": dismissed,\n                })}\n                role={role}\n                data-density={density}\n            >\n                {getIcon(messageType)}\n                <div className=\"jkl-message__content\" data-theme=\"light\">\n                    {title && <p className=\"jkl-message__title\">{title}</p>}\n                    <div className=\"jkl-message__message\">{newChildren}</div>\n                </div>\n                {dismissAction?.handleDismiss && (\n                    <DismissButton\n                        aria-controls={boxId}\n                        className=\"jkl-message__dismiss-button\"\n                        label={dismissAction.buttonTitle || \"Lukk\"}\n                        onClick={dismissAction.handleDismiss}\n                    />\n                )}\n            </div>\n        );\n    });\n\n    Message.displayName = \"Message\";\n\n    return Message;\n}\n\nexport const InfoMessage = messageFactory(\"info\");\nInfoMessage.displayName = \"InfoMessage\";\nexport const ErrorMessage = messageFactory(\"error\");\nErrorMessage.displayName = \"ErrorMessage\";\nexport const WarningMessage = messageFactory(\"warning\");\nWarningMessage.displayName = \"WarningMessage\";\nexport const SuccessMessage = messageFactory(\"success\");\nSuccessMessage.displayName = \"SuccessMessage\";\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","messageFactory","Message","forwardRef","props","ref","id","title","fullWidth","density","dismissed","dismissAction","children","role","rest","boxId","useId","generateSuffix","hasStringChild","React","Children","map","child","newChildren","jsxs","clsx","handleDismiss","DismissButton","label","buttonTitle","onClick","displayName","InfoMessage","ErrorMessage","WarningMessage","SuccessMessage"],"mappings":"yuDAuBMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACM,OAAAC,EAAAA,IAACC,EAAUA,UAAA,CAAAC,UAAU,sBAChC,IAAK,OACM,OAAAF,EAAAA,IAACG,EAASA,SAAA,CAAAD,UAAU,sBAC/B,IAAK,UACM,OAAAF,EAAAA,IAACI,EAAYA,YAAA,CAAAF,UAAU,sBAClC,IAAK,UACM,OAAAF,EAAAA,IAACK,EAAYA,YAAA,CAAAH,UAAU,sBAClC,QACW,OAAA,KACf,EAGJ,SAASI,EAAeP,GACpB,MAAMQ,EAAUC,EAAAA,YAAyC,CAACC,EAAOC,KACvD,MACFC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAZ,UAAAA,EAAY,GACZa,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,KAAAA,KACGC,GACHV,EAEEW,EAAQC,QAAMV,GAAM,cAAe,CAAEW,gBAAiBX,IAEtDY,EAAiBC,EAAMC,SAASC,IAAIT,GAAWU,GAA2B,iBAAVA,IAChEC,EAAc,MAAAL,GAAAA,EAAiB,GAAMvB,EAAAA,IAAA,IAAA,CAAGiB,SAAAA,IAAgBA,EAG1D,OAAAY,EAAAA,KAAC,MAAA,IACOV,EACJR,GAAAA,EACAD,IAAAA,EACAR,UAAW4B,EAAAA,KAAK,cAAe,gBAAkB/B,EAAaG,EAAW,CACrE,oBAAqBW,EACrB,yBAA0BE,IAE9BG,KAAAA,EACA,eAAcJ,EAEbG,SAAA,CAAAnB,EAAQC,GACR8B,EAAAA,KAAA,MAAA,CAAI3B,UAAU,uBAAuB,aAAW,QAC5Ce,SAAA,CAAAL,GAAUZ,EAAAA,IAAA,IAAA,CAAEE,UAAU,qBAAsBe,SAAML,IAClDZ,EAAAA,IAAA,MAAA,CAAIE,UAAU,uBAAwBe,SAAYW,QAEtD,MAAAZ,OAAAA,EAAAA,EAAee,gBACZ/B,EAAAA,IAACgC,EAAAA,cAAA,CACG,gBAAeZ,EACflB,UAAU,8BACV+B,MAAOjB,EAAckB,aAAe,OACpCC,QAASnB,EAAce,kBAC3B,IAMhB,OAAAxB,EAAQ6B,YAAc,UAEf7B,CACX,CAEa,MAAA8B,EAAc/B,EAAe,QAC1C+B,EAAYD,YAAc,cACb,MAAAE,EAAehC,EAAe,SAC3CgC,EAAaF,YAAc,eACd,MAAAG,EAAiBjC,EAAe,WAC7CiC,EAAeH,YAAc,iBAChB,MAAAI,EAAiBlC,EAAe,WAC7CkC,EAAeJ,YAAc"}
+{"version":3,"file":"Message.cjs","sources":["../../../../src/components/message/Message.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AriaRole, forwardRef } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport {\n    ErrorIcon,\n    InfoIcon,\n    SuccessIcon,\n    WarningIcon,\n} from \"../icon/index.js\";\nimport { DismissButton } from \"./DismissButton.js\";\n\nexport interface MessageProps extends WithChildren {\n    id?: string;\n    title?: string;\n    fullWidth?: boolean;\n    density?: Density;\n    className?: string;\n    dismissed?: boolean;\n    dismissAction?: {\n        handleDismiss: () => void;\n        buttonTitle?: string;\n    };\n    role?: AriaRole;\n}\n\ntype messageTypes = \"info\" | \"error\" | \"success\" | \"warning\";\n\nconst getIcon = (messageType: messageTypes) => {\n    switch (messageType) {\n        case \"error\":\n            return <ErrorIcon className=\"jkl-message__icon\" />;\n        case \"info\":\n            return <InfoIcon className=\"jkl-message__icon\" />;\n        case \"success\":\n            return <SuccessIcon className=\"jkl-message__icon\" />;\n        case \"warning\":\n            return <WarningIcon className=\"jkl-message__icon\" />;\n        default:\n            return null;\n    }\n};\n\nfunction messageFactory(messageType: messageTypes) {\n    const Message = forwardRef<HTMLDivElement, MessageProps>((props, ref) => {\n        const {\n            id,\n            title,\n            fullWidth,\n            density,\n            className = \"\",\n            dismissed,\n            dismissAction,\n            children,\n            role,\n            ...rest\n        } = props;\n\n        const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n        const hasStringChild = React.Children.map(\n            children,\n            (child) => typeof child === \"string\",\n        );\n        const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n        return (\n            <div\n                {...rest}\n                id={id}\n                ref={ref}\n                className={clsx(\n                    \"jkl-message\",\n                    \"jkl-message--\" + messageType,\n                    className,\n                    {\n                        \"jkl-message--full\": fullWidth,\n                        \"jkl-message--dismissed\": dismissed,\n                    },\n                )}\n                role={role}\n                data-density={density}\n            >\n                {getIcon(messageType)}\n                <div className=\"jkl-message__content\" data-theme=\"light\">\n                    {title && <p className=\"jkl-message__title\">{title}</p>}\n                    <div className=\"jkl-message__message\">{newChildren}</div>\n                </div>\n                {dismissAction?.handleDismiss && (\n                    <DismissButton\n                        aria-controls={boxId}\n                        className=\"jkl-message__dismiss-button\"\n                        label={dismissAction.buttonTitle || \"Lukk\"}\n                        onClick={dismissAction.handleDismiss}\n                    />\n                )}\n            </div>\n        );\n    });\n\n    Message.displayName = \"Message\";\n\n    return Message;\n}\n\nexport const InfoMessage = messageFactory(\"info\");\nInfoMessage.displayName = \"InfoMessage\";\nexport const ErrorMessage = messageFactory(\"error\");\nErrorMessage.displayName = \"ErrorMessage\";\nexport const WarningMessage = messageFactory(\"warning\");\nWarningMessage.displayName = \"WarningMessage\";\nexport const SuccessMessage = messageFactory(\"success\");\nSuccessMessage.displayName = \"SuccessMessage\";\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","messageFactory","Message","forwardRef","props","ref","id","title","fullWidth","density","dismissed","dismissAction","children","role","rest","boxId","useId","generateSuffix","hasStringChild","React","Children","map","child","newChildren","jsxs","clsx","handleDismiss","DismissButton","label","buttonTitle","onClick","displayName","InfoMessage","ErrorMessage","WarningMessage","SuccessMessage"],"mappings":"yuDA4BMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACM,OAAAC,EAAAA,IAACC,EAAUA,UAAA,CAAAC,UAAU,sBAChC,IAAK,OACM,OAAAF,EAAAA,IAACG,EAASA,SAAA,CAAAD,UAAU,sBAC/B,IAAK,UACM,OAAAF,EAAAA,IAACI,EAAYA,YAAA,CAAAF,UAAU,sBAClC,IAAK,UACM,OAAAF,EAAAA,IAACK,EAAYA,YAAA,CAAAH,UAAU,sBAClC,QACW,OAAA,KACf,EAGJ,SAASI,EAAeP,GACpB,MAAMQ,EAAUC,EAAAA,YAAyC,CAACC,EAAOC,KACvD,MACFC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAZ,UAAAA,EAAY,GACZa,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,KAAAA,KACGC,GACHV,EAEEW,EAAQC,QAAMV,GAAM,cAAe,CAAEW,gBAAiBX,IAEtDY,EAAiBC,EAAMC,SAASC,IAClCT,GACCU,GAA2B,iBAAVA,IAEhBC,EAAc,MAAAL,GAAAA,EAAiB,GAAMvB,EAAAA,IAAA,IAAA,CAAGiB,SAAAA,IAAgBA,EAG1D,OAAAY,EAAAA,KAAC,MAAA,IACOV,EACJR,GAAAA,EACAD,IAAAA,EACAR,UAAW4B,EAAAA,KACP,cACA,gBAAkB/B,EAClBG,EACA,CACI,oBAAqBW,EACrB,yBAA0BE,IAGlCG,KAAAA,EACA,eAAcJ,EAEbG,SAAA,CAAAnB,EAAQC,GACR8B,EAAAA,KAAA,MAAA,CAAI3B,UAAU,uBAAuB,aAAW,QAC5Ce,SAAA,CAAAL,GAAUZ,EAAAA,IAAA,IAAA,CAAEE,UAAU,qBAAsBe,SAAML,IAClDZ,EAAAA,IAAA,MAAA,CAAIE,UAAU,uBAAwBe,SAAYW,QAEtD,MAAAZ,OAAAA,EAAAA,EAAee,gBACZ/B,EAAAA,IAACgC,EAAAA,cAAA,CACG,gBAAeZ,EACflB,UAAU,8BACV+B,MAAOjB,EAAckB,aAAe,OACpCC,QAASnB,EAAce,kBAC3B,IAMhB,OAAAxB,EAAQ6B,YAAc,UAEf7B,CACX,CAEa,MAAA8B,EAAc/B,EAAe,QAC1C+B,EAAYD,YAAc,cACb,MAAAE,EAAehC,EAAe,SAC3CgC,EAAaF,YAAc,eACd,MAAAG,EAAiBjC,EAAe,WAC7CiC,EAAeH,YAAc,iBAChB,MAAAI,EAAiBlC,EAAe,WAC7CkC,EAAeJ,YAAc"}

package/build/cjs/components/message/index.d.cts

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

package/build/cjs/components/modal/Modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.cjs","sources":["../../../../src/components/modal/Modal.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { WithOptionalChildren } from \"../../core/types.js\";\nimport { CloseIcon } from \"../icon/index.js\";\nimport { IconButton, IconButtonProps } from \"../icon-button/IconButton.js\";\nimport { ModalConfig } from \"./useModal.js\";\n\nexport interface ModalProps extends WithOptionalChildren {\n    id?: string;\n    className?: string;\n    component?: React.ElementType;\n    style?: React.CSSProperties;\n    /**\n     * Overstyrer padding på modalen via en CSS-variabel.\n     */\n    padding?: 16 | 24 | 40;\n}\n\ntype BaseModalProps = Omit<ModalProps, \"padding\" | \"component\">;\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalContainer = forwardRef<HTMLDivElement, ModalConfig[\"container\"] & BaseModalProps>(\n    ({ className, ...rest }, ref) => {\n        // TODO: 'data-portal' fjernes når modalen tar i bruk Popover komponenten\n        return <div className={clsx(\"jkl-modal-container\", className)} {...rest} ref={ref} data-portal />;\n    },\n);\nModalContainer.displayName = \"ModalContainer\";\n\ntype ModalOverlayProps = ModalConfig[\"overlay\"] &\n    BaseModalProps & {\n        /**\n         * Rendre uten bakgrunnsfarge, men med click target for å lukke modalen ved klikk utenfor.\n         */\n        transparent?: boolean;\n    };\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalOverlay = forwardRef<HTMLDivElement, ModalOverlayProps>(\n    ({ className, transparent, ...rest }, ref) => (\n        <div\n            className={clsx(\"jkl-modal-overlay\", className, {\n                \"jkl-modal-overlay--transparent\": transparent,\n            })}\n            {...rest}\n            ref={ref}\n        />\n    ),\n);\nModalOverlay.displayName = \"ModalOverlay\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const Modal = forwardRef<HTMLElement, ModalConfig[\"modal\"] & ModalProps>(\n    ({ className, component, padding, style, ...rest }, ref) => {\n        const C = component || \"div\";\n        return (\n            <C\n                className={clsx(\"jkl jkl-modal\", className)}\n                style={\n                    {\n                        \"--jkl-modal-padding\": padding ? `var(--jkl-spacing-${padding})` : undefined,\n                        ...style,\n                    } as React.CSSProperties\n                }\n                {...rest}\n                ref={ref}\n            />\n        );\n    },\n);\nModal.displayName = \"Modal\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalHeader = forwardRef<HTMLDivElement, BaseModalProps>(({ className, ...rest }, ref) => (\n    <div className={clsx(\"jkl-modal-header\", className)} {...rest} ref={ref} />\n));\nModalHeader.displayName = \"ModalHeader\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalTitle = forwardRef<HTMLParagraphElement, ModalConfig[\"title\"] & BaseModalProps>(\n    ({ className, ...rest }, ref) => <p className={clsx(\"jkl-modal-title\", className)} {...rest} ref={ref} />,\n);\nModalTitle.displayName = \"ModalTitle\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalCloseButton = forwardRef<\n    HTMLButtonElement,\n    Omit<ModalConfig[\"closeButton\"], \"onClick\"> & BaseModalProps & IconButtonProps\n>(({ className, ...rest }, ref) => (\n    <IconButton className={clsx(\"jkl-modal-close\", className)} data-testautoid=\"jkl-modal-close\" {...rest} ref={ref}>\n        <CloseIcon variant=\"medium\" />\n    </IconButton>\n));\nModalCloseButton.displayName = \"ModalCloseButton\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalBody = forwardRef<HTMLDivElement, BaseModalProps>(({ className, ...rest }, ref) => (\n    <div className={clsx(\"jkl-modal-body\", className)} {...rest} ref={ref} />\n));\nModalBody.displayName = \"ModalBody\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalActions = forwardRef<HTMLDivElement, BaseModalProps>(({ className, ...rest }, ref) => (\n    <div className={clsx(\"jkl-modal-actions\", className)} {...rest} ref={ref} />\n));\nModalActions.displayName = \"ModalActions\";\n"],"names":["ModalContainer","forwardRef","className","rest","ref","jsx","clsx","displayName","ModalOverlay","transparent","Modal","component","padding","style","C","ModalHeader","ModalTitle","ModalCloseButton","IconButton","children","CloseIcon","variant","ModalBody","ModalActions"],"mappings":"wrDAuBaA,EAAiBC,EAAAA,YAC1B,EAAGC,UAAAA,KAAcC,GAAQC,IAEdC,EAAAA,IAAC,MAAI,CAAAH,UAAWI,EAAKA,KAAA,sBAAuBJ,MAAgBC,EAAMC,IAAAA,EAAU,eAAW,MAGtGJ,EAAeO,YAAc,iBAatB,MAAMC,EAAeP,EAAAA,YACxB,EAAGC,UAAAA,EAAWO,YAAAA,KAAgBN,GAAQC,IAClCC,EAAAA,IAAC,MAAA,CACGH,UAAWI,EAAAA,KAAK,oBAAqBJ,EAAW,CAC5C,iCAAkCO,OAElCN,EACJC,IAAAA,MAIZI,EAAaD,YAAc,eAKpB,MAAMG,EAAQT,EAAAA,YACjB,EAAGC,UAAAA,EAAWS,UAAAA,EAAWC,QAAAA,EAASC,MAAAA,KAAUV,GAAQC,KAChD,MAAMU,EAAIH,GAAa,MAEnB,OAAAN,EAAAA,IAACS,EAAA,CACGZ,UAAWI,EAAAA,KAAK,gBAAiBJ,GACjCW,MACI,CACI,sBAAuBD,EAAU,qBAAqBA,UAAa,KAChEC,MAGPV,EACJC,IAAAA,GAAA,IAKhBM,EAAMH,YAAc,QAKb,MAAMQ,EAAcd,EAA2CA,YAAA,EAAGC,UAAAA,KAAcC,GAAQC,UAC1F,MAAI,CAAAF,UAAWI,OAAK,mBAAoBJ,MAAgBC,EAAMC,IAAAA,MAEnEW,EAAYR,YAAc,cAKnB,MAAMS,EAAaf,EAAAA,YACtB,EAAGC,UAAAA,KAAcC,GAAQC,IAAQC,EAAAA,IAAC,IAAE,CAAAH,UAAWI,EAAAA,KAAK,kBAAmBJ,MAAgBC,EAAMC,IAAAA,MAEjGY,EAAWT,YAAc,aAKZ,MAAAU,EAAmBhB,EAG9BA,YAAA,EAAGC,UAAAA,KAAcC,GAAQC,IACtBC,EAAAA,IAAAa,EAAAA,WAAA,CAAWhB,UAAWI,EAAAA,KAAK,kBAAmBJ,GAAY,kBAAgB,qBAAsBC,EAAMC,IAAAA,EACnGe,SAAAd,MAACe,EAAAA,UAAU,CAAAC,QAAQ,eAG3BJ,EAAiBV,YAAc,mBAKxB,MAAMe,EAAYrB,EAA2CA,YAAA,EAAGC,UAAAA,KAAcC,GAAQC,UACxF,MAAI,CAAAF,UAAWI,OAAK,iBAAkBJ,MAAgBC,EAAMC,IAAAA,MAEjEkB,EAAUf,YAAc,YAKjB,MAAMgB,EAAetB,EAA2CA,YAAA,EAAGC,UAAAA,KAAcC,GAAQC,UAC3F,MAAI,CAAAF,UAAWI,OAAK,oBAAqBJ,MAAgBC,EAAMC,IAAAA,MAEpEmB,EAAahB,YAAc"}
+{"version":3,"file":"Modal.cjs","sources":["../../../../src/components/modal/Modal.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { WithOptionalChildren } from \"../../core/types.js\";\nimport { CloseIcon } from \"../icon/index.js\";\nimport { IconButton, IconButtonProps } from \"../icon-button/IconButton.js\";\nimport { ModalConfig } from \"./useModal.js\";\n\nexport interface ModalProps extends WithOptionalChildren {\n    id?: string;\n    className?: string;\n    component?: React.ElementType;\n    style?: React.CSSProperties;\n    /**\n     * Overstyrer padding på modalen via en CSS-variabel.\n     */\n    padding?: 16 | 24 | 40;\n}\n\ntype BaseModalProps = Omit<ModalProps, \"padding\" | \"component\">;\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalContainer = forwardRef<\n    HTMLDivElement,\n    ModalConfig[\"container\"] & BaseModalProps\n>(({ className, ...rest }, ref) => {\n    // TODO: 'data-portal' fjernes når modalen tar i bruk Popover komponenten\n    return (\n        <div\n            className={clsx(\"jkl-modal-container\", className)}\n            {...rest}\n            ref={ref}\n            data-portal\n        />\n    );\n});\nModalContainer.displayName = \"ModalContainer\";\n\ntype ModalOverlayProps = ModalConfig[\"overlay\"] &\n    BaseModalProps & {\n        /**\n         * Rendre uten bakgrunnsfarge, men med click target for å lukke modalen ved klikk utenfor.\n         */\n        transparent?: boolean;\n    };\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalOverlay = forwardRef<HTMLDivElement, ModalOverlayProps>(\n    ({ className, transparent, ...rest }, ref) => (\n        <div\n            className={clsx(\"jkl-modal-overlay\", className, {\n                \"jkl-modal-overlay--transparent\": transparent,\n            })}\n            {...rest}\n            ref={ref}\n        />\n    ),\n);\nModalOverlay.displayName = \"ModalOverlay\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const Modal = forwardRef<HTMLElement, ModalConfig[\"modal\"] & ModalProps>(\n    ({ className, component, padding, style, ...rest }, ref) => {\n        const C = component || \"div\";\n        return (\n            <C\n                className={clsx(\"jkl jkl-modal\", className)}\n                style={\n                    {\n                        \"--jkl-modal-padding\": padding\n                            ? `var(--jkl-spacing-${padding})`\n                            : undefined,\n                        ...style,\n                    } as React.CSSProperties\n                }\n                {...rest}\n                ref={ref}\n            />\n        );\n    },\n);\nModal.displayName = \"Modal\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalHeader = forwardRef<HTMLDivElement, BaseModalProps>(\n    ({ className, ...rest }, ref) => (\n        <div\n            className={clsx(\"jkl-modal-header\", className)}\n            {...rest}\n            ref={ref}\n        />\n    ),\n);\nModalHeader.displayName = \"ModalHeader\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalTitle = forwardRef<\n    HTMLParagraphElement,\n    ModalConfig[\"title\"] & BaseModalProps\n>(({ className, ...rest }, ref) => (\n    <p className={clsx(\"jkl-modal-title\", className)} {...rest} ref={ref} />\n));\nModalTitle.displayName = \"ModalTitle\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalCloseButton = forwardRef<\n    HTMLButtonElement,\n    Omit<ModalConfig[\"closeButton\"], \"onClick\"> &\n        BaseModalProps &\n        IconButtonProps\n>(({ className, ...rest }, ref) => (\n    <IconButton\n        className={clsx(\"jkl-modal-close\", className)}\n        data-testautoid=\"jkl-modal-close\"\n        {...rest}\n        ref={ref}\n    >\n        <CloseIcon variant=\"medium\" />\n    </IconButton>\n));\nModalCloseButton.displayName = \"ModalCloseButton\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalBody = forwardRef<HTMLDivElement, BaseModalProps>(\n    ({ className, ...rest }, ref) => (\n        <div\n            className={clsx(\"jkl-modal-body\", className)}\n            {...rest}\n            ref={ref}\n        />\n    ),\n);\nModalBody.displayName = \"ModalBody\";\n\n/**\n * Ment å brukes med `useModal`.\n */\nexport const ModalActions = forwardRef<HTMLDivElement, BaseModalProps>(\n    ({ className, ...rest }, ref) => (\n        <div\n            className={clsx(\"jkl-modal-actions\", className)}\n            {...rest}\n            ref={ref}\n        />\n    ),\n);\nModalActions.displayName = \"ModalActions\";\n"],"names":["ModalContainer","forwardRef","className","rest","ref","jsx","clsx","displayName","ModalOverlay","transparent","Modal","component","padding","style","C","ModalHeader","ModalTitle","ModalCloseButton","IconButton","children","CloseIcon","variant","ModalBody","ModalActions"],"mappings":"wrDAuBaA,EAAiBC,cAG5B,EAAGC,UAAAA,KAAcC,GAAQC,IAGnBC,EAAAA,IAAC,MAAA,CACGH,UAAWI,EAAAA,KAAK,sBAAuBJ,MACnCC,EACJC,IAAAA,EACA,eAAW,MAIvBJ,EAAeO,YAAc,iBAatB,MAAMC,EAAeP,EAAAA,YACxB,EAAGC,UAAAA,EAAWO,YAAAA,KAAgBN,GAAQC,IAClCC,EAAAA,IAAC,MAAA,CACGH,UAAWI,EAAAA,KAAK,oBAAqBJ,EAAW,CAC5C,iCAAkCO,OAElCN,EACJC,IAAAA,MAIZI,EAAaD,YAAc,eAKpB,MAAMG,EAAQT,EAAAA,YACjB,EAAGC,UAAAA,EAAWS,UAAAA,EAAWC,QAAAA,EAASC,MAAAA,KAAUV,GAAQC,KAChD,MAAMU,EAAIH,GAAa,MAEnB,OAAAN,EAAAA,IAACS,EAAA,CACGZ,UAAWI,EAAAA,KAAK,gBAAiBJ,GACjCW,MACI,CACI,sBAAuBD,EACjB,qBAAqBA,UACrB,KACHC,MAGPV,EACJC,IAAAA,GAAA,IAKhBM,EAAMH,YAAc,QAKb,MAAMQ,EAAcd,EAAAA,YACvB,EAAGC,UAAAA,KAAcC,GAAQC,IACrBC,EAAAA,IAAC,MAAA,CACGH,UAAWI,EAAAA,KAAK,mBAAoBJ,MAChCC,EACJC,IAAAA,MAIZW,EAAYR,YAAc,cAKnB,MAAMS,EAAaf,EAGxBA,YAAA,EAAGC,UAAAA,KAAcC,GAAQC,UACtB,IAAE,CAAAF,UAAWI,OAAK,kBAAmBJ,MAAgBC,EAAMC,IAAAA,MAEhEY,EAAWT,YAAc,aAKZ,MAAAU,EAAmBhB,cAK9B,EAAGC,UAAAA,KAAcC,GAAQC,IACvBC,EAAAA,IAACa,EAAAA,WAAA,CACGhB,UAAWI,EAAAA,KAAK,kBAAmBJ,GACnC,kBAAgB,qBACZC,EACJC,IAAAA,EAEAe,SAAAd,EAAAA,IAACe,EAAAA,UAAU,CAAAC,QAAQ,eAG3BJ,EAAiBV,YAAc,mBAKxB,MAAMe,EAAYrB,EAAAA,YACrB,EAAGC,UAAAA,KAAcC,GAAQC,IACrBC,EAAAA,IAAC,MAAA,CACGH,UAAWI,EAAAA,KAAK,iBAAkBJ,MAC9BC,EACJC,IAAAA,MAIZkB,EAAUf,YAAc,YAKjB,MAAMgB,EAAetB,EAAAA,YACxB,EAAGC,UAAAA,KAAcC,GAAQC,IACrBC,EAAAA,IAAC,MAAA,CACGH,UAAWI,EAAAA,KAAK,oBAAqBJ,MACjCC,EACJC,IAAAA,MAIZmB,EAAahB,YAAc"}

package/build/cjs/components/modal/index.d.cts

@@ -1,4 +1,4 @@
 export type { ModalProps } from './Modal.cjs';
 export { ModalContainer, ModalOverlay, Modal, ModalHeader, ModalTitle, ModalCloseButton, ModalBody, ModalActions, } from './Modal.cjs';
-export type { UseModalOptions, ModalInstance, ModalConfig } from './useModal.cjs';
+export type { UseModalOptions, ModalInstance, ModalConfig, } from './useModal.cjs';
 export { useModal } from './useModal.cjs';

package/build/cjs/components/modal/useModal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useModal.cjs","sources":["../../../../src/components/modal/useModal.ts"],"sourcesContent":["import { A11yDialogConfig, A11yDialogProps, useA11yDialog } from \"react-a11y-dialog\";\nimport { useId } from \"../../hooks/useId/useId.js\";\n\nexport interface UseModalOptions extends Omit<A11yDialogProps, \"id\" | \"closeButtonPosition\"> {\n    id?: string;\n    /**\n     * @default \"Lukk\"\n     */\n    closeButtonLabel?: string;\n    /**\n     * Sett til `alertdialog` om du ønsker å slå av muligheten til å lukke med ESC og klikk utenfor.\n     *\n     * @default \"dialog\"\n     */\n    role?: \"dialog\" | \"alertdialog\";\n    /**\n     * Påkrevd for universell utforming. Tittelen kan gjenbrukes som `children` i `<ModalTitle>` med en konstant.\n     */\n    title: string;\n}\n\nexport type ModalInstance = ReturnType<typeof useModal>[0];\n\nexport interface ModalConfig extends Omit<A11yDialogConfig, \"dialog\"> {\n    modal: A11yDialogConfig[\"dialog\"];\n    closeButton: A11yDialogConfig[\"closeButton\"] & {\n        \"aria-label\": string;\n    };\n}\n\n/**\n * @example\n * ```jsx\n * const heading = \"Bekreft sletting\";\n * const [instance, { title, overlay, container, modal, closeButton }] = useModal({ title: heading });\n *\n * useEffect(() => {\n *      if (!instance) {\n *          return;\n *      }\n *      instance.show();\n *  }, [instance]);\n *\n * return ReactDOM.createPortal(\n *      <ModalContainer {...container}>\n *          <ModalOverlay {...overlay} />\n *          <Modal {...modal}>\n *              <ModalHeader>\n *                  <ModalTitle {...title}>{heading}</ModalTitle>\n *                  <ModalCloseButton {...closeButton} />\n *              </ModalHeader>\n *              <ModalBody>\n *                  Er du sikker på at du vil slette Foo Bar Baz?\n *              </ModalBody>\n *              <ModalActions>\n *                  <PrimaryButton\n *                      onClick={() => {\n *                          // Do the thing\n *                          instance?.hide()\n *                      }}\n *                  >\n *                      Bekreft\n *                  </PrimaryButton>\n *                  <TertiaryButton onClick={() => instance?.hide()}>\n *                     Avbryt\n *                 </TertiaryButton>\n *              </ModalActions>\n *          </Modal>\n *      </ModalContainer>,\n *      document.body,\n *  );\n * ```\n */\nexport function useModal(props: UseModalOptions) {\n    const { id: idProp, role = \"dialog\", closeButtonLabel = \"Lukk\", ...rest } = props;\n\n    const id = useId(idProp || \"jkl-modal\", { generateSuffix: !idProp });\n\n    const [instance, config] = useA11yDialog({\n        id,\n        role,\n        ...rest,\n    });\n\n    const { dialog, ...restConfig } = config;\n\n    const modalConfig: ModalConfig = {\n        modal: config.dialog,\n        ...restConfig,\n        closeButton: {\n            ...config.closeButton,\n            \"aria-label\": closeButtonLabel,\n        },\n    };\n\n    return [instance, modalConfig] as const;\n}\n"],"names":["props","id","idProp","role","closeButtonLabel","rest","useId","generateSuffix","instance","config","useA11yDialog","dialog","restConfig","modal","closeButton"],"mappings":"+KAyEO,SAAkBA,GACf,MAAEC,GAAIC,EAAQC,KAAAA,EAAO,SAAUC,iBAAAA,EAAmB,UAAWC,GAASL,EAEtEC,EAAKK,QAAMJ,GAAU,YAAa,CAAEK,gBAAiBL,KAEpDM,EAAUC,GAAUC,gBAAc,CACrCT,GAAAA,EACAE,KAAAA,KACGE,KAGCM,OAAAA,KAAWC,GAAeH,EAW3B,MAAA,CAACD,EATyB,CAC7BK,MAAOJ,EAAOE,UACXC,EACHE,YAAa,IACNL,EAAOK,YACV,aAAcV,IAK1B"}
+{"version":3,"file":"useModal.cjs","sources":["../../../../src/components/modal/useModal.ts"],"sourcesContent":["import {\n    A11yDialogConfig,\n    A11yDialogProps,\n    useA11yDialog,\n} from \"react-a11y-dialog\";\nimport { useId } from \"../../hooks/useId/useId.js\";\n\nexport interface UseModalOptions\n    extends Omit<A11yDialogProps, \"id\" | \"closeButtonPosition\"> {\n    id?: string;\n    /**\n     * @default \"Lukk\"\n     */\n    closeButtonLabel?: string;\n    /**\n     * Sett til `alertdialog` om du ønsker å slå av muligheten til å lukke med ESC og klikk utenfor.\n     *\n     * @default \"dialog\"\n     */\n    role?: \"dialog\" | \"alertdialog\";\n    /**\n     * Påkrevd for universell utforming. Tittelen kan gjenbrukes som `children` i `<ModalTitle>` med en konstant.\n     */\n    title: string;\n}\n\nexport type ModalInstance = ReturnType<typeof useModal>[0];\n\nexport interface ModalConfig extends Omit<A11yDialogConfig, \"dialog\"> {\n    modal: A11yDialogConfig[\"dialog\"];\n    closeButton: A11yDialogConfig[\"closeButton\"] & {\n        \"aria-label\": string;\n    };\n}\n\n/**\n * @example\n * ```jsx\n * const heading = \"Bekreft sletting\";\n * const [instance, { title, overlay, container, modal, closeButton }] = useModal({ title: heading });\n *\n * useEffect(() => {\n *      if (!instance) {\n *          return;\n *      }\n *      instance.show();\n *  }, [instance]);\n *\n * return ReactDOM.createPortal(\n *      <ModalContainer {...container}>\n *          <ModalOverlay {...overlay} />\n *          <Modal {...modal}>\n *              <ModalHeader>\n *                  <ModalTitle {...title}>{heading}</ModalTitle>\n *                  <ModalCloseButton {...closeButton} />\n *              </ModalHeader>\n *              <ModalBody>\n *                  Er du sikker på at du vil slette Foo Bar Baz?\n *              </ModalBody>\n *              <ModalActions>\n *                  <PrimaryButton\n *                      onClick={() => {\n *                          // Do the thing\n *                          instance?.hide()\n *                      }}\n *                  >\n *                      Bekreft\n *                  </PrimaryButton>\n *                  <TertiaryButton onClick={() => instance?.hide()}>\n *                     Avbryt\n *                 </TertiaryButton>\n *              </ModalActions>\n *          </Modal>\n *      </ModalContainer>,\n *      document.body,\n *  );\n * ```\n */\nexport function useModal(props: UseModalOptions) {\n    const {\n        id: idProp,\n        role = \"dialog\",\n        closeButtonLabel = \"Lukk\",\n        ...rest\n    } = props;\n\n    const id = useId(idProp || \"jkl-modal\", { generateSuffix: !idProp });\n\n    const [instance, config] = useA11yDialog({\n        id,\n        role,\n        ...rest,\n    });\n\n    const { dialog, ...restConfig } = config;\n\n    const modalConfig: ModalConfig = {\n        modal: config.dialog,\n        ...restConfig,\n        closeButton: {\n            ...config.closeButton,\n            \"aria-label\": closeButtonLabel,\n        },\n    };\n\n    return [instance, modalConfig] as const;\n}\n"],"names":["props","id","idProp","role","closeButtonLabel","rest","useId","generateSuffix","instance","config","useA11yDialog","dialog","restConfig","modal","closeButton"],"mappings":"+KA8EO,SAAkBA,GACf,MACFC,GAAIC,EACJC,KAAAA,EAAO,SACPC,iBAAAA,EAAmB,UAChBC,GACHL,EAEEC,EAAKK,QAAMJ,GAAU,YAAa,CAAEK,gBAAiBL,KAEpDM,EAAUC,GAAUC,gBAAc,CACrCT,GAAAA,EACAE,KAAAA,KACGE,KAGCM,OAAAA,KAAWC,GAAeH,EAW3B,MAAA,CAACD,EATyB,CAC7BK,MAAOJ,EAAOE,UACXC,EACHE,YAAa,IACNL,EAAOK,YACV,aAAcV,IAK1B"}

package/build/cjs/components/pagination/Pagination.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.cjs","sources":["../../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport { PolymorphicPropsWithRef, PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"../icon/index.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { PageButton } from \"./PageButton.js\";\n\nexport type PaginationProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<\n    ElementType,\n    {\n        currentPage: number;\n        numberOfPages: number;\n        onPageChange: (toPage: number, fromPage: number) => void;\n        /**\n         * Dersom du ønsker å ha custom labels kan du sende inn disse. \"next\" og \"previous\"\n         * brukes som hint til skjermlesere for ikon-knappene til Neste/Forrige side\n         * @default { previous: \"Forrige side\", next: \"Neste side\" }\n         */\n        labels?: {\n            previous: string;\n            next: string;\n        };\n    }\n>;\n\nexport type PaginationComponent = <ElementType extends React.ElementType = \"nav\">(\n    props: PaginationProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const Pagination = React.forwardRef(function Pagination<ElementType extends React.ElementType = \"nav\">(\n    {\n        onPageChange,\n        currentPage,\n        numberOfPages,\n        labels = {\n            previous: \"Forrige side\",\n            next: \"Neste side\",\n        },\n        as,\n        ...rest\n    }: PaginationProps<ElementType>,\n    ref?: PolymorphicRef<ElementType>,\n) {\n    useEffect(() => {\n        if (currentPage < 1) {\n            console.error(\"[Pagination]: currentPage prop should be set to a value larger than 0\");\n        }\n        if (currentPage > numberOfPages) {\n            console.error(\"[Pagination]: currentPage prop should not be set to a value larger than numberOfPages\");\n        }\n    }, [currentPage, numberOfPages]);\n\n    const Component = as || \"nav\";\n\n    if (numberOfPages <= 7) {\n        return (\n            <Component ref={ref} {...rest} className=\"jkl-pagination\">\n                <IconButton\n                    className=\"jkl-pagination-button\"\n                    title={labels.previous}\n                    onClick={() => onPageChange(currentPage - 1, currentPage)}\n                    aria-disabled={currentPage === 1}\n                    tabIndex={currentPage === 1 ? -1 : 0}\n                >\n                    <ChevronLeftIcon />\n                </IconButton>\n                <ol className=\"jkl-pagination__pages\">\n                    {Array.from({ length: numberOfPages }).map((_, index) => {\n                        const page = index + 1;\n                        return (\n                            <PageButton\n                                key={index}\n                                isActive={currentPage === page}\n                                number={page}\n                                total={numberOfPages}\n                                onClick={() => onPageChange(page, currentPage)}\n                            />\n                        );\n                    })}\n                </ol>\n                <IconButton\n                    className=\"jkl-pagination-button\"\n                    title={labels.next}\n                    onClick={() => onPageChange(currentPage + 1, currentPage)}\n                    aria-disabled={currentPage === numberOfPages}\n                    tabIndex={currentPage === numberOfPages ? -1 : 0}\n                >\n                    <ChevronRightIcon />\n                </IconButton>\n            </Component>\n        );\n    }\n\n    const showStartEllipsis = currentPage > 4;\n    const showEndEllipsis = currentPage < numberOfPages - 3;\n\n    const startEllipsis = Math.min(Math.max(currentPage - 2, 2), numberOfPages - 5);\n    const centerPageNumberStart = Math.min(startEllipsis + 1, numberOfPages - 4);\n    const centerPageNumber = Math.min(centerPageNumberStart + 1, numberOfPages - 3);\n    const centerPageNumberEnd = Math.min(centerPageNumberStart + 2, numberOfPages - 2);\n    const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 1);\n\n    return (\n        <Component ref={ref} {...rest} className=\"jkl-pagination\">\n            <IconButton\n                className=\"jkl-pagination-button\"\n                title={labels.previous}\n                onClick={() => onPageChange(currentPage - 1, currentPage)}\n                aria-disabled={currentPage === 1}\n                tabIndex={currentPage === 1 ? -1 : 0}\n            >\n                <ChevronLeftIcon />\n            </IconButton>\n            <ol className=\"jkl-pagination__pages\">\n                <PageButton\n                    isActive={currentPage === 1}\n                    number={1}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(1, currentPage)}\n                />\n                {showStartEllipsis ? (\n                    <span aria-hidden className=\"jkl-pagination-button--elipsis\">\n                        {\"...\"}\n                    </span>\n                ) : (\n                    <PageButton\n                        isActive={currentPage === startEllipsis}\n                        number={startEllipsis}\n                        total={numberOfPages}\n                        onClick={() => onPageChange(startEllipsis, currentPage)}\n                    />\n                )}\n                <PageButton\n                    isActive={currentPage === centerPageNumberStart}\n                    number={centerPageNumberStart}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(centerPageNumberStart, currentPage)}\n                />\n                <PageButton\n                    isActive={currentPage === centerPageNumber}\n                    number={centerPageNumber}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(centerPageNumber, currentPage)}\n                />\n                <PageButton\n                    isActive={currentPage === centerPageNumberEnd}\n                    number={centerPageNumberEnd}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(centerPageNumberEnd, currentPage)}\n                />\n                {showEndEllipsis ? (\n                    <span aria-hidden className=\"jkl-pagination-button--elipsis\">\n                        {\"...\"}\n                    </span>\n                ) : (\n                    <PageButton\n                        isActive={currentPage === endEllipsis}\n                        number={endEllipsis}\n                        total={numberOfPages}\n                        onClick={() => onPageChange(endEllipsis, currentPage)}\n                    />\n                )}\n                <PageButton\n                    isActive={currentPage === numberOfPages}\n                    number={numberOfPages}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(numberOfPages, currentPage)}\n                />\n            </ol>\n            <IconButton\n                className=\"jkl-pagination-button\"\n                title={labels.next}\n                onClick={() => onPageChange(currentPage + 1, currentPage)}\n                aria-disabled={currentPage === numberOfPages}\n                tabIndex={currentPage === numberOfPages ? -1 : 0}\n            >\n                <ChevronRightIcon />\n            </IconButton>\n        </Component>\n    );\n}) as PaginationComponent;\n"],"names":["Pagination","React","forwardRef","onPageChange","currentPage","numberOfPages","labels","previous","next","as","rest","ref","useEffect","console","error","Component","className","children","jsx","IconButton","title","onClick","tabIndex","ChevronLeftIcon","from","length","map","_","index","page","PageButton","isActive","number","total","ChevronRightIcon","showStartEllipsis","showEndEllipsis","startEllipsis","Math","min","max","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","jsxs"],"mappings":"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"}
+{"version":3,"file":"Pagination.cjs","sources":["../../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport {\n    PolymorphicPropsWithRef,\n    PolymorphicRef,\n} from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"../icon/index.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { PageButton } from \"./PageButton.js\";\n\nexport type PaginationProps<ElementType extends React.ElementType> =\n    PolymorphicPropsWithRef<\n        ElementType,\n        {\n            currentPage: number;\n            numberOfPages: number;\n            onPageChange: (toPage: number, fromPage: number) => void;\n            /**\n             * Dersom du ønsker å ha custom labels kan du sende inn disse. \"next\" og \"previous\"\n             * brukes som hint til skjermlesere for ikon-knappene til Neste/Forrige side\n             * @default { previous: \"Forrige side\", next: \"Neste side\" }\n             */\n            labels?: {\n                previous: string;\n                next: string;\n            };\n        }\n    >;\n\nexport type PaginationComponent = <\n    ElementType extends React.ElementType = \"nav\",\n>(\n    props: PaginationProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const Pagination = React.forwardRef(function Pagination<\n    ElementType extends React.ElementType = \"nav\",\n>(\n    {\n        onPageChange,\n        currentPage,\n        numberOfPages,\n        labels = {\n            previous: \"Forrige side\",\n            next: \"Neste side\",\n        },\n        as,\n        ...rest\n    }: PaginationProps<ElementType>,\n    ref?: PolymorphicRef<ElementType>,\n) {\n    useEffect(() => {\n        if (currentPage < 1) {\n            console.error(\n                \"[Pagination]: currentPage prop should be set to a value larger than 0\",\n            );\n        }\n        if (currentPage > numberOfPages) {\n            console.error(\n                \"[Pagination]: currentPage prop should not be set to a value larger than numberOfPages\",\n            );\n        }\n    }, [currentPage, numberOfPages]);\n\n    const Component = as || \"nav\";\n\n    if (numberOfPages <= 7) {\n        return (\n            <Component ref={ref} {...rest} className=\"jkl-pagination\">\n                <IconButton\n                    className=\"jkl-pagination-button\"\n                    title={labels.previous}\n                    onClick={() => onPageChange(currentPage - 1, currentPage)}\n                    aria-disabled={currentPage === 1}\n                    tabIndex={currentPage === 1 ? -1 : 0}\n                >\n                    <ChevronLeftIcon />\n                </IconButton>\n                <ol className=\"jkl-pagination__pages\">\n                    {Array.from({ length: numberOfPages }).map((_, index) => {\n                        const page = index + 1;\n                        return (\n                            <PageButton\n                                key={index}\n                                isActive={currentPage === page}\n                                number={page}\n                                total={numberOfPages}\n                                onClick={() => onPageChange(page, currentPage)}\n                            />\n                        );\n                    })}\n                </ol>\n                <IconButton\n                    className=\"jkl-pagination-button\"\n                    title={labels.next}\n                    onClick={() => onPageChange(currentPage + 1, currentPage)}\n                    aria-disabled={currentPage === numberOfPages}\n                    tabIndex={currentPage === numberOfPages ? -1 : 0}\n                >\n                    <ChevronRightIcon />\n                </IconButton>\n            </Component>\n        );\n    }\n\n    const showStartEllipsis = currentPage > 4;\n    const showEndEllipsis = currentPage < numberOfPages - 3;\n\n    const startEllipsis = Math.min(\n        Math.max(currentPage - 2, 2),\n        numberOfPages - 5,\n    );\n    const centerPageNumberStart = Math.min(\n        startEllipsis + 1,\n        numberOfPages - 4,\n    );\n    const centerPageNumber = Math.min(\n        centerPageNumberStart + 1,\n        numberOfPages - 3,\n    );\n    const centerPageNumberEnd = Math.min(\n        centerPageNumberStart + 2,\n        numberOfPages - 2,\n    );\n    const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 1);\n\n    return (\n        <Component ref={ref} {...rest} className=\"jkl-pagination\">\n            <IconButton\n                className=\"jkl-pagination-button\"\n                title={labels.previous}\n                onClick={() => onPageChange(currentPage - 1, currentPage)}\n                aria-disabled={currentPage === 1}\n                tabIndex={currentPage === 1 ? -1 : 0}\n            >\n                <ChevronLeftIcon />\n            </IconButton>\n            <ol className=\"jkl-pagination__pages\">\n                <PageButton\n                    isActive={currentPage === 1}\n                    number={1}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(1, currentPage)}\n                />\n                {showStartEllipsis ? (\n                    <span\n                        aria-hidden\n                        className=\"jkl-pagination-button--elipsis\"\n                    >\n                        {\"...\"}\n                    </span>\n                ) : (\n                    <PageButton\n                        isActive={currentPage === startEllipsis}\n                        number={startEllipsis}\n                        total={numberOfPages}\n                        onClick={() => onPageChange(startEllipsis, currentPage)}\n                    />\n                )}\n                <PageButton\n                    isActive={currentPage === centerPageNumberStart}\n                    number={centerPageNumberStart}\n                    total={numberOfPages}\n                    onClick={() =>\n                        onPageChange(centerPageNumberStart, currentPage)\n                    }\n                />\n                <PageButton\n                    isActive={currentPage === centerPageNumber}\n                    number={centerPageNumber}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(centerPageNumber, currentPage)}\n                />\n                <PageButton\n                    isActive={currentPage === centerPageNumberEnd}\n                    number={centerPageNumberEnd}\n                    total={numberOfPages}\n                    onClick={() =>\n                        onPageChange(centerPageNumberEnd, currentPage)\n                    }\n                />\n                {showEndEllipsis ? (\n                    <span\n                        aria-hidden\n                        className=\"jkl-pagination-button--elipsis\"\n                    >\n                        {\"...\"}\n                    </span>\n                ) : (\n                    <PageButton\n                        isActive={currentPage === endEllipsis}\n                        number={endEllipsis}\n                        total={numberOfPages}\n                        onClick={() => onPageChange(endEllipsis, currentPage)}\n                    />\n                )}\n                <PageButton\n                    isActive={currentPage === numberOfPages}\n                    number={numberOfPages}\n                    total={numberOfPages}\n                    onClick={() => onPageChange(numberOfPages, currentPage)}\n                />\n            </ol>\n            <IconButton\n                className=\"jkl-pagination-button\"\n                title={labels.next}\n                onClick={() => onPageChange(currentPage + 1, currentPage)}\n                aria-disabled={currentPage === numberOfPages}\n                tabIndex={currentPage === numberOfPages ? -1 : 0}\n            >\n                <ChevronRightIcon />\n            </IconButton>\n        </Component>\n    );\n}) as PaginationComponent;\n"],"names":["Pagination","React","forwardRef","onPageChange","currentPage","numberOfPages","labels","previous","next","as","rest","ref","useEffect","console","error","Component","className","children","jsx","IconButton","title","onClick","tabIndex","ChevronLeftIcon","from","length","map","_","index","page","PageButton","isActive","number","total","ChevronRightIcon","showStartEllipsis","showEndEllipsis","startEllipsis","Math","min","max","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","jsxs"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"Popover.cjs","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 \"../../utilities/getThemeAndDensity.js\";\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\nexport const 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        const floatingPortalRef = React.useRef<HTMLElement | null>(null);\n\n        // TODO: Løser et problem hvor nestede portaler ikke \"fester\" seg til det nærmeste portal-elementet. Fjernes når alle komponenter som rendres i en portal tar i bruk popover komponenten da den håndterer dette internt.\n        React.useEffect(() => {\n            floatingPortalRef.current = context.elements.domReference?.closest<HTMLElement>(\"[data-portal]\") || null;\n        }, [context.elements.domReference]);\n\n        if (!open) return null;\n\n        return (\n            <FloatingPortal root={floatingPortalRef.current}>\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","floatingPortalRef","useRef","useEffect","_a","elements","domReference","closest","FloatingPortal","root","FloatingFocusManager","clsx","Trigger","Content"],"mappings":"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"}
+{"version":3,"file":"Popover.cjs","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 \"../../utilities/getThemeAndDensity.js\";\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(\n            \"Popover komponenter må brukes innenfor en <Popover /> komponent\",\n        );\n    }\n\n    return context;\n};\n\nexport const Popover = ({\n    children,\n    ...restOptions\n}: {\n    children: React.ReactNode;\n} & PopoverOptions) => {\n    const popover = usePopover({ ...restOptions });\n    return (\n        <PopoverContext.Provider value={popover}>\n            {children}\n        </PopoverContext.Provider>\n    );\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<\n    HTMLElement,\n    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\n            ref={ref}\n            onClick={() => onOpenChange?.(!open)}\n            aria-expanded={open}\n            {...getReferenceProps(props)}\n        >\n            {children}\n        </button>\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 = (\n    referenceElement: ReferenceElement,\n): referenceElement is VirtualElement => {\n    if (!referenceElement) return false;\n\n    return \"contextElement\" in referenceElement;\n};\n\nconst PopoverContent = React.forwardRef<\n    HTMLDivElement,\n    React.HTMLProps<HTMLDivElement> & PopoverContentProps\n>(function PopoverContent(\n    {\n        style,\n        className,\n        padding = 0,\n        initialFocus = 0,\n        returnFocus = true,\n        ...props\n    },\n    propRef,\n) {\n    const { context, modal, refs, open, floatingStyles, getFloatingProps } =\n        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    const floatingPortalRef = React.useRef<HTMLElement | null>(null);\n\n    // TODO: Løser et problem hvor nestede portaler ikke \"fester\" seg til det nærmeste portal-elementet. Fjernes når alle komponenter som rendres i en portal tar i bruk popover komponenten da den håndterer dette internt.\n    React.useEffect(() => {\n        floatingPortalRef.current =\n            context.elements.domReference?.closest<HTMLElement>(\n                \"[data-portal]\",\n            ) || null;\n    }, [context.elements.domReference]);\n\n    if (!open) return null;\n\n    return (\n        <FloatingPortal root={floatingPortalRef.current}>\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\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","floatingPortalRef","useRef","useEffect","_a","elements","domReference","closest","FloatingPortal","root","FloatingFocusManager","clsx","Trigger","Content"],"mappings":"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"}

package/build/cjs/components/progress-bar/Countdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Countdown.cjs","sources":["../../../../src/components/progress-bar/Countdown.tsx"],"sourcesContent":["import React, { useState, type CSSProperties, type FC, useEffect } from \"react\";\n\nexport interface CountdownProps\n    extends Pick<React.HTMLAttributes<HTMLDivElement>, \"onAnimationEnd\" | \"onAnimationStart\"> {\n    id?: string;\n    className?: string;\n    /**\n     * Millisekunder å telle ned fra\n     */\n    from: number;\n    isPaused?: boolean;\n    style?: CSSProperties;\n}\n\nexport const Countdown: FC<CountdownProps> = ({ className, from, isPaused, ...rest }) => {\n    const [remainingSeconds, setRemainingSeconds] = useState(Math.floor(from / 1000));\n\n    useEffect(() => {\n        if (remainingSeconds <= 0) {\n            return;\n        }\n\n        setTimeout(() => {\n            if (!isPaused) {\n                setRemainingSeconds((sec) => sec - 1);\n            }\n        }, 1000);\n    }, [isPaused, from, remainingSeconds, setRemainingSeconds]);\n\n    return (\n        <div className={`jkl-countdown ${className ?? \"\"}`} role=\"timer\" data-testid=\"jkl-countdown\" {...rest}>\n            <span\n                className=\"jkl-countdown__tracker\"\n                role=\"presentation\"\n                style={\n                    {\n                        \"--duration\": `${from}ms`,\n                        \"--play-state\": isPaused ? \"paused\" : \"running\",\n                    } as CSSProperties\n                }\n                data-testid=\"jkl-countdown__tracker\"\n            />\n            <span className=\"jkl-sr-only\">{remainingSeconds}</span>\n        </div>\n    );\n};\n"],"names":["className","from","isPaused","rest","remainingSeconds","setRemainingSeconds","useState","Math","floor","useEffect","setTimeout","sec","jsxs","role","children","jsx","style"],"mappings":"0JAc6C,EAAGA,UAAAA,EAAWC,KAAAA,EAAMC,SAAAA,KAAaC,MACpE,MAACC,EAAkBC,GAAuBC,WAASC,KAAKC,MAAMP,EAAO,MAE3EQ,OAAAA,EAAAA,WAAU,KACFL,GAAoB,GAIxBM,YAAW,KACFR,GACmBG,GAACM,GAAQA,EAAM,GAAC,GAEzC,IAAI,GACR,CAACT,EAAUD,EAAMG,EAAkBC,IAGjCO,EAAAA,KAAA,MAAA,CAAIZ,UAAW,iBAAiBA,GAAa,KAAMa,KAAK,QAAQ,cAAY,mBAAoBV,EAC7FW,SAAA,CAAAC,EAAAA,IAAC,OAAA,CACGf,UAAU,yBACVa,KAAK,eACLG,MACI,CACI,aAAc,GAAGf,MACjB,eAAgBC,EAAW,SAAW,WAG9C,cAAY,2BAEfa,EAAAA,IAAA,OAAA,CAAKf,UAAU,cAAec,SAAiBV,MACpD"}
+{"version":3,"file":"Countdown.cjs","sources":["../../../../src/components/progress-bar/Countdown.tsx"],"sourcesContent":["import React, { useState, type CSSProperties, type FC, useEffect } from \"react\";\n\nexport interface CountdownProps\n    extends Pick<\n        React.HTMLAttributes<HTMLDivElement>,\n        \"onAnimationEnd\" | \"onAnimationStart\"\n    > {\n    id?: string;\n    className?: string;\n    /**\n     * Millisekunder å telle ned fra\n     */\n    from: number;\n    isPaused?: boolean;\n    style?: CSSProperties;\n}\n\nexport const Countdown: FC<CountdownProps> = ({\n    className,\n    from,\n    isPaused,\n    ...rest\n}) => {\n    const [remainingSeconds, setRemainingSeconds] = useState(\n        Math.floor(from / 1000),\n    );\n\n    useEffect(() => {\n        if (remainingSeconds <= 0) {\n            return;\n        }\n\n        setTimeout(() => {\n            if (!isPaused) {\n                setRemainingSeconds((sec) => sec - 1);\n            }\n        }, 1000);\n    }, [isPaused, from, remainingSeconds, setRemainingSeconds]);\n\n    return (\n        <div\n            className={`jkl-countdown ${className ?? \"\"}`}\n            role=\"timer\"\n            data-testid=\"jkl-countdown\"\n            {...rest}\n        >\n            <span\n                className=\"jkl-countdown__tracker\"\n                role=\"presentation\"\n                style={\n                    {\n                        \"--duration\": `${from}ms`,\n                        \"--play-state\": isPaused ? \"paused\" : \"running\",\n                    } as CSSProperties\n                }\n                data-testid=\"jkl-countdown__tracker\"\n            />\n            <span className=\"jkl-sr-only\">{remainingSeconds}</span>\n        </div>\n    );\n};\n"],"names":["className","from","isPaused","rest","remainingSeconds","setRemainingSeconds","useState","Math","floor","useEffect","setTimeout","sec","jsxs","role","children","jsx","style"],"mappings":"0JAiB6C,EACzCA,UAAAA,EACAC,KAAAA,EACAC,SAAAA,KACGC,MAEG,MAACC,EAAkBC,GAAuBC,EAAAA,SAC5CC,KAAKC,MAAMP,EAAO,MAGtBQ,OAAAA,EAAAA,WAAU,KACFL,GAAoB,GAIxBM,YAAW,KACFR,GACmBG,GAACM,GAAQA,EAAM,GAAC,GAEzC,IAAI,GACR,CAACT,EAAUD,EAAMG,EAAkBC,IAGlCO,EAAAA,KAAC,MAAA,CACGZ,UAAW,iBAAiBA,GAAa,KACzCa,KAAK,QACL,cAAY,mBACRV,EAEJW,SAAA,CAAAC,EAAAA,IAAC,OAAA,CACGf,UAAU,yBACVa,KAAK,eACLG,MACI,CACI,aAAc,GAAGf,MACjB,eAAgBC,EAAW,SAAW,WAG9C,cAAY,2BAEfa,EAAAA,IAAA,OAAA,CAAKf,UAAU,cAAec,SAAiBV,MAAA"}

package/build/cjs/components/radio-button/BaseRadioButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseRadioButton.cjs","sources":["../../../../src/components/radio-button/BaseRadioButton.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ChangeEventHandler, forwardRef } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { RadioButtonProps } from \"./RadioButton.js\";\n\nexport interface BaseRadioButtonProps extends RadioButtonProps {\n    inline?: boolean;\n    density?: Density;\n    invalid?: boolean;\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const BaseRadioButton = forwardRef<HTMLInputElement, BaseRadioButtonProps>((props, ref) => {\n    const { id, className, checked, children, label, density, inline, invalid, name, value, onChange, ...rest } = props;\n\n    const inputId = useId(id || \"jkl-radio-button\", { generateSuffix: !id });\n\n    return (\n        <div\n            className={clsx(\"jkl-radio-button\", className, {\n                \"jkl-radio-button--inline\": inline,\n                \"jkl-radio-button--error\": invalid,\n            })}\n            data-density={density}\n        >\n            <input\n                name={name}\n                ref={ref}\n                {...rest}\n                id={inputId}\n                className=\"jkl-radio-button__input\"\n                type=\"radio\"\n                onChange={onChange}\n                value={value}\n                checked={checked}\n            />\n            <label data-testid=\"jkl-radio-button__label-tag\" htmlFor={inputId} className=\"jkl-radio-button__label\">\n                <span aria-hidden className=\"jkl-radio-button__dot\" />\n                <span className=\"jkl-radio-button__text\">{label || children}</span>\n            </label>\n        </div>\n    );\n});\n\nBaseRadioButton.displayName = \"BaseRadioButton\";\n"],"names":["BaseRadioButton","forwardRef","props","ref","id","className","checked","children","label","density","inline","invalid","name","value","onChange","rest","inputId","useId","generateSuffix","jsxs","clsx","jsx","type","htmlFor","displayName"],"mappings":"yNAaaA,EAAkBC,EAAAA,YAAmD,CAACC,EAAOC,KACtF,MAAQC,GAAAA,EAAIC,UAAAA,EAAWC,QAAAA,EAASC,SAAAA,EAAUC,MAAAA,EAAOC,QAAAA,EAASC,OAAAA,EAAQC,QAAAA,EAASC,KAAAA,EAAMC,MAAAA,EAAOC,SAAAA,KAAaC,GAASb,EAExGc,EAAUC,QAAMb,GAAM,mBAAoB,CAAEc,gBAAiBd,IAG/D,OAAAe,EAAAA,KAAC,MAAA,CACGd,UAAWe,EAAAA,KAAK,mBAAoBf,EAAW,CAC3C,2BAA4BK,EAC5B,0BAA2BC,IAE/B,eAAcF,EAEdF,SAAA,CAAAc,EAAAA,IAAC,QAAA,CACGT,KAAAA,EACAT,IAAAA,KACIY,EACJX,GAAIY,EACJX,UAAU,0BACViB,KAAK,QACLR,SAAAA,EACAD,MAAAA,EACAP,QAAAA,WAEH,QAAM,CAAA,cAAY,8BAA8BiB,QAASP,EAASX,UAAU,0BACzEE,SAAA,CAAAc,EAAAA,IAAC,OAAK,CAAA,eAAW,EAAChB,UAAU,0BAC3BgB,EAAAA,IAAA,OAAA,CAAKhB,UAAU,yBAA0BE,YAASA,SACvD,IAKZP,EAAgBwB,YAAc"}
+{"version":3,"file":"BaseRadioButton.cjs","sources":["../../../../src/components/radio-button/BaseRadioButton.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { ChangeEventHandler, forwardRef } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { RadioButtonProps } from \"./RadioButton.js\";\n\nexport interface BaseRadioButtonProps extends RadioButtonProps {\n    inline?: boolean;\n    density?: Density;\n    invalid?: boolean;\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const BaseRadioButton = forwardRef<\n    HTMLInputElement,\n    BaseRadioButtonProps\n>((props, ref) => {\n    const {\n        id,\n        className,\n        checked,\n        children,\n        label,\n        density,\n        inline,\n        invalid,\n        name,\n        value,\n        onChange,\n        ...rest\n    } = props;\n\n    const inputId = useId(id || \"jkl-radio-button\", { generateSuffix: !id });\n\n    return (\n        <div\n            className={clsx(\"jkl-radio-button\", className, {\n                \"jkl-radio-button--inline\": inline,\n                \"jkl-radio-button--error\": invalid,\n            })}\n            data-density={density}\n        >\n            <input\n                name={name}\n                ref={ref}\n                {...rest}\n                id={inputId}\n                className=\"jkl-radio-button__input\"\n                type=\"radio\"\n                onChange={onChange}\n                value={value}\n                checked={checked}\n            />\n            <label\n                data-testid=\"jkl-radio-button__label-tag\"\n                htmlFor={inputId}\n                className=\"jkl-radio-button__label\"\n            >\n                <span aria-hidden className=\"jkl-radio-button__dot\" />\n                <span className=\"jkl-radio-button__text\">\n                    {label || children}\n                </span>\n            </label>\n        </div>\n    );\n});\n\nBaseRadioButton.displayName = \"BaseRadioButton\";\n"],"names":["BaseRadioButton","forwardRef","props","ref","id","className","checked","children","label","density","inline","invalid","name","value","onChange","rest","inputId","useId","generateSuffix","jsxs","clsx","jsx","type","htmlFor","displayName"],"mappings":"yNAaaA,EAAkBC,EAAAA,YAG7B,CAACC,EAAOC,KACA,MACFC,GAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,MAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,SAAAA,KACGC,GACHb,EAEEc,EAAUC,QAAMb,GAAM,mBAAoB,CAAEc,gBAAiBd,IAG/D,OAAAe,EAAAA,KAAC,MAAA,CACGd,UAAWe,EAAAA,KAAK,mBAAoBf,EAAW,CAC3C,2BAA4BK,EAC5B,0BAA2BC,IAE/B,eAAcF,EAEdF,SAAA,CAAAc,EAAAA,IAAC,QAAA,CACGT,KAAAA,EACAT,IAAAA,KACIY,EACJX,GAAIY,EACJX,UAAU,0BACViB,KAAK,QACLR,SAAAA,EACAD,MAAAA,EACAP,QAAAA,IAEJa,EAAAA,KAAC,QAAA,CACG,cAAY,8BACZI,QAASP,EACTX,UAAU,0BAEVE,SAAA,CAAAc,EAAAA,IAAC,OAAK,CAAA,eAAW,EAAChB,UAAU,0BAC3BgB,EAAAA,IAAA,OAAA,CAAKhB,UAAU,yBACXE,YAASA,SAElB,IAKZP,EAAgBwB,YAAc"}

package/build/cjs/components/radio-button/RadioButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.cjs","sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import React, { forwardRef, InputHTMLAttributes, ChangeEventHandler, ReactNode } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { SupportLabel, SupportLabelProps } from \"../input-group/SupportLabel.js\";\nimport { BaseRadioButton } from \"./BaseRadioButton.js\";\nimport { useRadioGroupContext } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"children\"> {\n    children?: ReactNode;\n    value: string;\n    /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n    name?: string;\n    /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /** @deprecated Bruk children */\n    label?: ReactNode;\n    helpLabel?: ReactNode;\n    supportLabelProps?: Omit<SupportLabelProps, \"id\" | \"errorLabel\" | \"helpLabel\" | \"density\">;\n}\n\nexport const RadioButton = forwardRef<HTMLInputElement, RadioButtonProps>((props, ref) => {\n    const { checked, value, supportLabelProps, helpLabel, ...rest } = props;\n    const { value: selectedValue, density, ...context } = useRadioGroupContext();\n    const supportId = useId(\"jkl-support-label\");\n\n    return (\n        <>\n            <BaseRadioButton\n                {...context}\n                {...rest}\n                ref={ref}\n                checked={\n                    typeof checked !== \"undefined\"\n                        ? checked\n                        : typeof selectedValue !== \"undefined\"\n                        ? value === selectedValue\n                        : undefined\n                }\n                value={value}\n                aria-describedby={helpLabel ? supportId : undefined}\n            />\n            <SupportLabel\n                {...supportLabelProps}\n                label={helpLabel}\n                labelType={\"help\"}\n                id={supportId}\n                density={density}\n            />\n        </>\n    );\n});\n\nRadioButton.displayName = \"RadioButton\";\n"],"names":["RadioButton","forwardRef","props","ref","checked","value","supportLabelProps","helpLabel","rest","selectedValue","density","context","useRadioGroupContext","supportId","useId","jsxs","Fragment","children","jsx","BaseRadioButton","SupportLabel","label","labelType","id","displayName"],"mappings":"sSAmBaA,EAAcC,EAAAA,YAA+C,CAACC,EAAOC,KAC9E,MAAQC,QAAAA,EAASC,MAAAA,EAAOC,kBAAAA,EAAmBC,UAAAA,KAAcC,GAASN,GAC1DG,MAAOI,EAAeC,QAAAA,KAAYC,GAAYC,EAAAA,uBAChDC,EAAYC,QAAM,qBAExB,OAEQC,EAAAA,KAAAC,WAAA,CAAAC,SAAA,CAAAC,EAAAA,IAACC,EAAAA,gBAAA,IACOR,KACAH,EACJL,IAAAA,EACAC,eACWA,EAAY,IACbA,SACOK,EAAkB,IACzBJ,IAAUI,OACV,EAEVJ,MAAAA,EACA,mBAAkBE,EAAYM,OAAY,IAE9CK,EAAAA,IAACE,EAAAA,aAAA,IACOd,EACJe,MAAOd,EACPe,UAAW,OACXC,GAAIV,EACJH,QAAAA,MAER,IAIRV,EAAYwB,YAAc"}
+{"version":3,"file":"RadioButton.cjs","sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    InputHTMLAttributes,\n    ChangeEventHandler,\n    ReactNode,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport {\n    SupportLabel,\n    SupportLabelProps,\n} from \"../input-group/SupportLabel.js\";\nimport { BaseRadioButton } from \"./BaseRadioButton.js\";\nimport { useRadioGroupContext } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonProps\n    extends Omit<InputHTMLAttributes<HTMLInputElement>, \"children\"> {\n    children?: ReactNode;\n    value: string;\n    /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n    name?: string;\n    /** Kan også settes på RadioButtonGroup, men settes på RadioButton f. eks. av react-hook-form */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /** @deprecated Bruk children */\n    label?: ReactNode;\n    helpLabel?: ReactNode;\n    supportLabelProps?: Omit<\n        SupportLabelProps,\n        \"id\" | \"errorLabel\" | \"helpLabel\" | \"density\"\n    >;\n}\n\nexport const RadioButton = forwardRef<HTMLInputElement, RadioButtonProps>(\n    (props, ref) => {\n        const { checked, value, supportLabelProps, helpLabel, ...rest } = props;\n        const {\n            value: selectedValue,\n            density,\n            ...context\n        } = useRadioGroupContext();\n        const supportId = useId(\"jkl-support-label\");\n\n        return (\n            <>\n                <BaseRadioButton\n                    {...context}\n                    {...rest}\n                    ref={ref}\n                    checked={\n                        typeof checked !== \"undefined\"\n                            ? checked\n                            : typeof selectedValue !== \"undefined\"\n                            ? value === selectedValue\n                            : undefined\n                    }\n                    value={value}\n                    aria-describedby={helpLabel ? supportId : undefined}\n                />\n                <SupportLabel\n                    {...supportLabelProps}\n                    label={helpLabel}\n                    labelType={\"help\"}\n                    id={supportId}\n                    density={density}\n                />\n            </>\n        );\n    },\n);\n\nRadioButton.displayName = \"RadioButton\";\n"],"names":["RadioButton","forwardRef","props","ref","checked","value","supportLabelProps","helpLabel","rest","selectedValue","density","context","useRadioGroupContext","supportId","useId","jsxs","Fragment","children","jsx","BaseRadioButton","SupportLabel","label","labelType","id","displayName"],"mappings":"sSA+BaA,EAAcC,EAAAA,YACvB,CAACC,EAAOC,KACJ,MAAQC,QAAAA,EAASC,MAAAA,EAAOC,kBAAAA,EAAmBC,UAAAA,KAAcC,GAASN,GAE9DG,MAAOI,EACPC,QAAAA,KACGC,GACHC,EAAqBA,uBACnBC,EAAYC,QAAM,qBAExB,OAEQC,EAAAA,KAAAC,WAAA,CAAAC,SAAA,CAAAC,EAAAA,IAACC,EAAAA,gBAAA,IACOR,KACAH,EACJL,IAAAA,EACAC,eACWA,EAAY,IACbA,SACOK,EAAkB,IACzBJ,IAAUI,OACV,EAEVJ,MAAAA,EACA,mBAAkBE,EAAYM,OAAY,IAE9CK,EAAAA,IAACE,EAAAA,aAAA,IACOd,EACJe,MAAOd,EACPe,UAAW,OACXC,GAAIV,EACJH,QAAAA,MAER,IAKZV,EAAYwB,YAAc"}

package/build/cjs/components/radio-button/RadioButtonGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonGroup.cjs","sources":["../../../../src/components/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { FieldGroup, type FieldGroupProps } from \"../input-group/FieldGroup.js\";\nimport { RadioGroupContextProvider } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonGroupProps extends Omit<FieldGroupProps, \"onChange\"> {\n    legend: string;\n    /** Alle RadioButton i gruppen får dette som name. */\n    name?: string;\n    /** Om gruppen skal være controlled setter du den valgte verdien her. */\n    value?: string;\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    helpLabel?: string;\n    /**\n     * Erstatter hjelpeteksten (hvis noen) med en feilmelding.\n     * Merker samtidig alle RadioButton i gruppen som ugyldige.\n     */\n    errorLabel?: string;\n    /**\n     * Setter inline-modifieren på alle RadioButton i gruppen.\n     * @default false\n     */\n    inline?: boolean;\n    density?: Density;\n}\n\nexport const RadioButtonGroup: FC<RadioButtonGroupProps> = (props) => {\n    const {\n        name,\n        value,\n        onChange,\n        errorLabel,\n        inline = false,\n        density,\n        labelProps = { variant: \"medium\" },\n        ...rest\n    } = props;\n\n    return (\n        <RadioGroupContextProvider\n            state={{\n                onChange,\n                value,\n                name,\n                invalid: Boolean(errorLabel),\n                inline,\n                density,\n            }}\n        >\n            <FieldGroup\n                errorLabel={errorLabel}\n                labelProps={labelProps}\n                data-testid=\"jkl-radio-button-group\"\n                density={density}\n                {...rest}\n                role=\"radiogroup\"\n                aria-invalid={Boolean(errorLabel)}\n            />\n        </RadioGroupContextProvider>\n    );\n};\n"],"names":["props","name","value","onChange","errorLabel","inline","density","labelProps","variant","rest","jsx","RadioGroupContextProvider","state","invalid","children","FieldGroup","role"],"mappings":"8NA0B4DA,IAClD,MACFC,KAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACAC,WAAAA,EAAa,CAAEC,QAAS,aACrBC,GACHT,EAGA,OAAAU,EAAAA,IAACC,EAAAA,0BAAA,CACGC,MAAO,CACHT,SAAAA,EACAD,MAAAA,EACAD,KAAAA,EACAY,UAAiBT,EACjBC,OAAAA,EACAC,QAAAA,GAGJQ,SAAAJ,EAAAA,IAACK,EAAAA,WAAA,CACGX,WAAAA,EACAG,WAAAA,EACA,cAAY,yBACZD,QAAAA,KACIG,EACJO,KAAK,aACL,iBAAsBZ,KAC1B"}
+{"version":3,"file":"RadioButtonGroup.cjs","sources":["../../../../src/components/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { FieldGroup, type FieldGroupProps } from \"../input-group/FieldGroup.js\";\nimport { RadioGroupContextProvider } from \"./radioGroupContext.js\";\n\nexport interface RadioButtonGroupProps\n    extends Omit<FieldGroupProps, \"onChange\"> {\n    legend: string;\n    /** Alle RadioButton i gruppen får dette som name. */\n    name?: string;\n    /** Om gruppen skal være controlled setter du den valgte verdien her. */\n    value?: string;\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    helpLabel?: string;\n    /**\n     * Erstatter hjelpeteksten (hvis noen) med en feilmelding.\n     * Merker samtidig alle RadioButton i gruppen som ugyldige.\n     */\n    errorLabel?: string;\n    /**\n     * Setter inline-modifieren på alle RadioButton i gruppen.\n     * @default false\n     */\n    inline?: boolean;\n    density?: Density;\n}\n\nexport const RadioButtonGroup: FC<RadioButtonGroupProps> = (props) => {\n    const {\n        name,\n        value,\n        onChange,\n        errorLabel,\n        inline = false,\n        density,\n        labelProps = { variant: \"medium\" },\n        ...rest\n    } = props;\n\n    return (\n        <RadioGroupContextProvider\n            state={{\n                onChange,\n                value,\n                name,\n                invalid: Boolean(errorLabel),\n                inline,\n                density,\n            }}\n        >\n            <FieldGroup\n                errorLabel={errorLabel}\n                labelProps={labelProps}\n                data-testid=\"jkl-radio-button-group\"\n                density={density}\n                {...rest}\n                role=\"radiogroup\"\n                aria-invalid={Boolean(errorLabel)}\n            />\n        </RadioGroupContextProvider>\n    );\n};\n"],"names":["props","name","value","onChange","errorLabel","inline","density","labelProps","variant","rest","jsx","RadioGroupContextProvider","state","invalid","children","FieldGroup","role"],"mappings":"8NA2B4DA,IAClD,MACFC,KAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACAC,WAAAA,EAAa,CAAEC,QAAS,aACrBC,GACHT,EAGA,OAAAU,EAAAA,IAACC,EAAAA,0BAAA,CACGC,MAAO,CACHT,SAAAA,EACAD,MAAAA,EACAD,KAAAA,EACAY,UAAiBT,EACjBC,OAAAA,EACAC,QAAAA,GAGJQ,SAAAJ,EAAAA,IAACK,EAAAA,WAAA,CACGX,WAAAA,EACAG,WAAAA,EACA,cAAY,yBACZD,QAAAA,KACIG,EACJO,KAAK,aACL,iBAAsBZ,KAC1B"}

package/build/cjs/components/radio-button/radioGroupContext.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"radioGroupContext.cjs","sources":["../../../../src/components/radio-button/radioGroupContext.tsx"],"sourcesContent":["import React, { createContext, useContext, ChangeEventHandler } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\n\ntype RadioGroupContext = {\n    name: string | undefined;\n    value: string | undefined;\n    inline: boolean;\n    density?: Density;\n    invalid: boolean;\n    onChange: ChangeEventHandler<HTMLInputElement> | undefined;\n};\n\nconst radioGroupContext = createContext<RadioGroupContext>({\n    name: undefined,\n    value: undefined,\n    onChange: () => {\n        return;\n    },\n    inline: false,\n    density: undefined,\n    invalid: false,\n});\n\nexport const useRadioGroupContext = (): RadioGroupContext => useContext(radioGroupContext);\n\ninterface Props extends WithChildren {\n    state: RadioGroupContext;\n}\n\nexport const RadioGroupContextProvider: React.FC<Props> = ({ state, children }) => (\n    <radioGroupContext.Provider value={state}>{children}</radioGroupContext.Provider>\n);\n"],"names":["radioGroupContext","createContext","name","value","onChange","inline","density","invalid","state","children","jsx","Provider","useContext"],"mappings":"wIAYMA,EAAoBC,EAAAA,cAAiC,CACvDC,UAAM,EACNC,WAAO,EACPC,SAAU,OAGVC,QAAQ,EACRC,aAAS,EACTC,SAAS,sCAS6C,EAAGC,MAAAA,EAAOC,SAAAA,KAC/DC,EAAAA,IAAAV,EAAkBW,SAAlB,CAA2BR,MAAOK,EAAQC,SAAAA,iCAPX,IAAyBG,EAAAA,WAAWZ"}
+{"version":3,"file":"radioGroupContext.cjs","sources":["../../../../src/components/radio-button/radioGroupContext.tsx"],"sourcesContent":["import React, { createContext, useContext, ChangeEventHandler } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\n\ntype RadioGroupContext = {\n    name: string | undefined;\n    value: string | undefined;\n    inline: boolean;\n    density?: Density;\n    invalid: boolean;\n    onChange: ChangeEventHandler<HTMLInputElement> | undefined;\n};\n\nconst radioGroupContext = createContext<RadioGroupContext>({\n    name: undefined,\n    value: undefined,\n    onChange: () => {\n        return;\n    },\n    inline: false,\n    density: undefined,\n    invalid: false,\n});\n\nexport const useRadioGroupContext = (): RadioGroupContext =>\n    useContext(radioGroupContext);\n\ninterface Props extends WithChildren {\n    state: RadioGroupContext;\n}\n\nexport const RadioGroupContextProvider: React.FC<Props> = ({\n    state,\n    children,\n}) => (\n    <radioGroupContext.Provider value={state}>\n        {children}\n    </radioGroupContext.Provider>\n);\n"],"names":["radioGroupContext","createContext","name","value","onChange","inline","density","invalid","state","children","Provider","useContext"],"mappings":"wIAYMA,EAAoBC,EAAAA,cAAiC,CACvDC,UAAM,EACNC,WAAO,EACPC,SAAU,OAGVC,QAAQ,EACRC,aAAS,EACTC,SAAS,sCAU6C,EACtDC,MAAAA,EACAC,SAAAA,WAECT,EAAkBU,SAAlB,CAA2BP,MAAOK,EAC9BC,SAAAA,iCAZ2B,IAChCE,EAAAA,WAAWX"}

package/build/cjs/components/radio-panel/RadioPanel.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../../clsx-E3yX_9sL.cjs"),s=require("react"),r=require("../../hooks/useAnimatedHeight/useAutoAnimateHeight.cjs");require("../../hooks/useScreen/useScreen.cjs"),require("../../hooks/useId/useId.cjs");const l=s.forwardRef((function({children:l,alwaysOpen:n=!1,label:t,extraLabel:i,name:o,checked:c,...d},u){const[p,j]=s.useState(!0),m=r.useAutoAnimatedHeight(p),h=s.useCallback((()=>n?-1:(j(!1),window.setTimeout((()=>{j(!0)}),200))),[j,n]);s.useEffect((()=>{if(!c)return;const e=h();return()=>window.clearTimeout(e)}),[c,h]);const x=s.Children.count(l)>0;return e.jsxs("div",{className:"jkl-radio-panel",ref:u,children:[e.jsxs("label",{className:"jkl-radio-panel__label",children:[e.jsx("input",{onChange:h,className:"jkl-radio-panel__input",type:"radio",name:o,...d}),e.jsx("span",{"aria-hidden":"true",className:"jkl-radio-panel__dot"}),e.jsx("span",{className:"jkl-radio-panel__main-label",children:t}),e.jsx("span",{className:a.clsx("jkl-radio-panel__extra-label",{"jkl-radio-panel__extra-label--text":"string"==typeof i}),children:i})]}),e.jsx("div",{"data-open":p&&x,"data-alwaysOpen":n&&x,ref:m,className:"jkl-radio-panel__content","aria-live":!n&&x?"polite":void 0,children:p&&l})]})}));exports.RadioPanel=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../../clsx-E3yX_9sL.cjs"),s=require("react"),l=require("../../hooks/useAnimatedHeight/useAutoAnimateHeight.cjs");require("../../hooks/useScreen/useScreen.cjs"),require("../../hooks/useId/useId.cjs");const r=s.forwardRef((function({children:r,alwaysOpen:n=!1,label:t,extraLabel:i,checked:o,onChange:c,...d},u){const[p,j]=s.useState(!0),h=l.useAutoAnimatedHeight(p),x=s.useCallback((e=>(typeof e<"u"&&(null==c||c(e)),n?-1:(j(!1),window.setTimeout((()=>{j(!0)}),200)))),[j,n,c]);s.useEffect((()=>{if(!o)return;const e=x();return()=>window.clearTimeout(e)}),[o,x]);const m=s.Children.count(r)>0;return e.jsxs("div",{className:"jkl-radio-panel",ref:u,children:[e.jsxs("label",{className:"jkl-radio-panel__label",children:[e.jsx("input",{onChange:x,checked:o,className:"jkl-radio-panel__input",type:"radio",...d}),e.jsx("span",{"aria-hidden":"true",className:"jkl-radio-panel__dot"}),e.jsx("span",{className:"jkl-radio-panel__main-label",children:t}),e.jsx("span",{className:a.clsx("jkl-radio-panel__extra-label",{"jkl-radio-panel__extra-label--text":"string"==typeof i}),children:i})]}),e.jsx("div",{"data-open":p&&m,"data-alwaysOpen":n&&m,ref:h,className:"jkl-radio-panel__content","aria-live":!n&&m?"polite":void 0,children:p&&r})]})}));exports.RadioPanel=r;
 //# sourceMappingURL=RadioPanel.cjs.map

package/build/cjs/components/radio-panel/RadioPanel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioPanel.cjs","sources":["../../../../src/components/radio-panel/RadioPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    Children,\n    ComponentPropsWithRef,\n    ForwardedRef,\n    forwardRef,\n    useCallback,\n    useEffect,\n    useState,\n} from \"react\";\nimport { useAutoAnimatedHeight } from \"../../hooks/index.js\";\n\ntype Props = ComponentPropsWithRef<\"input\"> & {\n    name: string;\n    value: string;\n    label: string;\n    extraLabel?: React.ReactNode;\n    alwaysOpen?: boolean;\n};\n\nexport const RadioPanel = forwardRef(function RadioPanel(\n    { children, alwaysOpen = false, label, extraLabel, name, checked, ...rest }: Props,\n    ref: ForwardedRef<HTMLDivElement>,\n) {\n    const [renderChildren, setRenderChildren] = useState(true);\n    const animationRef = useAutoAnimatedHeight<HTMLDivElement>(renderChildren);\n\n    const handleChange = useCallback(() => {\n        if (alwaysOpen) {\n            return -1;\n        }\n\n        // Hvis går fra lukket til åpen, trigge endring i live-region men\n        // vent \"lenge nok\" til at skjermleseren får det med seg,\n        // radio-knapper får bare en change event når de velges. Det at\n        // en annen radio i gruppen blir valgt trigger bare et event på den.\n        setRenderChildren(false);\n        return window.setTimeout(() => {\n            setRenderChildren(true);\n        }, 200);\n    }, [setRenderChildren, alwaysOpen]);\n\n    useEffect(() => {\n        if (!checked) {\n            return;\n        }\n        const timeoutId = handleChange();\n        return () => window.clearTimeout(timeoutId);\n    }, [checked, handleChange]);\n\n    const hasChildren = Children.count(children) > 0;\n\n    return (\n        <div className=\"jkl-radio-panel\" ref={ref}>\n            <label className=\"jkl-radio-panel__label\">\n                <input onChange={handleChange} className=\"jkl-radio-panel__input\" type=\"radio\" name={name} {...rest} />\n                <span aria-hidden=\"true\" className=\"jkl-radio-panel__dot\"></span>\n                <span className=\"jkl-radio-panel__main-label\">{label}</span>\n                <span\n                    className={clsx(\"jkl-radio-panel__extra-label\", {\n                        \"jkl-radio-panel__extra-label--text\": typeof extraLabel === \"string\",\n                    })}\n                >\n                    {extraLabel}\n                </span>\n            </label>\n            <div\n                data-open={renderChildren && hasChildren}\n                data-alwaysOpen={alwaysOpen && hasChildren}\n                ref={animationRef}\n                className=\"jkl-radio-panel__content\"\n                aria-live={!alwaysOpen && hasChildren ? \"polite\" : undefined}\n            >\n                {renderChildren && children}\n            </div>\n        </div>\n    );\n});\n"],"names":["RadioPanel","forwardRef","children","alwaysOpen","label","extraLabel","name","checked","rest","ref","renderChildren","setRenderChildren","useState","animationRef","useAutoAnimatedHeight","handleChange","useCallback","window","setTimeout","useEffect","timeoutId","clearTimeout","hasChildren","Children","count","jsxs","className","jsx","onChange","type","clsx"],"mappings":"0UAoBO,MAAMA,EAAaC,EAAAA,YAAW,UAC/BC,SAAAA,EAAUC,WAAAA,GAAa,EAAOC,MAAAA,EAAOC,WAAAA,EAAYC,KAAAA,EAAMC,QAAAA,KAAYC,GACrEC,GAEA,MAAOC,EAAgBC,GAAqBC,YAAS,GAC/CC,EAAeC,wBAAsCJ,GAErDK,EAAeC,EAAAA,aAAY,IACzBb,GAQJQ,GAAAA,GAAkB,GACXM,OAAOC,YAAW,KACrBP,GAAkB,EAAI,GACvB,OACJ,CAACA,EAAmBR,IAEvBgB,EAAAA,WAAU,KACN,IAAKZ,EACD,OAEJ,MAAMa,EAAYL,IACX,MAAA,IAAME,OAAOI,aAAaD,EAAS,GAC3C,CAACb,EAASQ,IAEb,MAAMO,EAAcC,EAAAA,SAASC,MAAMtB,GAAY,EAE/C,OACKuB,EAAAA,KAAA,MAAA,CAAIC,UAAU,kBAAkBjB,IAAAA,EAC7BP,SAAA,CAACuB,EAAAA,KAAA,QAAA,CAAMC,UAAU,yBACbxB,SAAA,CAACyB,EAAAA,IAAA,QAAA,CAAMC,SAAUb,EAAcW,UAAU,yBAAyBG,KAAK,QAAQvB,KAAAA,KAAgBE,IAC9FmB,EAAAA,IAAA,OAAA,CAAK,cAAY,OAAOD,UAAU,yBAClCC,EAAAA,IAAA,OAAA,CAAKD,UAAU,8BAA+BxB,SAAME,IACrDuB,EAAAA,IAAC,OAAA,CACGD,UAAWI,OAAK,+BAAgC,CAC5C,qCAA4D,iBAAfzB,IAGhDH,SAAAG,OAGTsB,EAAAA,IAAC,MAAA,CACG,YAAWjB,GAAkBY,EAC7B,kBAAiBnB,GAAcmB,EAC/Bb,IAAKI,EACLa,UAAU,2BACV,aAAYvB,GAAcmB,EAAc,cAAW,EAElDpB,SAAkBQ,GAAAR,MAInC"}
+{"version":3,"file":"RadioPanel.cjs","sources":["../../../../src/components/radio-panel/RadioPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    ChangeEvent,\n    Children,\n    ComponentPropsWithRef,\n    ForwardedRef,\n    forwardRef,\n    useCallback,\n    useEffect,\n    useState,\n} from \"react\";\nimport { useAutoAnimatedHeight } from \"../../hooks/index.js\";\n\ntype Props = Omit<ComponentPropsWithRef<\"input\">, \"type\"> & {\n    name: string;\n    value: string;\n    label: string;\n    extraLabel?: React.ReactNode;\n    alwaysOpen?: boolean;\n};\n\nexport const RadioPanel = forwardRef(function RadioPanel(\n    {\n        children,\n        alwaysOpen = false,\n        label,\n        extraLabel,\n        checked,\n        onChange,\n        ...rest\n    }: Props,\n    ref: ForwardedRef<HTMLDivElement>,\n) {\n    const [renderChildren, setRenderChildren] = useState(true);\n    const animationRef = useAutoAnimatedHeight<HTMLDivElement>(renderChildren);\n\n    const handleChange = useCallback(\n        (e?: ChangeEvent<HTMLInputElement>) => {\n            if (typeof e !== \"undefined\") {\n                onChange?.(e);\n            }\n\n            if (alwaysOpen) {\n                return -1;\n            }\n\n            // Hvis går fra lukket til åpen, trigge endring i live-region men\n            // vent \"lenge nok\" til at skjermleseren får det med seg,\n            // radio-knapper får bare en change event når de velges. Det at\n            // en annen radio i gruppen blir valgt trigger bare et event på den.\n            setRenderChildren(false);\n            return window.setTimeout(() => {\n                setRenderChildren(true);\n            }, 200);\n        },\n        [setRenderChildren, alwaysOpen, onChange],\n    );\n\n    useEffect(() => {\n        if (!checked) {\n            return;\n        }\n        const timeoutId = handleChange();\n        return () => window.clearTimeout(timeoutId);\n    }, [checked, handleChange]);\n\n    const hasChildren = Children.count(children) > 0;\n\n    return (\n        <div className=\"jkl-radio-panel\" ref={ref}>\n            <label className=\"jkl-radio-panel__label\">\n                <input\n                    onChange={handleChange}\n                    checked={checked}\n                    className=\"jkl-radio-panel__input\"\n                    type=\"radio\"\n                    {...rest}\n                />\n                <span\n                    aria-hidden=\"true\"\n                    className=\"jkl-radio-panel__dot\"\n                ></span>\n                <span className=\"jkl-radio-panel__main-label\">{label}</span>\n                <span\n                    className={clsx(\"jkl-radio-panel__extra-label\", {\n                        \"jkl-radio-panel__extra-label--text\":\n                            typeof extraLabel === \"string\",\n                    })}\n                >\n                    {extraLabel}\n                </span>\n            </label>\n            <div\n                data-open={renderChildren && hasChildren}\n                data-alwaysOpen={alwaysOpen && hasChildren}\n                ref={animationRef}\n                className=\"jkl-radio-panel__content\"\n                aria-live={!alwaysOpen && hasChildren ? \"polite\" : undefined}\n            >\n                {renderChildren && children}\n            </div>\n        </div>\n    );\n});\n"],"names":["RadioPanel","forwardRef","children","alwaysOpen","label","extraLabel","checked","onChange","rest","ref","renderChildren","setRenderChildren","useState","animationRef","useAutoAnimatedHeight","handleChange","useCallback","e","window","setTimeout","useEffect","timeoutId","clearTimeout","hasChildren","Children","count","jsxs","className","jsx","type","clsx"],"mappings":"0UAqBa,MAAAA,EAAaC,EAAAA,YAAW,UAE7BC,SAAAA,EACAC,WAAAA,GAAa,EACbC,MAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,SAAAA,KACGC,GAEPC,GAEA,MAAOC,EAAgBC,GAAqBC,YAAS,GAC/CC,EAAeC,wBAAsCJ,GAErDK,EAAeC,EAAAA,aAChBC,WACcA,EAAM,MACb,MAAAV,GAAAA,EAAWU,IAGXd,GAQJQ,GAAAA,GAAkB,GACXO,OAAOC,YAAW,KACrBR,GAAkB,EAAI,GACvB,QAEP,CAACA,EAAmBR,EAAYI,IAGpCa,EAAAA,WAAU,KACN,IAAKd,EACD,OAEJ,MAAMe,EAAYN,IACX,MAAA,IAAMG,OAAOI,aAAaD,EAAS,GAC3C,CAACf,EAASS,IAEb,MAAMQ,EAAcC,EAAAA,SAASC,MAAMvB,GAAY,EAE/C,OACKwB,EAAAA,KAAA,MAAA,CAAIC,UAAU,kBAAkBlB,IAAAA,EAC7BP,SAAA,CAACwB,EAAAA,KAAA,QAAA,CAAMC,UAAU,yBACbzB,SAAA,CAAA0B,EAAAA,IAAC,QAAA,CACGrB,SAAUQ,EACVT,QAAAA,EACAqB,UAAU,yBACVE,KAAK,WACDrB,IAERoB,EAAAA,IAAC,OAAA,CACG,cAAY,OACZD,UAAU,yBAEbC,EAAAA,IAAA,OAAA,CAAKD,UAAU,8BAA+BzB,SAAME,IACrDwB,EAAAA,IAAC,OAAA,CACGD,UAAWG,OAAK,+BAAgC,CAC5C,qCAC0B,iBAAfzB,IAGdH,SAAAG,OAGTuB,EAAAA,IAAC,MAAA,CACG,YAAWlB,GAAkBa,EAC7B,kBAAiBpB,GAAcoB,EAC/Bd,IAAKI,EACLc,UAAU,2BACV,aAAYxB,GAAcoB,EAAc,cAAW,EAElDrB,SAAkBQ,GAAAR,MAInC"}

package/build/cjs/components/radio-panel/RadioPanel.d.cts

@@ -1,5 +1,5 @@
 import { default as React, ComponentPropsWithRef } from 'react';
-type Props = ComponentPropsWithRef<"input"> & {
+type Props = Omit<ComponentPropsWithRef<"input">, "type"> & {
     name: string;
     value: string;
     label: string;

package/build/cjs/components/select/NativeSelect.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NativeSelect.cjs","sources":["../../../../src/components/select/NativeSelect.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, SelectHTMLAttributes } from \"react\";\nimport { getValuePair, ValuePair } from \"../../utilities/valuePair.js\";\nimport { ArrowVerticalAnimated } from \"../icon/index.js\";\nimport { InputGroup, InputGroupProps } from \"../input-group/InputGroup.js\";\n\nexport interface NativeSelectProps extends Omit<InputGroupProps, \"children\">, SelectHTMLAttributes<HTMLSelectElement> {\n    /**\n     * Merk som ugyldig uten å sende inn en errorLabel.\n     * NB! Brukes kun i tilfeller der valideringsfeil dukker opp andre steder, for eksempel i en FieldGroup.\n     */\n    invalid?: boolean;\n    /**\n     * Setter inn et placeholderelement som vises når ingenting er valgt i nedtrekkslisten.\n     * @default \"Velg\"\n     */\n    placeholder?: string;\n    items: Array<string | ValuePair>;\n    selectClassName?: string;\n    width?: string;\n}\n\nexport const NativeSelect = forwardRef<HTMLSelectElement, NativeSelectProps>((props, ref) => {\n    const {\n        label,\n        className,\n        density,\n        errorLabel,\n        helpLabel,\n        inline,\n        invalid,\n        items,\n        labelProps,\n        placeholder = \"Velg\",\n        selectClassName,\n        supportLabelProps,\n        tooltipProps,\n        value,\n        width,\n        ...rest\n    } = props;\n\n    const inputGroupProps = {\n        label,\n        density,\n        errorLabel,\n        helpLabel,\n        labelProps,\n        inline,\n        supportLabelProps,\n        tooltipProps,\n    };\n\n    return (\n        <InputGroup\n            {...inputGroupProps}\n            data-testid=\"jkl-select\"\n            className={clsx(\"jkl-select\", className, {\n                \"jkl-select--inline\": inline,\n                \"jkl-select--invalid\": !!errorLabel || invalid,\n            })}\n            render={(inputProps) => (\n                <div className=\"jkl-select__outer-wrapper\" style={{ width }}>\n                    <select\n                        ref={ref}\n                        className={clsx(\"jkl-select__button\", selectClassName, {\n                            \"jkl-select__button--active-value\": !!value,\n                        })}\n                        defaultValue={value ? undefined : \"\"}\n                        value={value}\n                        {...inputProps}\n                        {...rest}\n                    >\n                        {placeholder && !value && (\n                            <option disabled value=\"\">\n                                {placeholder}\n                            </option>\n                        )}\n                        {items.map(getValuePair).map((item) => (\n                            <option\n                                data-testid=\"jkl-select__option\"\n                                className=\"jkl-select__option\"\n                                key={item.value}\n                                value={item.value}\n                            >\n                                {item.label}\n                            </option>\n                        ))}\n                    </select>\n                    <ArrowVerticalAnimated variant=\"medium\" pointingDown className=\"jkl-select__arrow\" />\n                </div>\n            )}\n        />\n    );\n});\n\nNativeSelect.displayName = \"NativeSelect\";\n"],"names":["NativeSelect","forwardRef","props","ref","label","className","density","errorLabel","helpLabel","inline","invalid","items","labelProps","placeholder","selectClassName","supportLabelProps","tooltipProps","value","width","rest","inputGroupProps","jsx","InputGroup","clsx","render","inputProps","jsxs","style","children","defaultValue","disabled","map","getValuePair","item","ArrowVerticalAnimated","variant","pointingDown","displayName"],"mappings":"muDAsBaA,EAAeC,EAAAA,YAAiD,CAACC,EAAOC,KAC3E,MACFC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,YAAAA,EAAc,OACdC,gBAAAA,EACAC,kBAAAA,EACAC,aAAAA,EACAC,MAAAA,EACAC,MAAAA,KACGC,GACHjB,EAEEkB,EAAkB,CACpBhB,MAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAI,WAAAA,EACAH,OAAAA,EACAM,kBAAAA,EACAC,aAAAA,GAIA,OAAAK,EAAAA,IAACC,EAAAA,WAAA,IACOF,EACJ,cAAY,aACZf,UAAWkB,EAAAA,KAAK,aAAclB,EAAW,CACrC,qBAAsBI,EACtB,wBAAyBF,GAAcG,IAE3Cc,OAASC,GACJC,EAAAA,KAAA,MAAA,CAAIrB,UAAU,4BAA4BsB,MAAO,CAAET,MAAAA,GAChDU,SAAA,CAAAF,EAAAA,KAAC,SAAA,CACGvB,IAAAA,EACAE,UAAWkB,EAAAA,KAAK,qBAAsBT,EAAiB,CACnD,qCAAsCG,IAE1CY,aAAcZ,OAAQ,EAAY,GAClCA,MAAAA,KACIQ,KACAN,EAEHS,SAAA,CAAef,IAACI,GACZI,EAAAA,IAAA,SAAA,CAAOS,UAAQ,EAACb,MAAM,GAClBW,SACLf,IAEHF,EAAMoB,IAAIC,EAAYA,cAAED,KAAKE,GAC1BZ,EAAAA,IAAC,SAAA,CACG,cAAY,qBACZhB,UAAU,qBAEVY,MAAOgB,EAAKhB,MAEXW,SAAKK,EAAA7B,OAHD6B,EAAKhB,kBAOrBiB,EAAAA,sBAAsB,CAAAC,QAAQ,SAASC,cAAY,EAAC/B,UAAU,0BACnE,IAMhBL,EAAaqC,YAAc"}
+{"version":3,"file":"NativeSelect.cjs","sources":["../../../../src/components/select/NativeSelect.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, SelectHTMLAttributes } from \"react\";\nimport { getValuePair, ValuePair } from \"../../utilities/valuePair.js\";\nimport { ArrowVerticalAnimated } from \"../icon/index.js\";\nimport { InputGroup, InputGroupProps } from \"../input-group/InputGroup.js\";\n\nexport interface NativeSelectProps\n    extends Omit<InputGroupProps, \"children\">,\n        SelectHTMLAttributes<HTMLSelectElement> {\n    /**\n     * Merk som ugyldig uten å sende inn en errorLabel.\n     * NB! Brukes kun i tilfeller der valideringsfeil dukker opp andre steder, for eksempel i en FieldGroup.\n     */\n    invalid?: boolean;\n    /**\n     * Setter inn et placeholderelement som vises når ingenting er valgt i nedtrekkslisten.\n     * @default \"Velg\"\n     */\n    placeholder?: string;\n    items: Array<string | ValuePair>;\n    selectClassName?: string;\n    width?: string;\n}\n\nexport const NativeSelect = forwardRef<HTMLSelectElement, NativeSelectProps>(\n    (props, ref) => {\n        const {\n            label,\n            className,\n            density,\n            errorLabel,\n            helpLabel,\n            inline,\n            invalid,\n            items,\n            labelProps,\n            placeholder = \"Velg\",\n            selectClassName,\n            supportLabelProps,\n            tooltipProps,\n            value,\n            width,\n            ...rest\n        } = props;\n\n        const inputGroupProps = {\n            label,\n            density,\n            errorLabel,\n            helpLabel,\n            labelProps,\n            inline,\n            supportLabelProps,\n            tooltipProps,\n        };\n\n        return (\n            <InputGroup\n                {...inputGroupProps}\n                data-testid=\"jkl-select\"\n                className={clsx(\"jkl-select\", className, {\n                    \"jkl-select--inline\": inline,\n                    \"jkl-select--invalid\": !!errorLabel || invalid,\n                })}\n                render={(inputProps) => (\n                    <div\n                        className=\"jkl-select__outer-wrapper\"\n                        style={{ width }}\n                    >\n                        <select\n                            ref={ref}\n                            className={clsx(\n                                \"jkl-select__button\",\n                                selectClassName,\n                                {\n                                    \"jkl-select__button--active-value\": !!value,\n                                },\n                            )}\n                            defaultValue={value ? undefined : \"\"}\n                            value={value}\n                            {...inputProps}\n                            {...rest}\n                        >\n                            {placeholder && !value && (\n                                <option disabled value=\"\">\n                                    {placeholder}\n                                </option>\n                            )}\n                            {items.map(getValuePair).map((item) => (\n                                <option\n                                    data-testid=\"jkl-select__option\"\n                                    className=\"jkl-select__option\"\n                                    key={item.value}\n                                    value={item.value}\n                                >\n                                    {item.label}\n                                </option>\n                            ))}\n                        </select>\n                        <ArrowVerticalAnimated\n                            variant=\"medium\"\n                            pointingDown\n                            className=\"jkl-select__arrow\"\n                        />\n                    </div>\n                )}\n            />\n        );\n    },\n);\n\nNativeSelect.displayName = \"NativeSelect\";\n"],"names":["NativeSelect","forwardRef","props","ref","label","className","density","errorLabel","helpLabel","inline","invalid","items","labelProps","placeholder","selectClassName","supportLabelProps","tooltipProps","value","width","rest","inputGroupProps","jsx","InputGroup","clsx","render","inputProps","jsxs","style","children","defaultValue","disabled","map","getValuePair","item","ArrowVerticalAnimated","variant","pointingDown","displayName"],"mappings":"muDAwBaA,EAAeC,EAAAA,YACxB,CAACC,EAAOC,KACE,MACFC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,YAAAA,EAAc,OACdC,gBAAAA,EACAC,kBAAAA,EACAC,aAAAA,EACAC,MAAAA,EACAC,MAAAA,KACGC,GACHjB,EAEEkB,EAAkB,CACpBhB,MAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAI,WAAAA,EACAH,OAAAA,EACAM,kBAAAA,EACAC,aAAAA,GAIA,OAAAK,EAAAA,IAACC,EAAAA,WAAA,IACOF,EACJ,cAAY,aACZf,UAAWkB,EAAAA,KAAK,aAAclB,EAAW,CACrC,qBAAsBI,EACtB,wBAAyBF,GAAcG,IAE3Cc,OAASC,GACLC,EAAAA,KAAC,MAAA,CACGrB,UAAU,4BACVsB,MAAO,CAAET,MAAAA,GAETU,SAAA,CAAAF,EAAAA,KAAC,SAAA,CACGvB,IAAAA,EACAE,UAAWkB,EAAAA,KACP,qBACAT,EACA,CACI,qCAAsCG,IAG9CY,aAAcZ,OAAQ,EAAY,GAClCA,MAAAA,KACIQ,KACAN,EAEHS,SAAA,CAAef,IAACI,GACZI,EAAAA,IAAA,SAAA,CAAOS,UAAQ,EAACb,MAAM,GAClBW,SACLf,IAEHF,EAAMoB,IAAIC,EAAYA,cAAED,KAAKE,GAC1BZ,EAAAA,IAAC,SAAA,CACG,cAAY,qBACZhB,UAAU,qBAEVY,MAAOgB,EAAKhB,MAEXW,SAAKK,EAAA7B,OAHD6B,EAAKhB,YAOtBI,EAAAA,IAACa,EAAAA,sBAAA,CACGC,QAAQ,SACRC,cAAY,EACZ/B,UAAU,0BAElB,IAOpBL,EAAaqC,YAAc"}