@fremtind/jokul 4.7.3 → 4.7.5

package/build/es/components/input-panel/InputPanel.js

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as a}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as e}from"react";import{Checkbox as r}from"../checkbox/Checkbox.js";import{RadioButton as i}from"../radio-button/RadioButton.js";import"../../hooks/useId/useId.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/WarningIcon.js";import"../radio-button/radioGroupContext.js";import"../radio-button/BaseRadioButton.js";const t=e(function({className:e,description:t,type:s,label:c,amount:l,value:p=c,name:m="Panelvalg",children:d,extraLabel:u,alwaysOpen:j=!1,...h},x){return o("div",{className:n("jkl-input-panel",`jkl-${s}-panel`,e),ref:x,"data-always-open":j,children:[o("div",{className:"jkl-input-panel__header",children:["checkbox"===s&&a(r,{value:p?.toString(),name:m,...h,children:c}),"radio"===s&&a(i,{value:p?.toString(),name:m,...h,children:c}),(l||u)&&a("span",{className:"jkl-input-panel__header__amount",children:l||u})]}),(t||d)&&a("div",{className:"jkl-input-panel__description",children:t||d})]})});export{t as InputPanel};
+import{jsxs as o,jsx as a}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as e}from"react";import{Checkbox as r}from"../checkbox/Checkbox.js";import{RadioButton as i}from"../radio-button/RadioButton.js";import"../../hooks/useId/useId.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/WarningIcon.js";import"../radio-button/radioGroupContext.js";import"../radio-button/BaseRadioButton.js";const t=e(function({className:e,description:t,type:s,label:c,amount:l,value:p=c,name:m="Panelvalg",children:d,extraLabel:u,alwaysOpen:j,...h},x){return o("div",{className:n("jkl-input-panel",`jkl-${s}-panel`,e),ref:x,children:[o("div",{className:"jkl-input-panel__header",children:["checkbox"===s&&a(r,{value:p?.toString(),name:m,...h,children:c}),"radio"===s&&a(i,{value:p?.toString(),name:m,...h,children:c}),(l||u)&&a("span",{className:"jkl-input-panel__header__amount",children:l||u})]}),(t||d)&&a("div",{className:"jkl-input-panel__description",children:t||d})]})});export{t as InputPanel};
 //# sourceMappingURL=InputPanel.js.map

package/build/es/components/input-panel/InputPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputPanel.js","sources":["../../../../src/components/input-panel/InputPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type ForwardedRef, forwardRef } from \"react\";\nimport { Checkbox } from \"../checkbox/index.js\";\nimport { RadioButton } from \"../radio-button/index.js\";\nimport type { InputPanelProps } from \"./types.js\";\n\nexport const InputPanel = forwardRef(function BasePanel(\n    {\n        className,\n        description,\n        type,\n        label,\n        amount,\n        value = label,\n        name = \"Panelvalg\",\n        children,\n        extraLabel,\n        alwaysOpen = false,\n        ...rest\n    }: InputPanelProps,\n    ref: ForwardedRef<HTMLInputElement>,\n) {\n    return (\n        <div\n            className={clsx(\"jkl-input-panel\", `jkl-${type}-panel`, className)}\n            ref={ref}\n            data-always-open={alwaysOpen}\n        >\n            <div className=\"jkl-input-panel__header\">\n                {type === \"checkbox\" && (\n                    <Checkbox value={value?.toString()} name={name} {...rest}>\n                        {label}\n                    </Checkbox>\n                )}\n                {type === \"radio\" && (\n                    <RadioButton\n                        value={value?.toString()}\n                        name={name}\n                        {...rest}\n                    >\n                        {label}\n                    </RadioButton>\n                )}\n                {(amount || extraLabel) && (\n                    <span className=\"jkl-input-panel__header__amount\">\n                        {amount || extraLabel}\n                    </span>\n                )}\n            </div>\n            {(description || children) && (\n                <div className=\"jkl-input-panel__description\">\n                    {description || children}\n                </div>\n            )}\n        </div>\n    );\n});\n"],"names":["InputPanel","forwardRef","className","description","type","label","amount","value","name","children","extraLabel","alwaysOpen","rest","ref","jsxs","clsx","jsx","Checkbox","toString","RadioButton"],"mappings":"2dAMO,MAAMA,EAAaC,EAAW,UAE7BC,UAAAA,EACAC,YAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EAAQF,EACRG,KAAAA,EAAO,YACPC,SAAAA,EACAC,WAAAA,EACAC,WAAAA,GAAa,KACVC,GAEPC,GAEA,OACIC,EAAC,MAAA,CACGZ,UAAWa,EAAK,kBAAmB,OAAOX,UAAcF,GACxDW,IAAAA,EACA,mBAAkBF,EAElBF,SAAA,CAAAK,EAAC,MAAA,CAAIZ,UAAU,0BACVO,SAAA,CAAS,aAATL,GACGY,EAACC,EAAA,CAASV,MAAOA,GAAOW,WAAYV,KAAAA,KAAgBI,EAC/CH,SAAAJ,IAGC,UAATD,GACGY,EAACG,EAAA,CACGZ,MAAOA,GAAOW,WACdV,KAAAA,KACII,EAEHH,SAAAJ,KAGPC,GAAUI,IACRM,EAAC,QAAKd,UAAU,kCACXO,YAAUC,QAIrBP,GAAeM,IACbO,EAAC,OAAId,UAAU,+BACVO,YAAeA,MAKpC"}
+{"version":3,"file":"InputPanel.js","sources":["../../../../src/components/input-panel/InputPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type ForwardedRef, forwardRef } from \"react\";\nimport { Checkbox } from \"../checkbox/index.js\";\nimport { RadioButton } from \"../radio-button/index.js\";\nimport type { InputPanelProps } from \"./types.js\";\n\nexport const InputPanel = forwardRef(function BasePanel(\n    {\n        className,\n        description,\n        type,\n        label,\n        amount,\n        value = label,\n        name = \"Panelvalg\",\n        children,\n        extraLabel,\n        alwaysOpen: _alwaysOpen,\n        ...rest\n    }: InputPanelProps,\n    ref: ForwardedRef<HTMLInputElement>,\n) {\n    return (\n        <div\n            className={clsx(\"jkl-input-panel\", `jkl-${type}-panel`, className)}\n            ref={ref}\n        >\n            <div className=\"jkl-input-panel__header\">\n                {type === \"checkbox\" && (\n                    <Checkbox value={value?.toString()} name={name} {...rest}>\n                        {label}\n                    </Checkbox>\n                )}\n                {type === \"radio\" && (\n                    <RadioButton\n                        value={value?.toString()}\n                        name={name}\n                        {...rest}\n                    >\n                        {label}\n                    </RadioButton>\n                )}\n                {(amount || extraLabel) && (\n                    <span className=\"jkl-input-panel__header__amount\">\n                        {amount || extraLabel}\n                    </span>\n                )}\n            </div>\n            {(description || children) && (\n                <div className=\"jkl-input-panel__description\">\n                    {description || children}\n                </div>\n            )}\n        </div>\n    );\n});\n"],"names":["InputPanel","forwardRef","className","description","type","label","amount","value","name","children","extraLabel","alwaysOpen","_alwaysOpen","rest","ref","jsxs","clsx","jsx","Checkbox","toString","RadioButton"],"mappings":"2dAMO,MAAMA,EAAaC,EAAW,UAE7BC,UAAAA,EACAC,YAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EAAQF,EACRG,KAAAA,EAAO,YACPC,SAAAA,EACAC,WAAAA,EACAC,WAAYC,KACTC,GAEPC,GAEA,OACIC,EAAC,MAAA,CACGb,UAAWc,EAAK,kBAAmB,OAAOZ,UAAcF,GACxDY,IAAAA,EAEAL,SAAA,CAAAM,EAAC,MAAA,CAAIb,UAAU,0BACVO,SAAA,CAAS,aAATL,GACGa,EAACC,EAAA,CAASX,MAAOA,GAAOY,WAAYX,KAAAA,KAAgBK,EAC/CJ,SAAAJ,IAGC,UAATD,GACGa,EAACG,EAAA,CACGb,MAAOA,GAAOY,WACdX,KAAAA,KACIK,EAEHJ,SAAAJ,KAGPC,GAAUI,IACRO,EAAC,QAAKf,UAAU,kCACXO,YAAUC,QAIrBP,GAAeM,IACbQ,EAAC,OAAIf,UAAU,+BACVO,YAAeA,MAKpC"}

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

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{useMergeRefs as t,FloatingPortal as n,FloatingFocusManager as o,useFloating as s,autoUpdate as r,offset as a,flip as i,shift as l,useClick as c,useHover as u,useFocus as p,useDismiss as d,useRole as m,useInteractions as f}from"@floating-ui/react";import{c as g}from"../../../clsx-BeLtu-UY.js";import*as h from"react";import{getThemeAndSize as v}from"../../utilities/getThemeAndSize.js";const b=h.createContext(null),x=()=>{const e=h.useContext(b);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},k=({children:t,...n})=>{const o=(({open:e,onOpenChange:t,placement:n="bottom-start",strategy:o="absolute",modal:g=!0,offset:v=4,positionReference:b,onPlacementChange:x,hoverOptions:k,focusOptions:C,clickOptions:F,roleOptions:P,dismissOptions:R})=>{const[y,E]=h.useState(e),O=e??y,j=t??E,w=s({open:O,onOpenChange:j,placement:n,strategy:o,middleware:[a(v),i({padding:5,fallbackPlacements:["bottom","top"]}),l({padding:12})],whileElementsMounted:r}),z=w.context,M=c(z,{enabled:!1,...F}),N=u(z,{enabled:!1,...k}),S=p(z,{enabled:!1,...C}),T=d(z,R),A=m(z,P),L=f([M,T,S,N,A]);return h.useLayoutEffect(()=>{b&&w.refs.setPositionReference(b?.current)},[b,w.refs]),h.useLayoutEffect(()=>{O&&x?.(w.placement)},[O,w.placement,x]),h.useMemo(()=>({open:O,onOpenChange:j,modal:g,...L,...w}),[O,j,g,L,w])})({...n});return e(b.Provider,{value:o,children:t})},C=h.forwardRef(function({children:n,asChild:o=!1,...s},r){const{refs:a,getReferenceProps:i,open:l,onOpenChange:c}=x(),u=n.ref,p=t([a.setReference,r,u]);return o&&h.isValidElement(n)?h.cloneElement(n,i({ref:p,...s,...n.props})):e("button",{ref:p,onClick:()=>c?.(!l),"aria-expanded":l,...i({...s,className:g("jkl-popover-trigger",s.className)}),children:n})}),F=h.forwardRef(function({style:s,className:r,padding:a=0,initialFocus:i=0,returnFocus:l=!0,...c},u){const{context:p,modal:d,refs:m,open:f,floatingStyles:b,getFloatingProps:k,isPositioned:C}=x(),F=t([m.setFloating,u]),P=m.reference.current,{theme:R,size:y}=v((O=P)&&"contextElement"in O?P.contextElement:P),E=h.useRef(null);var O;return h.useEffect(()=>{E.current=p.elements.domReference?.closest("[data-portal]")||document.body},[p.elements.domReference]),f?e(n,{root:E.current,children:e(o,{context:p,modal:d,initialFocus:i,returnFocus:l,children:e("div",{"data-theme":R,"data-size":y,className:g("jkl jkl-popover",r),ref:F,style:{...s,...b,"--popover-padding":`var(--jkl-spacing-${a})`,visibility:d||C?"visible":"hidden"},...k(c),children:c.children})})}):null});k.Trigger=C,k.Content=F;export{k as Popover,k as default};
+import{jsx as e}from"react/jsx-runtime";import{useMergeRefs as t,FloatingPortal as n,FloatingFocusManager as o,useFloating as s,autoUpdate as r,offset as a,flip as i,shift as l,size as c,useClick as p,useHover as d,useFocus as u,useDismiss as f,useRole as m,useInteractions as g}from"@floating-ui/react";import{c as h}from"../../../clsx-BeLtu-UY.js";import*as v from"react";import{getThemeAndSize as x}from"../../utilities/getThemeAndSize.js";const b=v.createContext(null),R=()=>{const e=v.useContext(b);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},k=({children:t,...n})=>{const o=(({open:e,onOpenChange:t,placement:n="bottom-start",strategy:o="absolute",modal:h=!0,offset:x=4,positionReference:b,onPlacementChange:R,matchReferenceWidth:k=!1,hoverOptions:y,focusOptions:C,clickOptions:F,roleOptions:P,dismissOptions:E})=>{const[O,j]=v.useState(e),w=e??O,z=t??j,M=s({open:w,onOpenChange:z,placement:n,strategy:o,middleware:[a(x),i({padding:5,fallbackPlacements:["bottom","top"]}),l({padding:12}),...k?[c({apply({rects:e,elements:t}){t.floating.style.width=`${e.reference.width}px`}})]:[]],whileElementsMounted:r}),N=M.context,S=p(N,{enabled:!1,...F}),T=d(N,{enabled:!1,...y}),A=u(N,{enabled:!1,...C}),L=f(N,E),$=m(N,P),D=g([S,L,A,T,$]);return v.useLayoutEffect(()=>{b&&M.refs.setPositionReference(b?.current)},[b,M.refs]),v.useLayoutEffect(()=>{w&&R?.(M.placement)},[w,M.placement,R]),v.useMemo(()=>({open:w,onOpenChange:z,modal:h,...D,...M}),[w,z,h,D,M])})({...n});return e(b.Provider,{value:o,children:t})},y=v.forwardRef(function({children:n,asChild:o=!1,...s},r){const{refs:a,getReferenceProps:i,open:l,onOpenChange:c}=R(),p=n.ref,d=t([a.setReference,r,p]);return o&&v.isValidElement(n)?v.cloneElement(n,i({ref:d,...s,...n.props})):e("button",{ref:d,onClick:()=>c?.(!l),"aria-expanded":l,...i({...s,className:h("jkl-popover-trigger",s.className)}),children:n})}),C=v.forwardRef(function({style:s,className:r,padding:a=0,initialFocus:i=0,returnFocus:l=!0,...c},p){const{context:d,modal:u,refs:f,open:m,floatingStyles:g,getFloatingProps:b,isPositioned:k}=R(),y=t([f.setFloating,p]),C=f.reference.current,{theme:F,size:P}=x((O=C)&&"contextElement"in O?C.contextElement:C),E=v.useRef(null);var O;return v.useEffect(()=>{E.current=d.elements.domReference?.closest("[data-portal]")||document.body},[d.elements.domReference]),m?e(n,{root:E.current,children:e(o,{context:d,modal:u,initialFocus:i,returnFocus:l,children:e("div",{"data-theme":F,"data-size":P,className:h("jkl jkl-popover",r),ref:y,style:{...s,...g,"--popover-padding":`var(--jkl-spacing-${a})`,visibility:u||k?"visible":"hidden"},...b(c),children:c.children})})}):null});k.Trigger=y,k.Content=C;export{k as Popover,k as default};
 //# sourceMappingURL=Popover.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import {\n    FloatingFocusManager,\n    FloatingPortal,\n    type ReferenceElement,\n    type VirtualElement,\n    autoUpdate,\n    flip,\n    offset,\n    shift,\n    useClick,\n    useDismiss,\n    useFloating,\n    useFocus,\n    useHover,\n    useInteractions,\n    useMergeRefs,\n    useRole,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { getThemeAndSize } from \"../../utilities/getThemeAndSize.js\";\nimport type { PopoverOptions } from \"./types.js\";\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    onPlacementChange,\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    // useLayoutEffect (i stedet for useEffect) sikrer at konsumenter får\n    // riktig placement før paint — ellers ville første frame bruke default\n    // placement og deretter snappe over til den faktiske, noe som gir et\n    // synlig \"glitch\" på styling som er placement-avhengig (f.eks. flat side\n    // / border-radius på Select-listboxen ved flip).\n    React.useLayoutEffect(() => {\n        if (!open) return;\n        onPlacementChange?.(data.placement);\n    }, [open, data.placement, onPlacementChange]);\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({\n                ...props,\n                className: clsx(\"jkl-popover-trigger\", props.className),\n            })}\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 {\n        context,\n        modal,\n        refs,\n        open,\n        floatingStyles,\n        getFloatingProps,\n        isPositioned,\n    } = usePopoverContext();\n    const ref = useMergeRefs([refs.setFloating, propRef]);\n\n    const referenceElement = refs.reference.current as ReferenceElement;\n\n    const { theme, size } = isCustomPositioned(referenceElement)\n        ? getThemeAndSize(referenceElement.contextElement)\n        : getThemeAndSize(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. Issue: https://github.com/fremtind/jokul/issues/4356\n    React.useEffect(() => {\n        floatingPortalRef.current =\n            context.elements.domReference?.closest<HTMLElement>(\n                \"[data-portal]\",\n            ) || document.body;\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-size={size}\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                            // Skjul popoveren inntil floating-ui har regnet\n                            // ut første posisjon — ellers blinker den\n                            // kort i (0,0) før den hopper på plass.\n                            // Bare for ikke-modale popovere; modale bruker\n                            // umiddelbar fokus-trap som forutsetter at\n                            // innholdet er fokuserbart fra første render.\n                            visibility:\n                                modal || isPositioned ? \"visible\" : \"hidden\",\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","onPlacementChange","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","className","clsx","PopoverContent","style","initialFocus","returnFocus","floatingStyles","getFloatingProps","isPositioned","setFloating","referenceElement","reference","theme","size","getThemeAndSize","contextElement","floatingPortalRef","useRef","useEffect","elements","domReference","closest","document","body","FloatingPortal","root","FloatingFocusManager","visibility","Trigger","Content"],"mappings":"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"}
+{"version":3,"file":"Popover.js","sources":["../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import {\n    FloatingFocusManager,\n    FloatingPortal,\n    type ReferenceElement,\n    type VirtualElement,\n    autoUpdate,\n    flip,\n    offset,\n    shift,\n    size,\n    useClick,\n    useDismiss,\n    useFloating,\n    useFocus,\n    useHover,\n    useInteractions,\n    useMergeRefs,\n    useRole,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport { getThemeAndSize } from \"../../utilities/getThemeAndSize.js\";\nimport type { PopoverOptions } from \"./types.js\";\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    onPlacementChange,\n    matchReferenceWidth = false,\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            ...(matchReferenceWidth\n                ? [\n                      size({\n                          apply({ rects, elements }) {\n                              elements.floating.style.width = `${rects.reference.width}px`;\n                          },\n                      }),\n                  ]\n                : []),\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    // useLayoutEffect (i stedet for useEffect) sikrer at konsumenter får\n    // riktig placement før paint — ellers ville første frame bruke default\n    // placement og deretter snappe over til den faktiske, noe som gir et\n    // synlig \"glitch\" på styling som er placement-avhengig (f.eks. flat side\n    // / border-radius på Select-listboxen ved flip).\n    React.useLayoutEffect(() => {\n        if (!open) return;\n        onPlacementChange?.(data.placement);\n    }, [open, data.placement, onPlacementChange]);\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({\n                ...props,\n                className: clsx(\"jkl-popover-trigger\", props.className),\n            })}\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 {\n        context,\n        modal,\n        refs,\n        open,\n        floatingStyles,\n        getFloatingProps,\n        isPositioned,\n    } = usePopoverContext();\n    const ref = useMergeRefs([refs.setFloating, propRef]);\n\n    const referenceElement = refs.reference.current as ReferenceElement;\n\n    const { theme, size } = isCustomPositioned(referenceElement)\n        ? getThemeAndSize(referenceElement.contextElement)\n        : getThemeAndSize(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. Issue: https://github.com/fremtind/jokul/issues/4356\n    React.useEffect(() => {\n        floatingPortalRef.current =\n            context.elements.domReference?.closest<HTMLElement>(\n                \"[data-portal]\",\n            ) || document.body;\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-size={size}\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                            // Skjul popoveren inntil floating-ui har regnet\n                            // ut første posisjon — ellers blinker den\n                            // kort i (0,0) før den hopper på plass.\n                            // Bare for ikke-modale popovere; modale bruker\n                            // umiddelbar fokus-trap som forutsetter at\n                            // innholdet er fokuserbart fra første render.\n                            visibility:\n                                modal || isPositioned ? \"visible\" : \"hidden\",\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","onPlacementChange","matchReferenceWidth","hoverOptions","focusOptions","clickOptions","roleOptions","dismissOptions","uncontrolledOpen","setUncontrolledOpen","useState","data","useFloating","middleware","flip","padding","fallbackPlacements","shift","size","apply","rects","elements","floating","style","width","reference","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","className","clsx","PopoverContent","initialFocus","returnFocus","floatingStyles","getFloatingProps","isPositioned","setFloating","referenceElement","theme","getThemeAndSize","contextElement","floatingPortalRef","useRef","useEffect","domReference","closest","document","body","FloatingPortal","root","FloatingFocusManager","visibility","Trigger","Content"],"mappings":"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"}

package/build/es/components/popover/types.d.ts

@@ -65,6 +65,16 @@ export interface PopoverOptions {
      * popoveren ligger over eller under referansen.
      */
     onPlacementChange?: (placement: Placement) => void;
+    /**
+     * Setter bredden på popoveren lik bredden på referanse-elementet.
+     * Referanse-elementet er vanligvis `Popover.Trigger`, men kan overstyres
+     * med `positionReference`.
+     *
+     * @see https://floating-ui.com/docs/size#match-reference-width
+     *
+     * @default false
+     */
+    matchReferenceWidth?: boolean;
     /**
      * Options for hover-interaksjoner.
      *

package/build/es/components/select/Select.js

@@ -1,2 +1,2 @@
-import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import n,{forwardRef as a,useState as l,useCallback as s,useMemo as i,useRef as c,useEffect as u}from"react";import{useId as p}from"../../hooks/useId/useId.js";import{useListNavigation as d}from"../../hooks/useListNavigation/useListNavigation.js";import{usePreviousValue as v}from"../../hooks/usePreviousValue/usePreviousValue.js";import{getValuePair as m}from"../../utilities/valuePair.js";import{ArrowVerticalAnimated as f}from"../icon/icons/animated/ArrowVerticalAnimated.js";import{InputGroup as b}from"../input-group/InputGroup.js";import{Popover as h}from"../popover/Popover.js";import{focusSelected as g,toLower as k}from"./select-utils.js";const y=()=>{},w=a((a,w)=>{const{id:j,name:_,items:P,value:D,label:E,labelProps:$,onChange:L,onBlur:N,onFocus:x,className:C,helpLabel:F,errorLabel:A,invalid:S,searchable:V=!1,inline:T=!1,defaultPrompt:I="Velg",width:O,maxShownOptions:K=5,style:B,tooltip:M,...q}=a,z=p(j||"jkl-select",{generateSuffix:!j}),G=`${z}_label`,R=`${z}_button`,U=`${z}_search-input`,W=`--${z.replace(/[^a-zA-Z0-9-]/g,"-")}-anchor`,[Z,H]=l(!1),J=s(()=>{H(e=>!e)},[]),[Q,X]=l("bottom"),Y=s(e=>{X(e.startsWith("top")?"top":"bottom")},[]),ee=!!V,te=ee&&Z,[re,oe]=l(""),ne=s(e=>!!e.label.toLowerCase().includes(re.toLowerCase())||"function"==typeof V&&V(re,e),[V,re]),ae=i(()=>P.map(m).map(e=>{const t=!ee||""===re||ne(e);return{...e,visible:t}}),[P,ee,re,ne]),le=i(()=>!(typeof D>"u")&&P.some(e=>"string"==typeof e?e===D:e.value===D),[D,P]),[se,ie]=l(le&&void 0!==D?D:""),ce=""!==se,ue=i(()=>ae.find(e=>e.value===se)?.label||I,[ae,se,I]),pe=c(null),de=s(e=>{pe.current=e,w&&("function"==typeof w?w(e):w.current=e),e&&ie(e.value)},[w]),ve=v(D);u(()=>{D!==ve&&ie(typeof D>"u"||!le?"":D)},[D,ve,le]);const me=s(e=>{const t=e.value;oe(""),ie(t),J(),ke.current?.focus()},[J]),fe=v(se);u(()=>{typeof fe>"u"||fe===se||se===D||(L&&L({type:"change",target:{name:_,value:se}}),pe.current&&pe.current.dispatchEvent(new Event("change",{bubbles:!0})))},[L,_,D,se,fe]);const be=c(null),he=c(!1),ge=c(null),ke=c(null),ye=c(null),[we,je]=l(null),_e=c(ee),Pe=c(se);u(()=>{_e.current=ee,Pe.current=se});const De=s(e=>{ye.current=e,je(e),e&&!_e.current&&requestAnimationFrame(()=>{ye.current===e&&g(e,Pe.current)})},[]),Ee=v(Z);u(()=>{Z!==Ee&&(Z&&ee?ge.current?.focus():!Z&&he.current&&ke.current&&ke.current.focus())},[Z,Ee,ee]),d({element:we});const $e=s(()=>{ee&&oe(""),N&&(N({type:"blur",target:{name:_,value:se}}),pe.current?.dispatchEvent(new Event("focusout",{bubbles:!0}))),he.current=!1,H(!1)},[N,ee,_,se]),Le=s(e=>{const t=be.current,r=ye.current;t?.contains(e.relatedTarget)||r?.contains(e.relatedTarget)||$e()},[$e]),Ne=s(()=>{he.current||(x&&x({type:"change",target:{name:_,value:se}}),he.current=!0)},[x,se,_]),xe=s(e=>{e.target.focus({preventScroll:!0})},[]);u(()=>{const e=pe.current;if(!e)return;const t=()=>{te?ge.current?.focus():ke.current?.focus()},r=e=>{const t=e.relatedTarget,r=be.current?.contains(t),o=ye.current?.contains(t);(r||o)&&e.preventDefault()};return e.addEventListener("focus",t),e.addEventListener("blur",r),()=>{e.removeEventListener("focus",t),e.removeEventListener("blur",r)}},[te]);const Ce=s(e=>{"ArrowDown"!==e.key&&" "!==e.key||Z?"Escape"===e.key&&(e.preventDefault(),e.stopPropagation(),H(!1)):(e.preventDefault(),e.stopPropagation(),H(!0))},[Z]),Fe=s(e=>{if("ArrowDown"===e.key){e.preventDefault(),e.stopPropagation();const t=ye.current;t&&g(t,ee?void 0:se)}else if("Escape"===e.key)e.preventDefault(),e.stopPropagation(),H(!1);else if("Tab"!==e.key||e.shiftKey)"Enter"===e.key&&Z&&(e.preventDefault(),e.stopPropagation());else{const t=ye.current;t&&(e.preventDefault(),e.stopPropagation(),g(t,se))}},[se,ee,Z]),Ae=s(e=>{if("Tab"===e.key)e.preventDefault(),e.stopPropagation(),e.shiftKey&&ge.current?ge.current.focus():ke.current&&(ie(e.currentTarget.value),H(!1),ke.current.focus());else if("ArrowUp"===e.key&&ye.current&&ge.current){const t=ye.current.querySelector('[role="option"]:not([hidden])');e.currentTarget.id===t?.id&&ge.current&&ge.current.focus()}},[]);return u(()=>{const e=e=>{"Escape"===e.key&&Z&&H(!1)};return typeof window<"u"&&Z&&window.addEventListener("keydown",e),()=>{typeof window<"u"&&window.removeEventListener("keydown",e)}},[Z]),e(t,{children:[e("select",{name:_,tabIndex:-1,"data-testid":"jkl-native-select",className:"jkl-sr-only","aria-hidden":!0,ref:de,value:se,onChange:y,children:[r("option",{value:""})," ",ae.map(e=>r("option",{hidden:!e.visible,value:e.value,children:e.label},`${z}-opt-${e.value}`))]}),r(b,{ref:be,"data-testid":"jkl-select",className:o("jkl-select",C,{"jkl-select--inline":T,"jkl-select--open":Z&&ae.some(e=>e.visible),"jkl-select--no-value":!ce,"jkl-select--invalid":!!A||S}),tooltip:M&&n.isValidElement(M)?n.cloneElement(M,{triggerProps:{...M.props.triggerProps,onFocus:e=>{M.props.triggerProps?.onFocus?.(e),$e()}}}):null,...q,id:ee?U:R,style:B,label:E,labelProps:{id:G,srOnly:T,...$,htmlFor:ee?U:R},helpLabel:F,errorLabel:A,render:({"aria-invalid":t,...n})=>{const a=Z&&ae.some(e=>e.visible);return e(h,{open:a,placement:"bottom-start",offset:0,modal:!1,onPlacementChange:Y,clickOptions:{enabled:!1},dismissOptions:{enabled:!1},roleOptions:{enabled:!1},children:[r(h.Trigger,{asChild:!0,children:e("div",{className:"jkl-select__outer-wrapper","data-popover-placement":Q,style:{width:O,anchorName:W},children:[ee&&r("input",{...n,"aria-invalid":t,id:U,hidden:!te,ref:ge,placeholder:"Søk",value:re,onChange:e=>oe(e.target.value),"data-testid":"jkl-select__search-input",className:"jkl-select__search-input","aria-autocomplete":"list","aria-activedescendant":a&&ce?`${z}__${k(se)}`:void 0,"aria-controls":a?z:void 0,"aria-expanded":a,role:"combobox",onKeyDown:Fe,onBlur:Le,onFocus:Ne,onClick:e=>{e.stopPropagation()}}),r("button",{"aria-invalid":t,...n,id:R,ref:ke,hidden:te,type:"button",name:`${_}-btn`,className:o("jkl-select__button",{"jkl-select__button--active-value":!!se}),"data-testid":"jkl-select__button","aria-label":`${ue||"Velg"},${E}`,"aria-expanded":a,"aria-controls":a?z:void 0,onBlur:Le,onFocus:Ne,onKeyDown:Ce,onClick:J,onMouseDown:e=>{e.preventDefault(),ke.current?.focus()},children:ue}),r(f,{variant:"medium",pointingDown:!a,className:"jkl-select__arrow"})]})}),r(h.Content,{initialFocus:-1,returnFocus:!1,className:"jkl-select__popover",style:{width:`anchor-size(${W} width)`},children:r("div",{id:z,ref:De,role:"listbox",className:"jkl-select__options-menu","data-popover-placement":Q,"aria-labelledby":G,tabIndex:-1,"data-focus":"controlled",style:{"--jkl-select-max-shown-options":K},children:ae.map((t,o)=>t.visible?e("button",{hidden:!t.visible,type:"button",id:`${z}__${k(t.value)}`,className:"jkl-select__option","data-testid":"jkl-select__option","aria-selected":t.value===se,role:"option",value:t.value,"data-testautoid":`jkl-select__option-${o}`,onBlur:Le,onFocus:Ne,onKeyDown:Ae,onClick:e=>{e.preventDefault(),me(t)},onMouseOver:xe,children:[t.label,t.description?r("span",{className:"jkl-select__option-description",children:t.description}):null]},`${z}-${t.value}`):null)})})]})}})]})});w.displayName="Select";export{w as Select};
+import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import n,{forwardRef as a,useState as l,useCallback as s,useMemo as i,useRef as c,useEffect as u}from"react";import{useId as p}from"../../hooks/useId/useId.js";import{useListNavigation as d}from"../../hooks/useListNavigation/useListNavigation.js";import{usePreviousValue as v}from"../../hooks/usePreviousValue/usePreviousValue.js";import{getValuePair as m}from"../../utilities/valuePair.js";import{ArrowVerticalAnimated as f}from"../icon/icons/animated/ArrowVerticalAnimated.js";import{InputGroup as b}from"../input-group/InputGroup.js";import{Popover as h}from"../popover/Popover.js";import{focusSelected as g,toLower as k}from"./select-utils.js";const y=()=>{},j=a((a,j)=>{const{id:w,name:_,items:P,value:D,label:E,labelProps:L,onChange:N,onBlur:$,onFocus:x,className:C,helpLabel:F,errorLabel:S,invalid:V,searchable:A=!1,inline:T=!1,defaultPrompt:I="Velg",width:O,maxShownOptions:K=5,style:B,tooltip:M,...R}=a,q=p(w||"jkl-select",{generateSuffix:!w}),G=`${q}_label`,W=`${q}_button`,U=`${q}_search-input`,[z,H]=l(!1),J=s(()=>{H(e=>!e)},[]),[Q,X]=l("bottom"),Y=s(e=>{X(e.startsWith("top")?"top":"bottom")},[]),Z=!!A,ee=Z&&z,[te,re]=l(""),oe=s(e=>!!e.label.toLowerCase().includes(te.toLowerCase())||"function"==typeof A&&A(te,e),[A,te]),ne=i(()=>P.map(m).map(e=>{const t=!Z||""===te||oe(e);return{...e,visible:t}}),[P,Z,te,oe]),ae=i(()=>!(typeof D>"u")&&P.some(e=>"string"==typeof e?e===D:e.value===D),[D,P]),[le,se]=l(ae&&void 0!==D?D:""),ie=""!==le,ce=i(()=>ne.find(e=>e.value===le)?.label||I,[ne,le,I]),ue=c(null),pe=s(e=>{ue.current=e,j&&("function"==typeof j?j(e):j.current=e),e&&se(e.value)},[j]),de=v(D);u(()=>{D!==de&&se(typeof D>"u"||!ae?"":D)},[D,de,ae]);const ve=s(e=>{const t=e.value;re(""),se(t),J(),ge.current?.focus()},[J]),me=v(le);u(()=>{typeof me>"u"||me===le||le===D||(N&&N({type:"change",target:{name:_,value:le}}),ue.current&&ue.current.dispatchEvent(new Event("change",{bubbles:!0})))},[N,_,D,le,me]);const fe=c(null),be=c(!1),he=c(null),ge=c(null),ke=c(null),[ye,je]=l(null),we=c(Z),_e=c(le);u(()=>{we.current=Z,_e.current=le});const Pe=s(e=>{ke.current=e,je(e),e&&!we.current&&requestAnimationFrame(()=>{ke.current===e&&g(e,_e.current)})},[]),De=v(z);u(()=>{z!==De&&(z&&Z?he.current?.focus():!z&&be.current&&ge.current&&ge.current.focus())},[z,De,Z]),d({element:ye});const Ee=s(()=>{Z&&re(""),$&&($({type:"blur",target:{name:_,value:le}}),ue.current?.dispatchEvent(new Event("focusout",{bubbles:!0}))),be.current=!1,H(!1)},[$,Z,_,le]),Le=s(e=>{const t=fe.current,r=ke.current;t?.contains(e.relatedTarget)||r?.contains(e.relatedTarget)||Ee()},[Ee]),Ne=s(()=>{be.current||(x&&x({type:"change",target:{name:_,value:le}}),be.current=!0)},[x,le,_]),$e=s(e=>{e.target.focus({preventScroll:!0})},[]);u(()=>{const e=ue.current;if(!e)return;const t=()=>{ee?he.current?.focus():ge.current?.focus()},r=e=>{const t=e.relatedTarget,r=fe.current?.contains(t),o=ke.current?.contains(t);(r||o)&&e.preventDefault()};return e.addEventListener("focus",t),e.addEventListener("blur",r),()=>{e.removeEventListener("focus",t),e.removeEventListener("blur",r)}},[ee]);const xe=s(e=>{"ArrowDown"!==e.key&&" "!==e.key||z?"Escape"===e.key&&(e.preventDefault(),e.stopPropagation(),H(!1)):(e.preventDefault(),e.stopPropagation(),H(!0))},[z]),Ce=s(e=>{if("ArrowDown"===e.key){e.preventDefault(),e.stopPropagation();const t=ke.current;t&&g(t,Z?void 0:le)}else if("Escape"===e.key)e.preventDefault(),e.stopPropagation(),H(!1);else if("Tab"!==e.key||e.shiftKey)"Enter"===e.key&&z&&(e.preventDefault(),e.stopPropagation());else{const t=ke.current;t&&(e.preventDefault(),e.stopPropagation(),g(t,le))}},[le,Z,z]),Fe=s(e=>{if("Tab"===e.key)e.preventDefault(),e.stopPropagation(),e.shiftKey&&he.current?he.current.focus():ge.current&&(se(e.currentTarget.value),H(!1),ge.current.focus());else if("ArrowUp"===e.key&&ke.current&&he.current){const t=ke.current.querySelector('[role="option"]:not([hidden])');e.currentTarget.id===t?.id&&he.current&&he.current.focus()}},[]);return u(()=>{const e=e=>{"Escape"===e.key&&z&&H(!1)};return typeof window<"u"&&z&&window.addEventListener("keydown",e),()=>{typeof window<"u"&&window.removeEventListener("keydown",e)}},[z]),e(t,{children:[e("select",{name:_,tabIndex:-1,"data-testid":"jkl-native-select",className:"jkl-sr-only","aria-hidden":!0,ref:pe,value:le,onChange:y,children:[r("option",{value:""})," ",ne.map(e=>r("option",{hidden:!e.visible,value:e.value,children:e.label},`${q}-opt-${e.value}`))]}),r(b,{ref:fe,"data-testid":"jkl-select",className:o("jkl-select",C,{"jkl-select--inline":T,"jkl-select--open":z&&ne.some(e=>e.visible),"jkl-select--no-value":!ie,"jkl-select--invalid":!!S||V}),tooltip:M&&n.isValidElement(M)?n.cloneElement(M,{triggerProps:{...M.props.triggerProps,onFocus:e=>{M.props.triggerProps?.onFocus?.(e),Ee()}}}):null,...R,id:Z?U:W,style:B,label:E,labelProps:{id:G,srOnly:T,...L,htmlFor:Z?U:W},helpLabel:F,errorLabel:S,render:({"aria-invalid":t,...n})=>{const a=z&&ne.some(e=>e.visible);return e(h,{open:a,placement:"bottom-start",offset:0,modal:!1,onPlacementChange:Y,matchReferenceWidth:!0,clickOptions:{enabled:!1},dismissOptions:{enabled:!1},roleOptions:{enabled:!1},children:[r(h.Trigger,{asChild:!0,children:e("div",{className:"jkl-select__outer-wrapper","data-popover-placement":Q,style:{width:O},children:[Z&&r("input",{...n,"aria-invalid":t,id:U,hidden:!ee,ref:he,placeholder:"Søk",value:te,onChange:e=>re(e.target.value),"data-testid":"jkl-select__search-input",className:"jkl-select__search-input","aria-autocomplete":"list","aria-activedescendant":a&&ie?`${q}__${k(le)}`:void 0,"aria-controls":a?q:void 0,"aria-expanded":a,role:"combobox",onKeyDown:Ce,onBlur:Le,onFocus:Ne,onClick:e=>{e.stopPropagation()}}),r("button",{"aria-invalid":t,...n,id:W,ref:ge,hidden:ee,type:"button",name:`${_}-btn`,className:o("jkl-select__button",{"jkl-select__button--active-value":!!le}),"data-testid":"jkl-select__button","aria-label":`${ce||"Velg"},${E}`,"aria-expanded":a,"aria-controls":a?q:void 0,onBlur:Le,onFocus:Ne,onKeyDown:xe,onClick:J,onMouseDown:e=>{e.preventDefault(),ge.current?.focus()},children:ce}),r(f,{variant:"medium",pointingDown:!a,className:"jkl-select__arrow"})]})}),r(h.Content,{initialFocus:-1,returnFocus:!1,className:"jkl-select__popover",children:r("div",{id:q,ref:Pe,role:"listbox",className:"jkl-select__options-menu","data-popover-placement":Q,"aria-labelledby":G,tabIndex:-1,"data-focus":"controlled",style:{"--jkl-select-max-shown-options":K},children:ne.map((t,o)=>t.visible?e("button",{hidden:!t.visible,type:"button",id:`${q}__${k(t.value)}`,className:"jkl-select__option","data-testid":"jkl-select__option","aria-selected":t.value===le,role:"option",value:t.value,"data-testautoid":`jkl-select__option-${o}`,onBlur:Le,onFocus:Ne,onKeyDown:Fe,onClick:e=>{e.preventDefault(),ve(t)},onMouseOver:$e,children:[t.label,t.description?r("span",{className:"jkl-select__option-description",children:t.description}):null]},`${q}-${t.value}`):null)})})]})}})]})});j.displayName="Select";export{j as Select};
 //# sourceMappingURL=Select.js.map

package/build/es/components/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../src/components/select/Select.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type CSSProperties,\n    type FocusEvent,\n    forwardRef,\n    type KeyboardEvent,\n    type MouseEvent,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { useListNavigation } from \"../../hooks/useListNavigation/useListNavigation.js\";\nimport { usePreviousValue } from \"../../hooks/usePreviousValue/usePreviousValue.js\";\nimport { type ValuePair, getValuePair } from \"../../utilities/valuePair.js\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport Popover from \"../popover/Popover.js\";\nimport type { PopupTipProps } from \"../tooltip/types.js\";\nimport { focusSelected, toLower } from \"./select-utils.js\";\nimport type { SelectProps } from \"./types.js\";\n\nconst noop = () => {\n    return;\n};\n\ninterface Option extends ValuePair {\n    visible: boolean;\n}\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n    (props, forwardedSelectRef) => {\n        const {\n            id,\n            name,\n            items,\n            value,\n            label,\n            labelProps,\n            onChange,\n            onBlur,\n            onFocus,\n            className,\n            helpLabel,\n            errorLabel,\n            invalid,\n            searchable = false,\n            inline = false,\n            defaultPrompt = \"Velg\",\n            width,\n            maxShownOptions = 5,\n            style,\n            tooltip,\n            ...rest\n        } = props;\n\n        const listId = useId(id || \"jkl-select\", { generateSuffix: !id });\n        const labelId = `${listId}_label`;\n        const buttonId = `${listId}_button`;\n        const searchInputId = `${listId}_search-input`;\n        // Unik anchor-name som CSS anchor positioning bruker for å la\n        // dropdown-listen matche bredden til triggeren.\n        const anchorName = `--${listId.replace(/[^a-zA-Z0-9-]/g, \"-\")}-anchor`;\n\n        const [dropdownIsShown, setShown] = useState(false);\n        const toggleListVisibility = useCallback(() => {\n            setShown((previousValue) => !previousValue);\n        }, []);\n\n        // Lagrer faktisk placement etter at floating-ui har kjørt `flip`,\n        // slik at vi kan bytte hvilken side av lista og knappen som er\n        // flat når lista snus over triggeren.\n        const [popoverPlacement, setPopoverPlacement] = useState<\n            \"top\" | \"bottom\"\n        >(\"bottom\");\n        const handlePlacementChange = useCallback((p: string) => {\n            setPopoverPlacement(p.startsWith(\"top\") ? \"top\" : \"bottom\");\n        }, []);\n\n        /// Søk\n\n        const isSearchable = Boolean(searchable);\n        const showSearchInputField = isSearchable && dropdownIsShown;\n        const [searchValue, setSearchValue] = useState(\"\");\n        const searchFn = useCallback(\n            (item: ValuePair) => {\n                if (\n                    item.label.toLowerCase().includes(searchValue.toLowerCase())\n                ) {\n                    return true;\n                }\n\n                if (typeof searchable === \"function\") {\n                    return searchable(searchValue, item);\n                }\n\n                return false;\n            },\n            [searchable, searchValue],\n        );\n        const visibleItems: Option[] = useMemo(\n            () =>\n                items.map(getValuePair).map((item) => {\n                    const visible =\n                        !isSearchable || searchValue === \"\" || searchFn(item);\n                    return { ...item, visible };\n                }),\n            [items, isSearchable, searchValue, searchFn],\n        );\n        const valueIsInItems: boolean = useMemo(() => {\n            if (typeof value === \"undefined\") {\n                return false;\n            }\n            return items.some((item) =>\n                typeof item === \"string\"\n                    ? item === value\n                    : item.value === value,\n            );\n        }, [value, items]);\n\n        /// Valg av <option>\n\n        const [selectedValue, setSelectedValue] = useState<string>(\n            valueIsInItems && value !== undefined ? value : \"\",\n        );\n        const hasSelectedValue = selectedValue !== \"\";\n        const selectedValueLabel = useMemo(\n            () =>\n                visibleItems.find((item) => item.value === selectedValue)\n                    ?.label || defaultPrompt,\n            [visibleItems, selectedValue, defaultPrompt],\n        );\n\n        const selectRef = useRef<HTMLSelectElement | null>(null);\n        // Hjelpefunksjon som gjør det enklere å forwarde refen og å bruke den selv internt\n        const unifiedSelectRef = useCallback(\n            (instance: HTMLSelectElement | null) => {\n                selectRef.current = instance;\n                if (forwardedSelectRef) {\n                    if (typeof forwardedSelectRef === \"function\") {\n                        forwardedSelectRef(instance);\n                    } else {\n                        forwardedSelectRef.current = instance;\n                    }\n                }\n                if (instance) {\n                    setSelectedValue(instance.value);\n                }\n            },\n            [forwardedSelectRef],\n        );\n\n        const previousValue = usePreviousValue(value);\n        useEffect(() => {\n            if (value === previousValue) {\n                return;\n            }\n            if (typeof value === \"undefined\" || !valueIsInItems) {\n                setSelectedValue(\"\");\n            } else {\n                setSelectedValue(value);\n            }\n        }, [value, previousValue, valueIsInItems]);\n\n        const selectOption = useCallback(\n            (item: Option) => {\n                const nextValue = item.value;\n                setSearchValue(\"\");\n                setSelectedValue(nextValue);\n                toggleListVisibility();\n                buttonRef.current?.focus();\n            },\n            [toggleListVisibility],\n        );\n\n        // La komponenten rendre <select> med den valgte verdien før onChange trigges, slik at\n        // react-hook-form@>7.41.1 behandler feltet som at det har en verdi.\n        const previousSelectedValue = usePreviousValue(selectedValue);\n        useEffect(() => {\n            // previousSelectedValue er undefined på første render, men da vil vi ikke ha en onChange uansett\n            if (\n                typeof previousSelectedValue === \"undefined\" ||\n                previousSelectedValue === selectedValue ||\n                selectedValue === value\n            ) {\n                return;\n            }\n            if (onChange) {\n                onChange({\n                    type: \"change\",\n                    target: { name, value: selectedValue },\n                });\n            }\n            if (selectRef.current) {\n                selectRef.current.dispatchEvent(\n                    new Event(\"change\", { bubbles: true }),\n                );\n            }\n        }, [onChange, name, value, selectedValue, previousSelectedValue]);\n\n        /// Fokushåndtering\n\n        const componentRootElementRef = useRef<HTMLDivElement>(null);\n        const focusInsideRef = useRef(false);\n        const searchFieldRef = useRef<HTMLInputElement>(null);\n        const buttonRef = useRef<HTMLButtonElement>(null);\n\n        const dropdownRef = useRef<HTMLDivElement | null>(null);\n        // Lagrer listbox-elementet i state slik at downstream-hooks\n        // (f.eks. `useListNavigation`) kan re-feste listeneren idet\n        // `FloatingPortal` mounter listen.\n        const [listboxEl, setListboxEl] = useState<HTMLDivElement | null>(null);\n\n        // Listen rendres i en `FloatingPortal` som monteres via en\n        // `useLayoutEffect` + `setState` i floating-ui. Refen er derfor\n        // ikke tilgjengelig før i en senere render. Vi bruker en\n        // callback-ref for å plassere fokus på valgt option idet listen\n        // faktisk er i DOM-en. Refen holdes stabil (tom dependency-list)\n        // slik at en endring i `selectedValue`/`isSearchable` ikke får\n        // React til å avmontere/remontere refen og dermed flytte fokus\n        // mens menyen er åpen — vi leser siste verdier via refs.\n        const isSearchableRef = useRef(isSearchable);\n        const selectedValueRef = useRef(selectedValue);\n        useEffect(() => {\n            isSearchableRef.current = isSearchable;\n            selectedValueRef.current = selectedValue;\n        });\n\n        const setDropdownRef = useCallback((node: HTMLDivElement | null) => {\n            dropdownRef.current = node;\n            setListboxEl(node);\n            if (node && !isSearchableRef.current) {\n                // Popover skjules med `visibility: hidden` til\n                // floating-ui har regnet ut første posisjon. Defer\n                // fokus til etter neste paint, slik at vi ikke flytter\n                // fokus til et usynlig element (kan gi manglende\n                // fokusindikator i enkelte nettlesere).\n                requestAnimationFrame(() => {\n                    if (dropdownRef.current === node) {\n                        focusSelected(node, selectedValueRef.current);\n                    }\n                });\n            }\n        }, []);\n\n        // Søkbart felt og knappen som får fokus ved lukking lever i hoved-\n        // DOM-en, så for de tilfellene holder en useEffect.\n        const wasShown = usePreviousValue(dropdownIsShown);\n        useEffect(() => {\n            if (dropdownIsShown === wasShown) return;\n            if (dropdownIsShown && isSearchable) {\n                searchFieldRef.current?.focus();\n            } else if (\n                !dropdownIsShown &&\n                focusInsideRef.current &&\n                buttonRef.current\n            ) {\n                buttonRef.current.focus();\n            }\n        }, [dropdownIsShown, wasShown, isSearchable]);\n\n        useListNavigation({ element: listboxEl });\n\n        const close = useCallback(() => {\n            if (isSearchable) {\n                setSearchValue(\"\");\n            }\n            if (onBlur) {\n                onBlur({\n                    type: \"blur\",\n                    target: { name, value: selectedValue },\n                });\n                selectRef.current?.dispatchEvent(\n                    new Event(\"focusout\", { bubbles: true }),\n                );\n            }\n            focusInsideRef.current = false;\n            setShown(false);\n        }, [onBlur, isSearchable, name, selectedValue]);\n\n        const handleBlur = useCallback(\n            (e: FocusEvent<HTMLButtonElement | HTMLInputElement>) => {\n                const componentRootElement = componentRootElementRef.current;\n                const dropdownElement = dropdownRef.current;\n                // There are known issues in Firefox when using \"relatedTarget\" in onBlur events:\n                // https://github.com/facebook/react/issues/2011\n                // This might be fixed in react 17. Se issue above.\n                // Dropdown rendres i en portal, så vi må sjekke begge trærne\n                // for å avgjøre om fokus blir værende inne i komponenten.\n                const nextFocusIsInsideComponent =\n                    componentRootElement?.contains(e.relatedTarget as Node) ||\n                    dropdownElement?.contains(e.relatedTarget as Node);\n                if (!nextFocusIsInsideComponent) {\n                    close();\n                }\n            },\n            [close],\n        );\n\n        const handleFocus = useCallback(() => {\n            if (!focusInsideRef.current) {\n                if (onFocus) {\n                    onFocus({\n                        type: \"change\",\n                        target: { name, value: selectedValue },\n                    });\n                }\n                focusInsideRef.current = true;\n            }\n        }, [onFocus, selectedValue, name]);\n\n        const handleMouseOver = useCallback(\n            (e: MouseEvent<HTMLButtonElement>) => {\n                // Ved mouseOver på options flytter vi fokus til dem for å unngå \"dobbel fokus\"\n                // der det ser ut som to forskjellige elementer er fokusert/hovered samtidig\n                (e.target as HTMLButtonElement).focus({ preventScroll: true });\n            },\n            [],\n        );\n\n        // Handle focus and blur of hidden select element\n        useEffect(() => {\n            const select = selectRef.current;\n            if (!select) return;\n\n            const onSelectFocus = () => {\n                if (showSearchInputField) {\n                    searchFieldRef.current?.focus();\n                } else {\n                    buttonRef.current?.focus();\n                }\n            };\n            const onSelectBlur = (ev: globalThis.FocusEvent) => {\n                // Les refs ved hvert kall slik at vi alltid sjekker mot\n                // siste listbox-element — den portalerte listen kan ha\n                // mountet etter at denne effekten ble satt opp.\n                const target = ev.relatedTarget as Node | null;\n                const insideComponent =\n                    componentRootElementRef.current?.contains(target);\n                const insideDropdown = dropdownRef.current?.contains(target);\n                if (insideComponent || insideDropdown) {\n                    ev.preventDefault();\n                }\n            };\n\n            select.addEventListener(\"focus\", onSelectFocus);\n            select.addEventListener(\"blur\", onSelectBlur);\n            return () => {\n                select.removeEventListener(\"focus\", onSelectFocus);\n                select.removeEventListener(\"blur\", onSelectBlur);\n            };\n        }, [showSearchInputField]);\n\n        /// Tastaturnavigasjon\n\n        // Add support for opening dropdown with arrowkey down as expected from native select\n        // onKeyDown to stop ArrowDown from scrolling the page\n        const handleOnKeyDown = useCallback(\n            (e: KeyboardEvent<HTMLButtonElement>) => {\n                if (\n                    (e.key === \"ArrowDown\" || e.key === \" \") &&\n                    !dropdownIsShown\n                ) {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    setShown(true);\n                } else if (e.key === \"Escape\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    setShown(false);\n                }\n            },\n            [dropdownIsShown],\n        );\n\n        // onKeyDown to stop ArrowDown from scrolling the page\n        const handleSearchOnKeyDown = useCallback(\n            (e: KeyboardEvent<HTMLInputElement>) => {\n                if (e.key === \"ArrowDown\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    const listElement = dropdownRef.current;\n                    if (listElement) {\n                        if (isSearchable) {\n                            // Flytt fokus til det første elementet i listen, ikke det forrige valgte.\n                            // Ved endring i filter er det ikke gitt at vi ønsker å ta utgangspunkt i\n                            // den valgte verdien.\n                            focusSelected(listElement, undefined);\n                        } else {\n                            focusSelected(listElement, selectedValue);\n                        }\n                    }\n                } else if (e.key === \"Escape\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    setShown(false);\n                } else if (e.key === \"Tab\" && !e.shiftKey) {\n                    const listElement = dropdownRef.current;\n                    if (listElement) {\n                        e.preventDefault();\n                        e.stopPropagation();\n                        focusSelected(listElement, selectedValue);\n                    }\n                } else if (e.key === \"Enter\" && dropdownIsShown) {\n                    // Should not propagate Enter keyevent because form might submit\n                    e.preventDefault();\n                    e.stopPropagation();\n                }\n            },\n            [selectedValue, isSearchable, dropdownIsShown],\n        );\n\n        // onKeyDown so this Tab listener isn't triggered by tabbing from search field to option\n        const handleOptionOnKeyDown = useCallback(\n            (e: KeyboardEvent<HTMLButtonElement>) => {\n                if (e.key === \"Tab\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    if (e.shiftKey && searchFieldRef.current) {\n                        searchFieldRef.current.focus();\n                    } else if (buttonRef.current) {\n                        // Mimic behaviour of Firefox and native select, where Tab selects the current item and closes the menu\n                        setSelectedValue(e.currentTarget.value);\n                        setShown(false);\n                        buttonRef.current.focus();\n                    }\n                } else if (e.key === \"ArrowUp\") {\n                    if (dropdownRef.current && searchFieldRef.current) {\n                        // Can't be based on index since the first item might be filtered out\n                        const firstVisible = dropdownRef.current.querySelector(\n                            '[role=\"option\"]:not([hidden])',\n                        );\n                        if (\n                            e.currentTarget.id === firstVisible?.id &&\n                            searchFieldRef.current\n                        ) {\n                            searchFieldRef.current.focus();\n                        }\n                    }\n                }\n            },\n            [],\n        );\n\n        // Add support for closing the dropdown with Escape like native select. Unfortunately, Escape does not trigger the button onKeyDown.\n        useEffect(() => {\n            const handleEscape = (e: globalThis.KeyboardEvent) => {\n                if (e.key === \"Escape\" && dropdownIsShown) {\n                    setShown(false);\n                }\n            };\n            if (typeof window !== \"undefined\" && dropdownIsShown) {\n                window.addEventListener(\"keydown\", handleEscape);\n            }\n            return () => {\n                if (typeof window !== \"undefined\") {\n                    window.removeEventListener(\"keydown\", handleEscape);\n                }\n            };\n        }, [dropdownIsShown]);\n\n        return (\n            <>\n                <select\n                    name={name}\n                    tabIndex={-1}\n                    data-testid=\"jkl-native-select\"\n                    className=\"jkl-sr-only\"\n                    aria-hidden\n                    ref={unifiedSelectRef}\n                    value={selectedValue}\n                    onChange={noop} // React complains unless we give an onChange handler. This is technically a read-only field, but readOnly isn't an option here.\n                >\n                    <option value=\"\" />{\" \"}\n                    {/* Tom option må være et valg, ellers vil <select> alltid ha en value */}\n                    {visibleItems.map((item) => (\n                        <option\n                            key={`${listId}-opt-${item.value}`}\n                            hidden={!item.visible}\n                            value={item.value}\n                        >\n                            {item.label}\n                        </option>\n                    ))}\n                </select>\n                <InputGroup\n                    ref={componentRootElementRef}\n                    data-testid=\"jkl-select\"\n                    className={clsx(\"jkl-select\", className, {\n                        \"jkl-select--inline\": inline,\n                        \"jkl-select--open\":\n                            dropdownIsShown &&\n                            visibleItems.some((item) => item.visible),\n                        \"jkl-select--no-value\": !hasSelectedValue,\n                        \"jkl-select--invalid\": !!errorLabel || invalid,\n                    })}\n                    tooltip={\n                        tooltip && React.isValidElement<PopupTipProps>(tooltip)\n                            ? React.cloneElement(tooltip, {\n                                  triggerProps: {\n                                      ...tooltip.props.triggerProps,\n                                      onFocus: (\n                                          e: FocusEvent<HTMLButtonElement>,\n                                      ) => {\n                                          tooltip.props.triggerProps?.onFocus?.(\n                                              e,\n                                          );\n                                          close();\n                                      },\n                                  },\n                              })\n                            : null\n                    }\n                    {...rest}\n                    id={isSearchable ? searchInputId : buttonId}\n                    style={style}\n                    label={label}\n                    labelProps={{\n                        id: labelId,\n                        srOnly: inline,\n                        ...labelProps,\n                        htmlFor: isSearchable ? searchInputId : buttonId,\n                    }}\n                    helpLabel={helpLabel}\n                    errorLabel={errorLabel}\n                    render={({\n                        \"aria-invalid\": ariaInvalid,\n                        ...inputProps\n                    }) => {\n                        // Lista vises kun når dropdown er åpnet *og* det\n                        // finnes minst ett synlig valg. `aria-expanded` på\n                        // trigger og combobox må følge samme boolean for\n                        // ikke å lyve om popoverens tilstand.\n                        const isPopoverOpen =\n                            dropdownIsShown &&\n                            visibleItems.some((item) => item.visible);\n                        return (\n                            <Popover\n                                open={isPopoverOpen}\n                                placement=\"bottom-start\"\n                                offset={0}\n                                modal={false}\n                                onPlacementChange={handlePlacementChange}\n                                clickOptions={{ enabled: false }}\n                                dismissOptions={{ enabled: false }}\n                                roleOptions={{ enabled: false }}\n                            >\n                                <Popover.Trigger asChild>\n                                    <div\n                                        className=\"jkl-select__outer-wrapper\"\n                                        data-popover-placement={\n                                            popoverPlacement\n                                        }\n                                        style={\n                                            {\n                                                width,\n                                                anchorName,\n                                            } as CSSProperties\n                                        }\n                                    >\n                                        {isSearchable && (\n                                            <input\n                                                {...inputProps}\n                                                aria-invalid={ariaInvalid}\n                                                id={searchInputId}\n                                                hidden={!showSearchInputField}\n                                                ref={searchFieldRef}\n                                                placeholder=\"Søk\"\n                                                value={searchValue}\n                                                onChange={(e) =>\n                                                    setSearchValue(\n                                                        e.target.value,\n                                                    )\n                                                }\n                                                data-testid=\"jkl-select__search-input\"\n                                                className=\"jkl-select__search-input\"\n                                                aria-autocomplete=\"list\"\n                                                aria-activedescendant={\n                                                    isPopoverOpen &&\n                                                    hasSelectedValue\n                                                        ? `${listId}__${toLower(\n                                                              selectedValue,\n                                                          )}`\n                                                        : undefined\n                                                }\n                                                aria-controls={\n                                                    isPopoverOpen\n                                                        ? listId\n                                                        : undefined\n                                                }\n                                                aria-expanded={isPopoverOpen}\n                                                role=\"combobox\"\n                                                onKeyDown={\n                                                    handleSearchOnKeyDown\n                                                }\n                                                onBlur={handleBlur}\n                                                onFocus={handleFocus}\n                                                onClick={(e) => {\n                                                    e.stopPropagation();\n                                                }}\n                                            />\n                                        )}\n                                        {/* eslint-disable-next-line jsx-a11y/role-supports-aria-props */}\n                                        <button\n                                            // Nei dette er ikke i henhold til speccen, men VoiceOver leser den likevel og det er oppførselen vi ønsker\n                                            aria-invalid={ariaInvalid}\n                                            {...inputProps}\n                                            id={buttonId}\n                                            ref={buttonRef}\n                                            hidden={showSearchInputField}\n                                            type=\"button\"\n                                            name={`${name}-btn`}\n                                            className={clsx(\n                                                \"jkl-select__button\",\n                                                {\n                                                    \"jkl-select__button--active-value\":\n                                                        !!selectedValue,\n                                                },\n                                            )}\n                                            data-testid=\"jkl-select__button\"\n                                            aria-label={`${\n                                                selectedValueLabel || \"Velg\"\n                                            },${label}`}\n                                            aria-expanded={isPopoverOpen}\n                                            aria-controls={\n                                                isPopoverOpen\n                                                    ? listId\n                                                    : undefined\n                                            }\n                                            onBlur={handleBlur}\n                                            onFocus={handleFocus}\n                                            onKeyDown={handleOnKeyDown}\n                                            onClick={toggleListVisibility}\n                                            onMouseDown={(e) => {\n                                                // Workaround for en Safari-bug hvor e.relatedTarget er null i onBlur\n                                                // https://twitter.com/MilesSorce/status/1278762360669265925\n                                                e.preventDefault();\n                                                buttonRef.current?.focus();\n                                            }}\n                                        >\n                                            {selectedValueLabel}\n                                        </button>\n                                        <ArrowVerticalAnimated\n                                            variant=\"medium\"\n                                            pointingDown={!isPopoverOpen}\n                                            className=\"jkl-select__arrow\"\n                                        />\n                                    </div>\n                                </Popover.Trigger>\n                                <Popover.Content\n                                    initialFocus={-1}\n                                    returnFocus={false}\n                                    className=\"jkl-select__popover\"\n                                    style={{\n                                        width: `anchor-size(${anchorName} width)`,\n                                    }}\n                                >\n                                    <div\n                                        id={listId}\n                                        ref={setDropdownRef}\n                                        // biome-ignore lint/a11y/useSemanticElements: Vi reimplementerer select\n                                        role=\"listbox\"\n                                        className=\"jkl-select__options-menu\"\n                                        data-popover-placement={\n                                            popoverPlacement\n                                        }\n                                        aria-labelledby={labelId}\n                                        tabIndex={-1}\n                                        data-focus=\"controlled\" // lar oss styre markering av valg vha focus\n                                        style={\n                                            {\n                                                \"--jkl-select-max-shown-options\":\n                                                    maxShownOptions,\n                                            } as CSSProperties\n                                        }\n                                    >\n                                        {visibleItems.map((item, i) =>\n                                            // Det er viktig at vi _fjerner_ elementer som ikke er synlige fra DOMen for at tastaturnavigasjon skal fungere.\n                                            // For eksempel, hvis vi har elementene Apple, Samsung og LG i den rekkefølgen og søker etter \"l\"\n                                            // vil Samsung ikke synes. Om vi bare setter hidden-attributtet på Samsung vil ArrowDown fra Apple ikke fungere.\n                                            // Dette lar seg ikke gjenskape i en enhetstest med JSDOM + user-events, og Cypress lukker Select\n                                            // ved første {downArrow} ¯\\_(ツ)_/¯. Så please test scenariet over manuelt om dette skaper trøbbel for deg.\n                                            item.visible ? (\n                                                <button\n                                                    key={`${listId}-${item.value}`}\n                                                    hidden={!item.visible}\n                                                    type=\"button\"\n                                                    id={`${listId}__${toLower(\n                                                        item.value,\n                                                    )}`}\n                                                    className=\"jkl-select__option\"\n                                                    data-testid=\"jkl-select__option\"\n                                                    aria-selected={\n                                                        item.value ===\n                                                        selectedValue\n                                                    }\n                                                    // biome-ignore lint/a11y/useSemanticElements: Vi reimplementerer select\n                                                    role=\"option\"\n                                                    value={item.value}\n                                                    data-testautoid={`jkl-select__option-${i}`}\n                                                    onBlur={handleBlur}\n                                                    onFocus={handleFocus}\n                                                    onKeyDown={\n                                                        handleOptionOnKeyDown\n                                                    }\n                                                    onClick={(e) => {\n                                                        e.preventDefault();\n                                                        selectOption(item);\n                                                    }}\n                                                    onMouseOver={\n                                                        handleMouseOver\n                                                    }\n                                                >\n                                                    {item.label}\n                                                    {item.description ? (\n                                                        <span className=\"jkl-select__option-description\">\n                                                            {item.description}\n                                                        </span>\n                                                    ) : null}\n                                                </button>\n                                            ) : null,\n                                        )}\n                                    </div>\n                                </Popover.Content>\n                            </Popover>\n                        );\n                    }}\n                />\n            </>\n        );\n    },\n);\n\nSelect.displayName = \"Select\";\n"],"names":["noop","Select","forwardRef","props","forwardedSelectRef","id","name","items","value","label","labelProps","onChange","onBlur","onFocus","className","helpLabel","errorLabel","invalid","searchable","inline","defaultPrompt","width","maxShownOptions","style","tooltip","rest","listId","useId","generateSuffix","labelId","buttonId","searchInputId","anchorName","replace","dropdownIsShown","setShown","useState","toggleListVisibility","useCallback","previousValue","popoverPlacement","setPopoverPlacement","handlePlacementChange","p","startsWith","isSearchable","showSearchInputField","searchValue","setSearchValue","searchFn","item","toLowerCase","includes","visibleItems","useMemo","map","getValuePair","visible","valueIsInItems","some","selectedValue","setSelectedValue","hasSelectedValue","selectedValueLabel","find","selectRef","useRef","unifiedSelectRef","instance","current","usePreviousValue","useEffect","selectOption","nextValue","buttonRef","focus","previousSelectedValue","type","target","dispatchEvent","Event","bubbles","componentRootElementRef","focusInsideRef","searchFieldRef","dropdownRef","listboxEl","setListboxEl","isSearchableRef","selectedValueRef","setDropdownRef","node","requestAnimationFrame","focusSelected","wasShown","useListNavigation","element","close","handleBlur","e","componentRootElement","dropdownElement","contains","relatedTarget","handleFocus","handleMouseOver","preventScroll","select","onSelectFocus","onSelectBlur","ev","insideComponent","insideDropdown","preventDefault","addEventListener","removeEventListener","handleOnKeyDown","key","stopPropagation","handleSearchOnKeyDown","listElement","shiftKey","handleOptionOnKeyDown","currentTarget","firstVisible","querySelector","handleEscape","window","jsxs","Fragment","children","tabIndex","ref","jsx","hidden","InputGroup","clsx","React","isValidElement","cloneElement","triggerProps","srOnly","htmlFor","render","ariaInvalid","inputProps","isPopoverOpen","Popover","open","placement","offset","modal","onPlacementChange","clickOptions","enabled","dismissOptions","roleOptions","Trigger","asChild","placeholder","toLower","role","onKeyDown","onClick","onMouseDown","ArrowVerticalAnimated","variant","pointingDown","Content","initialFocus","returnFocus","i","onMouseOver","description","displayName"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../../src/components/select/Select.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type CSSProperties,\n    type FocusEvent,\n    forwardRef,\n    type KeyboardEvent,\n    type MouseEvent,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { useListNavigation } from \"../../hooks/useListNavigation/useListNavigation.js\";\nimport { usePreviousValue } from \"../../hooks/usePreviousValue/usePreviousValue.js\";\nimport { type ValuePair, getValuePair } from \"../../utilities/valuePair.js\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport Popover from \"../popover/Popover.js\";\nimport type { PopupTipProps } from \"../tooltip/types.js\";\nimport { focusSelected, toLower } from \"./select-utils.js\";\nimport type { SelectProps } from \"./types.js\";\n\nconst noop = () => {\n    return;\n};\n\ninterface Option extends ValuePair {\n    visible: boolean;\n}\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n    (props, forwardedSelectRef) => {\n        const {\n            id,\n            name,\n            items,\n            value,\n            label,\n            labelProps,\n            onChange,\n            onBlur,\n            onFocus,\n            className,\n            helpLabel,\n            errorLabel,\n            invalid,\n            searchable = false,\n            inline = false,\n            defaultPrompt = \"Velg\",\n            width,\n            maxShownOptions = 5,\n            style,\n            tooltip,\n            ...rest\n        } = props;\n\n        const listId = useId(id || \"jkl-select\", { generateSuffix: !id });\n        const labelId = `${listId}_label`;\n        const buttonId = `${listId}_button`;\n        const searchInputId = `${listId}_search-input`;\n\n        const [dropdownIsShown, setShown] = useState(false);\n        const toggleListVisibility = useCallback(() => {\n            setShown((previousValue) => !previousValue);\n        }, []);\n\n        // Lagrer faktisk placement etter at floating-ui har kjørt `flip`,\n        // slik at vi kan bytte hvilken side av lista og knappen som er\n        // flat når lista snus over triggeren.\n        const [popoverPlacement, setPopoverPlacement] = useState<\n            \"top\" | \"bottom\"\n        >(\"bottom\");\n        const handlePlacementChange = useCallback((p: string) => {\n            setPopoverPlacement(p.startsWith(\"top\") ? \"top\" : \"bottom\");\n        }, []);\n\n        /// Søk\n\n        const isSearchable = Boolean(searchable);\n        const showSearchInputField = isSearchable && dropdownIsShown;\n        const [searchValue, setSearchValue] = useState(\"\");\n        const searchFn = useCallback(\n            (item: ValuePair) => {\n                if (\n                    item.label.toLowerCase().includes(searchValue.toLowerCase())\n                ) {\n                    return true;\n                }\n\n                if (typeof searchable === \"function\") {\n                    return searchable(searchValue, item);\n                }\n\n                return false;\n            },\n            [searchable, searchValue],\n        );\n        const visibleItems: Option[] = useMemo(\n            () =>\n                items.map(getValuePair).map((item) => {\n                    const visible =\n                        !isSearchable || searchValue === \"\" || searchFn(item);\n                    return { ...item, visible };\n                }),\n            [items, isSearchable, searchValue, searchFn],\n        );\n        const valueIsInItems: boolean = useMemo(() => {\n            if (typeof value === \"undefined\") {\n                return false;\n            }\n            return items.some((item) =>\n                typeof item === \"string\"\n                    ? item === value\n                    : item.value === value,\n            );\n        }, [value, items]);\n\n        /// Valg av <option>\n\n        const [selectedValue, setSelectedValue] = useState<string>(\n            valueIsInItems && value !== undefined ? value : \"\",\n        );\n        const hasSelectedValue = selectedValue !== \"\";\n        const selectedValueLabel = useMemo(\n            () =>\n                visibleItems.find((item) => item.value === selectedValue)\n                    ?.label || defaultPrompt,\n            [visibleItems, selectedValue, defaultPrompt],\n        );\n\n        const selectRef = useRef<HTMLSelectElement | null>(null);\n        // Hjelpefunksjon som gjør det enklere å forwarde refen og å bruke den selv internt\n        const unifiedSelectRef = useCallback(\n            (instance: HTMLSelectElement | null) => {\n                selectRef.current = instance;\n                if (forwardedSelectRef) {\n                    if (typeof forwardedSelectRef === \"function\") {\n                        forwardedSelectRef(instance);\n                    } else {\n                        forwardedSelectRef.current = instance;\n                    }\n                }\n                if (instance) {\n                    setSelectedValue(instance.value);\n                }\n            },\n            [forwardedSelectRef],\n        );\n\n        const previousValue = usePreviousValue(value);\n        useEffect(() => {\n            if (value === previousValue) {\n                return;\n            }\n            if (typeof value === \"undefined\" || !valueIsInItems) {\n                setSelectedValue(\"\");\n            } else {\n                setSelectedValue(value);\n            }\n        }, [value, previousValue, valueIsInItems]);\n\n        const selectOption = useCallback(\n            (item: Option) => {\n                const nextValue = item.value;\n                setSearchValue(\"\");\n                setSelectedValue(nextValue);\n                toggleListVisibility();\n                buttonRef.current?.focus();\n            },\n            [toggleListVisibility],\n        );\n\n        // La komponenten rendre <select> med den valgte verdien før onChange trigges, slik at\n        // react-hook-form@>7.41.1 behandler feltet som at det har en verdi.\n        const previousSelectedValue = usePreviousValue(selectedValue);\n        useEffect(() => {\n            // previousSelectedValue er undefined på første render, men da vil vi ikke ha en onChange uansett\n            if (\n                typeof previousSelectedValue === \"undefined\" ||\n                previousSelectedValue === selectedValue ||\n                selectedValue === value\n            ) {\n                return;\n            }\n            if (onChange) {\n                onChange({\n                    type: \"change\",\n                    target: { name, value: selectedValue },\n                });\n            }\n            if (selectRef.current) {\n                selectRef.current.dispatchEvent(\n                    new Event(\"change\", { bubbles: true }),\n                );\n            }\n        }, [onChange, name, value, selectedValue, previousSelectedValue]);\n\n        /// Fokushåndtering\n\n        const componentRootElementRef = useRef<HTMLDivElement>(null);\n        const focusInsideRef = useRef(false);\n        const searchFieldRef = useRef<HTMLInputElement>(null);\n        const buttonRef = useRef<HTMLButtonElement>(null);\n\n        const dropdownRef = useRef<HTMLDivElement | null>(null);\n        // Lagrer listbox-elementet i state slik at downstream-hooks\n        // (f.eks. `useListNavigation`) kan re-feste listeneren idet\n        // `FloatingPortal` mounter listen.\n        const [listboxEl, setListboxEl] = useState<HTMLDivElement | null>(null);\n\n        // Listen rendres i en `FloatingPortal` som monteres via en\n        // `useLayoutEffect` + `setState` i floating-ui. Refen er derfor\n        // ikke tilgjengelig før i en senere render. Vi bruker en\n        // callback-ref for å plassere fokus på valgt option idet listen\n        // faktisk er i DOM-en. Refen holdes stabil (tom dependency-list)\n        // slik at en endring i `selectedValue`/`isSearchable` ikke får\n        // React til å avmontere/remontere refen og dermed flytte fokus\n        // mens menyen er åpen — vi leser siste verdier via refs.\n        const isSearchableRef = useRef(isSearchable);\n        const selectedValueRef = useRef(selectedValue);\n        useEffect(() => {\n            isSearchableRef.current = isSearchable;\n            selectedValueRef.current = selectedValue;\n        });\n\n        const setDropdownRef = useCallback((node: HTMLDivElement | null) => {\n            dropdownRef.current = node;\n            setListboxEl(node);\n            if (node && !isSearchableRef.current) {\n                // Popover skjules med `visibility: hidden` til\n                // floating-ui har regnet ut første posisjon. Defer\n                // fokus til etter neste paint, slik at vi ikke flytter\n                // fokus til et usynlig element (kan gi manglende\n                // fokusindikator i enkelte nettlesere).\n                requestAnimationFrame(() => {\n                    if (dropdownRef.current === node) {\n                        focusSelected(node, selectedValueRef.current);\n                    }\n                });\n            }\n        }, []);\n\n        // Søkbart felt og knappen som får fokus ved lukking lever i hoved-\n        // DOM-en, så for de tilfellene holder en useEffect.\n        const wasShown = usePreviousValue(dropdownIsShown);\n        useEffect(() => {\n            if (dropdownIsShown === wasShown) return;\n            if (dropdownIsShown && isSearchable) {\n                searchFieldRef.current?.focus();\n            } else if (\n                !dropdownIsShown &&\n                focusInsideRef.current &&\n                buttonRef.current\n            ) {\n                buttonRef.current.focus();\n            }\n        }, [dropdownIsShown, wasShown, isSearchable]);\n\n        useListNavigation({ element: listboxEl });\n\n        const close = useCallback(() => {\n            if (isSearchable) {\n                setSearchValue(\"\");\n            }\n            if (onBlur) {\n                onBlur({\n                    type: \"blur\",\n                    target: { name, value: selectedValue },\n                });\n                selectRef.current?.dispatchEvent(\n                    new Event(\"focusout\", { bubbles: true }),\n                );\n            }\n            focusInsideRef.current = false;\n            setShown(false);\n        }, [onBlur, isSearchable, name, selectedValue]);\n\n        const handleBlur = useCallback(\n            (e: FocusEvent<HTMLButtonElement | HTMLInputElement>) => {\n                const componentRootElement = componentRootElementRef.current;\n                const dropdownElement = dropdownRef.current;\n                // There are known issues in Firefox when using \"relatedTarget\" in onBlur events:\n                // https://github.com/facebook/react/issues/2011\n                // This might be fixed in react 17. Se issue above.\n                // Dropdown rendres i en portal, så vi må sjekke begge trærne\n                // for å avgjøre om fokus blir værende inne i komponenten.\n                const nextFocusIsInsideComponent =\n                    componentRootElement?.contains(e.relatedTarget as Node) ||\n                    dropdownElement?.contains(e.relatedTarget as Node);\n                if (!nextFocusIsInsideComponent) {\n                    close();\n                }\n            },\n            [close],\n        );\n\n        const handleFocus = useCallback(() => {\n            if (!focusInsideRef.current) {\n                if (onFocus) {\n                    onFocus({\n                        type: \"change\",\n                        target: { name, value: selectedValue },\n                    });\n                }\n                focusInsideRef.current = true;\n            }\n        }, [onFocus, selectedValue, name]);\n\n        const handleMouseOver = useCallback(\n            (e: MouseEvent<HTMLButtonElement>) => {\n                // Ved mouseOver på options flytter vi fokus til dem for å unngå \"dobbel fokus\"\n                // der det ser ut som to forskjellige elementer er fokusert/hovered samtidig\n                (e.target as HTMLButtonElement).focus({ preventScroll: true });\n            },\n            [],\n        );\n\n        // Handle focus and blur of hidden select element\n        useEffect(() => {\n            const select = selectRef.current;\n            if (!select) return;\n\n            const onSelectFocus = () => {\n                if (showSearchInputField) {\n                    searchFieldRef.current?.focus();\n                } else {\n                    buttonRef.current?.focus();\n                }\n            };\n            const onSelectBlur = (ev: globalThis.FocusEvent) => {\n                // Les refs ved hvert kall slik at vi alltid sjekker mot\n                // siste listbox-element — den portalerte listen kan ha\n                // mountet etter at denne effekten ble satt opp.\n                const target = ev.relatedTarget as Node | null;\n                const insideComponent =\n                    componentRootElementRef.current?.contains(target);\n                const insideDropdown = dropdownRef.current?.contains(target);\n                if (insideComponent || insideDropdown) {\n                    ev.preventDefault();\n                }\n            };\n\n            select.addEventListener(\"focus\", onSelectFocus);\n            select.addEventListener(\"blur\", onSelectBlur);\n            return () => {\n                select.removeEventListener(\"focus\", onSelectFocus);\n                select.removeEventListener(\"blur\", onSelectBlur);\n            };\n        }, [showSearchInputField]);\n\n        /// Tastaturnavigasjon\n\n        // Add support for opening dropdown with arrowkey down as expected from native select\n        // onKeyDown to stop ArrowDown from scrolling the page\n        const handleOnKeyDown = useCallback(\n            (e: KeyboardEvent<HTMLButtonElement>) => {\n                if (\n                    (e.key === \"ArrowDown\" || e.key === \" \") &&\n                    !dropdownIsShown\n                ) {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    setShown(true);\n                } else if (e.key === \"Escape\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    setShown(false);\n                }\n            },\n            [dropdownIsShown],\n        );\n\n        // onKeyDown to stop ArrowDown from scrolling the page\n        const handleSearchOnKeyDown = useCallback(\n            (e: KeyboardEvent<HTMLInputElement>) => {\n                if (e.key === \"ArrowDown\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    const listElement = dropdownRef.current;\n                    if (listElement) {\n                        if (isSearchable) {\n                            // Flytt fokus til det første elementet i listen, ikke det forrige valgte.\n                            // Ved endring i filter er det ikke gitt at vi ønsker å ta utgangspunkt i\n                            // den valgte verdien.\n                            focusSelected(listElement, undefined);\n                        } else {\n                            focusSelected(listElement, selectedValue);\n                        }\n                    }\n                } else if (e.key === \"Escape\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    setShown(false);\n                } else if (e.key === \"Tab\" && !e.shiftKey) {\n                    const listElement = dropdownRef.current;\n                    if (listElement) {\n                        e.preventDefault();\n                        e.stopPropagation();\n                        focusSelected(listElement, selectedValue);\n                    }\n                } else if (e.key === \"Enter\" && dropdownIsShown) {\n                    // Should not propagate Enter keyevent because form might submit\n                    e.preventDefault();\n                    e.stopPropagation();\n                }\n            },\n            [selectedValue, isSearchable, dropdownIsShown],\n        );\n\n        // onKeyDown so this Tab listener isn't triggered by tabbing from search field to option\n        const handleOptionOnKeyDown = useCallback(\n            (e: KeyboardEvent<HTMLButtonElement>) => {\n                if (e.key === \"Tab\") {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    if (e.shiftKey && searchFieldRef.current) {\n                        searchFieldRef.current.focus();\n                    } else if (buttonRef.current) {\n                        // Mimic behaviour of Firefox and native select, where Tab selects the current item and closes the menu\n                        setSelectedValue(e.currentTarget.value);\n                        setShown(false);\n                        buttonRef.current.focus();\n                    }\n                } else if (e.key === \"ArrowUp\") {\n                    if (dropdownRef.current && searchFieldRef.current) {\n                        // Can't be based on index since the first item might be filtered out\n                        const firstVisible = dropdownRef.current.querySelector(\n                            '[role=\"option\"]:not([hidden])',\n                        );\n                        if (\n                            e.currentTarget.id === firstVisible?.id &&\n                            searchFieldRef.current\n                        ) {\n                            searchFieldRef.current.focus();\n                        }\n                    }\n                }\n            },\n            [],\n        );\n\n        // Add support for closing the dropdown with Escape like native select. Unfortunately, Escape does not trigger the button onKeyDown.\n        useEffect(() => {\n            const handleEscape = (e: globalThis.KeyboardEvent) => {\n                if (e.key === \"Escape\" && dropdownIsShown) {\n                    setShown(false);\n                }\n            };\n            if (typeof window !== \"undefined\" && dropdownIsShown) {\n                window.addEventListener(\"keydown\", handleEscape);\n            }\n            return () => {\n                if (typeof window !== \"undefined\") {\n                    window.removeEventListener(\"keydown\", handleEscape);\n                }\n            };\n        }, [dropdownIsShown]);\n\n        return (\n            <>\n                <select\n                    name={name}\n                    tabIndex={-1}\n                    data-testid=\"jkl-native-select\"\n                    className=\"jkl-sr-only\"\n                    aria-hidden\n                    ref={unifiedSelectRef}\n                    value={selectedValue}\n                    onChange={noop} // React complains unless we give an onChange handler. This is technically a read-only field, but readOnly isn't an option here.\n                >\n                    <option value=\"\" />{\" \"}\n                    {/* Tom option må være et valg, ellers vil <select> alltid ha en value */}\n                    {visibleItems.map((item) => (\n                        <option\n                            key={`${listId}-opt-${item.value}`}\n                            hidden={!item.visible}\n                            value={item.value}\n                        >\n                            {item.label}\n                        </option>\n                    ))}\n                </select>\n                <InputGroup\n                    ref={componentRootElementRef}\n                    data-testid=\"jkl-select\"\n                    className={clsx(\"jkl-select\", className, {\n                        \"jkl-select--inline\": inline,\n                        \"jkl-select--open\":\n                            dropdownIsShown &&\n                            visibleItems.some((item) => item.visible),\n                        \"jkl-select--no-value\": !hasSelectedValue,\n                        \"jkl-select--invalid\": !!errorLabel || invalid,\n                    })}\n                    tooltip={\n                        tooltip && React.isValidElement<PopupTipProps>(tooltip)\n                            ? React.cloneElement(tooltip, {\n                                  triggerProps: {\n                                      ...tooltip.props.triggerProps,\n                                      onFocus: (\n                                          e: FocusEvent<HTMLButtonElement>,\n                                      ) => {\n                                          tooltip.props.triggerProps?.onFocus?.(\n                                              e,\n                                          );\n                                          close();\n                                      },\n                                  },\n                              })\n                            : null\n                    }\n                    {...rest}\n                    id={isSearchable ? searchInputId : buttonId}\n                    style={style}\n                    label={label}\n                    labelProps={{\n                        id: labelId,\n                        srOnly: inline,\n                        ...labelProps,\n                        htmlFor: isSearchable ? searchInputId : buttonId,\n                    }}\n                    helpLabel={helpLabel}\n                    errorLabel={errorLabel}\n                    render={({\n                        \"aria-invalid\": ariaInvalid,\n                        ...inputProps\n                    }) => {\n                        // Lista vises kun når dropdown er åpnet *og* det\n                        // finnes minst ett synlig valg. `aria-expanded` på\n                        // trigger og combobox må følge samme boolean for\n                        // ikke å lyve om popoverens tilstand.\n                        const isPopoverOpen =\n                            dropdownIsShown &&\n                            visibleItems.some((item) => item.visible);\n                        return (\n                            <Popover\n                                open={isPopoverOpen}\n                                placement=\"bottom-start\"\n                                offset={0}\n                                modal={false}\n                                onPlacementChange={handlePlacementChange}\n                                matchReferenceWidth\n                                clickOptions={{ enabled: false }}\n                                dismissOptions={{ enabled: false }}\n                                roleOptions={{ enabled: false }}\n                            >\n                                <Popover.Trigger asChild>\n                                    <div\n                                        className=\"jkl-select__outer-wrapper\"\n                                        data-popover-placement={\n                                            popoverPlacement\n                                        }\n                                        style={{ width }}\n                                    >\n                                        {isSearchable && (\n                                            <input\n                                                {...inputProps}\n                                                aria-invalid={ariaInvalid}\n                                                id={searchInputId}\n                                                hidden={!showSearchInputField}\n                                                ref={searchFieldRef}\n                                                placeholder=\"Søk\"\n                                                value={searchValue}\n                                                onChange={(e) =>\n                                                    setSearchValue(\n                                                        e.target.value,\n                                                    )\n                                                }\n                                                data-testid=\"jkl-select__search-input\"\n                                                className=\"jkl-select__search-input\"\n                                                aria-autocomplete=\"list\"\n                                                aria-activedescendant={\n                                                    isPopoverOpen &&\n                                                    hasSelectedValue\n                                                        ? `${listId}__${toLower(\n                                                              selectedValue,\n                                                          )}`\n                                                        : undefined\n                                                }\n                                                aria-controls={\n                                                    isPopoverOpen\n                                                        ? listId\n                                                        : undefined\n                                                }\n                                                aria-expanded={isPopoverOpen}\n                                                role=\"combobox\"\n                                                onKeyDown={\n                                                    handleSearchOnKeyDown\n                                                }\n                                                onBlur={handleBlur}\n                                                onFocus={handleFocus}\n                                                onClick={(e) => {\n                                                    e.stopPropagation();\n                                                }}\n                                            />\n                                        )}\n                                        {/* eslint-disable-next-line jsx-a11y/role-supports-aria-props */}\n                                        <button\n                                            // Nei dette er ikke i henhold til speccen, men VoiceOver leser den likevel og det er oppførselen vi ønsker\n                                            aria-invalid={ariaInvalid}\n                                            {...inputProps}\n                                            id={buttonId}\n                                            ref={buttonRef}\n                                            hidden={showSearchInputField}\n                                            type=\"button\"\n                                            name={`${name}-btn`}\n                                            className={clsx(\n                                                \"jkl-select__button\",\n                                                {\n                                                    \"jkl-select__button--active-value\":\n                                                        !!selectedValue,\n                                                },\n                                            )}\n                                            data-testid=\"jkl-select__button\"\n                                            aria-label={`${\n                                                selectedValueLabel || \"Velg\"\n                                            },${label}`}\n                                            aria-expanded={isPopoverOpen}\n                                            aria-controls={\n                                                isPopoverOpen\n                                                    ? listId\n                                                    : undefined\n                                            }\n                                            onBlur={handleBlur}\n                                            onFocus={handleFocus}\n                                            onKeyDown={handleOnKeyDown}\n                                            onClick={toggleListVisibility}\n                                            onMouseDown={(e) => {\n                                                // Workaround for en Safari-bug hvor e.relatedTarget er null i onBlur\n                                                // https://twitter.com/MilesSorce/status/1278762360669265925\n                                                e.preventDefault();\n                                                buttonRef.current?.focus();\n                                            }}\n                                        >\n                                            {selectedValueLabel}\n                                        </button>\n                                        <ArrowVerticalAnimated\n                                            variant=\"medium\"\n                                            pointingDown={!isPopoverOpen}\n                                            className=\"jkl-select__arrow\"\n                                        />\n                                    </div>\n                                </Popover.Trigger>\n                                <Popover.Content\n                                    initialFocus={-1}\n                                    returnFocus={false}\n                                    className=\"jkl-select__popover\"\n                                >\n                                    <div\n                                        id={listId}\n                                        ref={setDropdownRef}\n                                        // biome-ignore lint/a11y/useSemanticElements: Vi reimplementerer select\n                                        role=\"listbox\"\n                                        className=\"jkl-select__options-menu\"\n                                        data-popover-placement={\n                                            popoverPlacement\n                                        }\n                                        aria-labelledby={labelId}\n                                        tabIndex={-1}\n                                        data-focus=\"controlled\" // lar oss styre markering av valg vha focus\n                                        style={\n                                            {\n                                                \"--jkl-select-max-shown-options\":\n                                                    maxShownOptions,\n                                            } as CSSProperties\n                                        }\n                                    >\n                                        {visibleItems.map((item, i) =>\n                                            // Det er viktig at vi _fjerner_ elementer som ikke er synlige fra DOMen for at tastaturnavigasjon skal fungere.\n                                            // For eksempel, hvis vi har elementene Apple, Samsung og LG i den rekkefølgen og søker etter \"l\"\n                                            // vil Samsung ikke synes. Om vi bare setter hidden-attributtet på Samsung vil ArrowDown fra Apple ikke fungere.\n                                            // Dette lar seg ikke gjenskape i en enhetstest med JSDOM + user-events, og Cypress lukker Select\n                                            // ved første {downArrow} ¯\\_(ツ)_/¯. Så please test scenariet over manuelt om dette skaper trøbbel for deg.\n                                            item.visible ? (\n                                                <button\n                                                    key={`${listId}-${item.value}`}\n                                                    hidden={!item.visible}\n                                                    type=\"button\"\n                                                    id={`${listId}__${toLower(\n                                                        item.value,\n                                                    )}`}\n                                                    className=\"jkl-select__option\"\n                                                    data-testid=\"jkl-select__option\"\n                                                    aria-selected={\n                                                        item.value ===\n                                                        selectedValue\n                                                    }\n                                                    // biome-ignore lint/a11y/useSemanticElements: Vi reimplementerer select\n                                                    role=\"option\"\n                                                    value={item.value}\n                                                    data-testautoid={`jkl-select__option-${i}`}\n                                                    onBlur={handleBlur}\n                                                    onFocus={handleFocus}\n                                                    onKeyDown={\n                                                        handleOptionOnKeyDown\n                                                    }\n                                                    onClick={(e) => {\n                                                        e.preventDefault();\n                                                        selectOption(item);\n                                                    }}\n                                                    onMouseOver={\n                                                        handleMouseOver\n                                                    }\n                                                >\n                                                    {item.label}\n                                                    {item.description ? (\n                                                        <span className=\"jkl-select__option-description\">\n                                                            {item.description}\n                                                        </span>\n                                                    ) : null}\n                                                </button>\n                                            ) : null,\n                                        )}\n                                    </div>\n                                </Popover.Content>\n                            </Popover>\n                        );\n                    }}\n                />\n            </>\n        );\n    },\n);\n\nSelect.displayName = \"Select\";\n"],"names":["noop","Select","forwardRef","props","forwardedSelectRef","id","name","items","value","label","labelProps","onChange","onBlur","onFocus","className","helpLabel","errorLabel","invalid","searchable","inline","defaultPrompt","width","maxShownOptions","style","tooltip","rest","listId","useId","generateSuffix","labelId","buttonId","searchInputId","dropdownIsShown","setShown","useState","toggleListVisibility","useCallback","previousValue","popoverPlacement","setPopoverPlacement","handlePlacementChange","p","startsWith","isSearchable","showSearchInputField","searchValue","setSearchValue","searchFn","item","toLowerCase","includes","visibleItems","useMemo","map","getValuePair","visible","valueIsInItems","some","selectedValue","setSelectedValue","hasSelectedValue","selectedValueLabel","find","selectRef","useRef","unifiedSelectRef","instance","current","usePreviousValue","useEffect","selectOption","nextValue","buttonRef","focus","previousSelectedValue","type","target","dispatchEvent","Event","bubbles","componentRootElementRef","focusInsideRef","searchFieldRef","dropdownRef","listboxEl","setListboxEl","isSearchableRef","selectedValueRef","setDropdownRef","node","requestAnimationFrame","focusSelected","wasShown","useListNavigation","element","close","handleBlur","e","componentRootElement","dropdownElement","contains","relatedTarget","handleFocus","handleMouseOver","preventScroll","select","onSelectFocus","onSelectBlur","ev","insideComponent","insideDropdown","preventDefault","addEventListener","removeEventListener","handleOnKeyDown","key","stopPropagation","handleSearchOnKeyDown","listElement","shiftKey","handleOptionOnKeyDown","currentTarget","firstVisible","querySelector","handleEscape","window","jsxs","Fragment","children","tabIndex","ref","jsx","hidden","InputGroup","clsx","React","isValidElement","cloneElement","triggerProps","srOnly","htmlFor","render","ariaInvalid","inputProps","isPopoverOpen","Popover","open","placement","offset","modal","onPlacementChange","matchReferenceWidth","clickOptions","enabled","dismissOptions","roleOptions","Trigger","asChild","placeholder","toLower","role","onKeyDown","onClick","onMouseDown","ArrowVerticalAnimated","variant","pointingDown","Content","initialFocus","returnFocus","i","onMouseOver","description","displayName"],"mappings":"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"}

package/build/es/hooks/index.d.ts

@@ -15,4 +15,5 @@ export { useElementDimensions, type Dimensions, } from './useElementDimensions/u
 export { useId } from './useId/useId.js';
 export { useKeyListener } from './useKeyListener/useKeyListener.js';
 export { useListNavigation } from './useListNavigation/useListNavigation.js';
+export { useMergeRefs } from './useMergeRefs/useMergeRefs.js';
 export { useSwipeGesture, type SwipeChangeHandler, } from './useSwipeGesture/useSwipeGesture.js';

package/build/es/hooks/index.js

@@ -1,2 +1,2 @@
-import{useAnimatedDetails as e}from"./useAnimatedDetails/useAnimatedDetails.js";import{useAnimatedHeight as s}from"./useAnimatedHeight/useAnimatedHeight.js";import{useAnimatedHeightBetween as i}from"./useAnimatedHeight/useAnimatedHeightBetween.js";import{useAutoAnimatedHeight as r}from"./useAnimatedHeight/useAutoAnimateHeight.js";import{useBrowserPreferences as t}from"./useBrowserPreferences/useBrowserPreferences.js";import{useIntersectionObserver as u}from"./useIntersectionObserver/useIntersectionObserver.js";import{useLocalStorage as o}from"./useLocalStorage/useLocalStorage.js";import{useMutationObserver as a}from"./useMutationObserver/useMutationObserver.js";import{usePreviousValue as m}from"./usePreviousValue/usePreviousValue.js";import{useProgressiveImg as n}from"./useProgressiveImg/useProgressiveImg.js";import{useScreen as g}from"./useScreen/useScreen.js";import{useScrollIntoView as c}from"./useScrollIntoView/useScrollIntoView.js";import{useAriaLiveRegion as l}from"./useAriaLiveRegion/useAriaLiveRegion.js";import{useClickOutside as d}from"./useClickOutside/useClickOutside.js";import{useFocusOutside as p}from"./useFocusOutside/useFocusOutside.js";import{useElementDimensions as f}from"./useElementDimensions/useElementDimensions.js";import{useId as v}from"./useId/useId.js";import{useKeyListener as A}from"./useKeyListener/useKeyListener.js";import{useListNavigation as j}from"./useListNavigation/useListNavigation.js";import{useSwipeGesture as I}from"./useSwipeGesture/useSwipeGesture.js";export{e as useAnimatedDetails,s as useAnimatedHeight,i as useAnimatedHeightBetween,l as useAriaLiveRegion,r as useAutoAnimatedHeight,t as useBrowserPreferences,d as useClickOutside,f as useElementDimensions,p as useFocusOutside,v as useId,u as useIntersectionObserver,A as useKeyListener,j as useListNavigation,o as useLocalStorage,a as useMutationObserver,m as usePreviousValue,n as useProgressiveImg,g as useScreen,c as useScrollIntoView,I as useSwipeGesture};
+import{useAnimatedDetails as e}from"./useAnimatedDetails/useAnimatedDetails.js";import{useAnimatedHeight as s}from"./useAnimatedHeight/useAnimatedHeight.js";import{useAnimatedHeightBetween as i}from"./useAnimatedHeight/useAnimatedHeightBetween.js";import{useAutoAnimatedHeight as r}from"./useAnimatedHeight/useAutoAnimateHeight.js";import{useBrowserPreferences as u}from"./useBrowserPreferences/useBrowserPreferences.js";import{useIntersectionObserver as t}from"./useIntersectionObserver/useIntersectionObserver.js";import{useLocalStorage as o}from"./useLocalStorage/useLocalStorage.js";import{useMutationObserver as a}from"./useMutationObserver/useMutationObserver.js";import{usePreviousValue as m}from"./usePreviousValue/usePreviousValue.js";import{useProgressiveImg as n}from"./useProgressiveImg/useProgressiveImg.js";import{useScreen as g}from"./useScreen/useScreen.js";import{useScrollIntoView as f}from"./useScrollIntoView/useScrollIntoView.js";import{useAriaLiveRegion as c}from"./useAriaLiveRegion/useAriaLiveRegion.js";import{useClickOutside as l}from"./useClickOutside/useClickOutside.js";import{useFocusOutside as d}from"./useFocusOutside/useFocusOutside.js";import{useElementDimensions as p}from"./useElementDimensions/useElementDimensions.js";import{useId as v}from"./useId/useId.js";import{useKeyListener as A}from"./useKeyListener/useKeyListener.js";import{useListNavigation as j}from"./useListNavigation/useListNavigation.js";import{useMergeRefs as I}from"./useMergeRefs/useMergeRefs.js";import{useSwipeGesture as L}from"./useSwipeGesture/useSwipeGesture.js";export{e as useAnimatedDetails,s as useAnimatedHeight,i as useAnimatedHeightBetween,c as useAriaLiveRegion,r as useAutoAnimatedHeight,u as useBrowserPreferences,l as useClickOutside,p as useElementDimensions,d as useFocusOutside,v as useId,t as useIntersectionObserver,A as useKeyListener,j as useListNavigation,o as useLocalStorage,I as useMergeRefs,a as useMutationObserver,m as usePreviousValue,n as useProgressiveImg,g as useScreen,f as useScrollIntoView,L as useSwipeGesture};
 //# sourceMappingURL=index.js.map

package/build/es/hooks/useMergeRefs/useMergeRefs.d.ts

@@ -0,0 +1,8 @@
+import { ForwardedRef, MutableRefObject, RefCallback } from 'react';
+/**
+ * Slår sammen flere refs til én callback som bare endres når en av refsene endres.
+ * @param refs Liste over refs du vil slå sammen
+ * @returns En `RefCallback` du kan sende videre til en komponent/element
+ * @example const combinedRef = useMergeRefs(ref, forwardedRef, anotherRef);
+ */
+export declare function useMergeRefs<T>(...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]): RefCallback<T>;

package/build/es/hooks/useMergeRefs/useMergeRefs.js

@@ -0,0 +1,2 @@
+import{useMemo as e}from"react";import{mergeRefs as r}from"../../utilities/mergeRefs.js";function s(...s){return e(()=>r(...s),s)}export{s as useMergeRefs};
+//# sourceMappingURL=useMergeRefs.js.map

package/build/es/hooks/useMergeRefs/useMergeRefs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMergeRefs.js","sources":["../../../../src/hooks/useMergeRefs/useMergeRefs.ts"],"sourcesContent":["import {\n    type ForwardedRef,\n    type MutableRefObject,\n    type RefCallback,\n    useMemo,\n} from \"react\";\nimport { mergeRefs } from \"../../utilities/mergeRefs.js\";\n\n/**\n * Slår sammen flere refs til én callback som bare endres når en av refsene endres.\n * @param refs Liste over refs du vil slå sammen\n * @returns En `RefCallback` du kan sende videre til en komponent/element\n * @example const combinedRef = useMergeRefs(ref, forwardedRef, anotherRef);\n */\nexport function useMergeRefs<T>(\n    ...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]\n): RefCallback<T> {\n    // biome-ignore lint/correctness/useExhaustiveDependencies: Sammenlign hver ref for seg; [refs] blir ny ved hver rendring.\n    return useMemo(() => mergeRefs(...refs), refs);\n}\n"],"names":["useMergeRefs","refs","useMemo","mergeRefs"],"mappings":"yFAcO,SAASA,KACTC,GAGH,OAAOC,EAAQ,IAAMC,KAAaF,GAAOA,EAC7C"}

package/build/es/index.js

@@ -1,2 +1,2 @@
-import{default as s}from"./core/tokens.js";import{useAnimatedDetails as e}from"./hooks/useAnimatedDetails/useAnimatedDetails.js";import{useAnimatedHeight as i}from"./hooks/useAnimatedHeight/useAnimatedHeight.js";import{useAnimatedHeightBetween as r}from"./hooks/useAnimatedHeight/useAnimatedHeightBetween.js";import{useAutoAnimatedHeight as t}from"./hooks/useAnimatedHeight/useAutoAnimateHeight.js";import{useBrowserPreferences as a}from"./hooks/useBrowserPreferences/useBrowserPreferences.js";import{useIntersectionObserver as o}from"./hooks/useIntersectionObserver/useIntersectionObserver.js";import{useLocalStorage as m}from"./hooks/useLocalStorage/useLocalStorage.js";import{useMutationObserver as u}from"./hooks/useMutationObserver/useMutationObserver.js";import{usePreviousValue as n}from"./hooks/usePreviousValue/usePreviousValue.js";import{useProgressiveImg as l}from"./hooks/useProgressiveImg/useProgressiveImg.js";import{useScreen as f}from"./hooks/useScreen/useScreen.js";import{useScrollIntoView as d}from"./hooks/useScrollIntoView/useScrollIntoView.js";import{useAriaLiveRegion as g}from"./hooks/useAriaLiveRegion/useAriaLiveRegion.js";import{useClickOutside as p}from"./hooks/useClickOutside/useClickOutside.js";import{useFocusOutside as h}from"./hooks/useFocusOutside/useFocusOutside.js";import{useElementDimensions as j}from"./hooks/useElementDimensions/useElementDimensions.js";import{useId as E}from"./hooks/useId/useId.js";import{useKeyListener as V}from"./hooks/useKeyListener/useKeyListener.js";import{useListNavigation as v}from"./hooks/useListNavigation/useListNavigation.js";import{useSwipeGesture as M}from"./hooks/useSwipeGesture/useSwipeGesture.js";import{u as k}from"../index-C1iqmqvT.js";import{formatNumber as c}from"./utilities/formatters/util/formatNumber.js";import{parseNumber as O}from"./utilities/formatters/util/parseNumber.js";import{registerWithFodselsnummerMask as R,registerWithKontonummerMask as N,registerWithKortnummerMask as A,registerWithMasks as S,registerWithTelefonnummerMask as I}from"./utilities/formatters/util/registerWithMask.js";import{formatAvstand as L}from"./utilities/formatters/avstand/formatAvstand.js";import{formatBytes as T}from"./utilities/formatters/bytes/formatBytes.js";import{formatDate as b}from"./utilities/formatters/date/formatDate.js";import{FODSELSNUMMER_REGEX as K,formatFodselsnummer as P}from"./utilities/formatters/fodselsnummer/formatFodselsnummer.js";import{ORGANISASJONSNUMMER_REGEX as D,formatOrganisasjonsnummer as F}from"./utilities/formatters/organisasjonsnummer/formatOrganisasjonsnummer.js";import{KONTONUMMER_REGEX as G,formatKontonummer as w}from"./utilities/formatters/kontonummer/formatKontonummer.js";import{KORTNUMMER_REGEX as C,formatKortnummer as W}from"./utilities/formatters/kortnummer/formatKortnummer.js";import{TELEFONNUMMER_REGEX as H,formatTelefonnummer as y}from"./utilities/formatters/telefonnummer/formatTelefonnummer.js";import{formatValuta as B}from"./utilities/formatters/valuta/formatValuta.js";import{getThemeAndSize as U}from"./utilities/getThemeAndSize.js";import{mergeRefs as X,useMergeRefs as _}from"./utilities/mergeRefs.js";import{mergeProps as x}from"./utilities/polymorphism/mergeProps.js";import{SlotComponent as z}from"./utilities/polymorphism/SlotComponent.js";import{initTabListener as J}from"./utilities/tabListener.js";import{isValidEpost as q}from"./utilities/validators/isValidEpost/isValidEpost.js";import{isValidTelefonnummer as Q}from"./utilities/validators/isValidTelefonnummer/isValidTelefonnummer.js";import{isValidRegistreringsnummer as Y}from"./utilities/validators/isValidRegistreringsnummer/isValidRegistreringsnummer.js";import{isValidChassisnummer as Z}from"./utilities/validators/isValidChassisnummer/isValidChassisnummer.js";import{isValidDogId as $}from"./utilities/validators/isValidDogId/isValidDogId.js";import{isExactLength as ss}from"./utilities/validators/isExactLength/isExactLength.js";import{isInteger as es}from"./utilities/validators/isInteger/isInteger.js";import{isValidFodselsnummer as is}from"./utilities/validators/isValidFodselsnummer/isValidFodselsnummer.js";import{isValidOrganisasjonsnummer as rs}from"./utilities/validators/isValidOrganisasjonsnummer/isValidOrganisasjonsnummer.js";import{isValidName as ts}from"./utilities/validators/isValidName/isValidName.js";import{hasMinimumWords as as}from"./utilities/validators/hasMinimumWords/hasMinimumWords.js";import{hasNoIllegalCharacters as os}from"./utilities/validators/hasNoIllegalCharacters/hasNoIllegalCharacters.js";import{getValuePair as ms}from"./utilities/valuePair.js";export{K as FODSELSNUMMER_REGEX,G as KONTONUMMER_REGEX,C as KORTNUMMER_REGEX,D as ORGANISASJONSNUMMER_REGEX,z as SlotComponent,H as TELEFONNUMMER_REGEX,L as formatAvstand,T as formatBytes,b as formatDate,P as formatFodselsnummer,w as formatKontonummer,W as formatKortnummer,c as formatNumber,F as formatOrganisasjonsnummer,y as formatTelefonnummer,B as formatValuta,U as getThemeAndSize,ms as getValuePair,as as hasMinimumWords,os as hasNoIllegalCharacters,J as initTabListener,ss as isExactLength,es as isInteger,Z as isValidChassisnummer,$ as isValidDogId,q as isValidEpost,is as isValidFodselsnummer,ts as isValidName,rs as isValidOrganisasjonsnummer,Y as isValidRegistreringsnummer,Q as isValidTelefonnummer,x as mergeProps,X as mergeRefs,O as parseNumber,R as registerWithFodselsnummerMask,N as registerWithKontonummerMask,A as registerWithKortnummerMask,S as registerWithMasks,I as registerWithTelefonnummerMask,s as tokens,k as unicode,e as useAnimatedDetails,i as useAnimatedHeight,r as useAnimatedHeightBetween,g as useAriaLiveRegion,t as useAutoAnimatedHeight,a as useBrowserPreferences,p as useClickOutside,j as useElementDimensions,h as useFocusOutside,E as useId,o as useIntersectionObserver,V as useKeyListener,v as useListNavigation,m as useLocalStorage,_ as useMergeRefs,u as useMutationObserver,n as usePreviousValue,l as useProgressiveImg,f as useScreen,d as useScrollIntoView,M as useSwipeGesture};
+import{default as s}from"./core/tokens.js";import{useAnimatedDetails as e}from"./hooks/useAnimatedDetails/useAnimatedDetails.js";import{useAnimatedHeight as i}from"./hooks/useAnimatedHeight/useAnimatedHeight.js";import{useAnimatedHeightBetween as r}from"./hooks/useAnimatedHeight/useAnimatedHeightBetween.js";import{useAutoAnimatedHeight as t}from"./hooks/useAnimatedHeight/useAutoAnimateHeight.js";import{useBrowserPreferences as a}from"./hooks/useBrowserPreferences/useBrowserPreferences.js";import{useIntersectionObserver as o}from"./hooks/useIntersectionObserver/useIntersectionObserver.js";import{useLocalStorage as m}from"./hooks/useLocalStorage/useLocalStorage.js";import{useMutationObserver as u}from"./hooks/useMutationObserver/useMutationObserver.js";import{usePreviousValue as n}from"./hooks/usePreviousValue/usePreviousValue.js";import{useProgressiveImg as l}from"./hooks/useProgressiveImg/useProgressiveImg.js";import{useScreen as f}from"./hooks/useScreen/useScreen.js";import{useScrollIntoView as d}from"./hooks/useScrollIntoView/useScrollIntoView.js";import{useAriaLiveRegion as g}from"./hooks/useAriaLiveRegion/useAriaLiveRegion.js";import{useClickOutside as p}from"./hooks/useClickOutside/useClickOutside.js";import{useFocusOutside as h}from"./hooks/useFocusOutside/useFocusOutside.js";import{useElementDimensions as j}from"./hooks/useElementDimensions/useElementDimensions.js";import{useId as E}from"./hooks/useId/useId.js";import{useKeyListener as V}from"./hooks/useKeyListener/useKeyListener.js";import{useListNavigation as M}from"./hooks/useListNavigation/useListNavigation.js";import{useMergeRefs as v}from"./hooks/useMergeRefs/useMergeRefs.js";import{useSwipeGesture as k}from"./hooks/useSwipeGesture/useSwipeGesture.js";import{u as R}from"../index-C1iqmqvT.js";import{formatNumber as c}from"./utilities/formatters/util/formatNumber.js";import{parseNumber as O}from"./utilities/formatters/util/parseNumber.js";import{registerWithFodselsnummerMask as N,registerWithKontonummerMask as A,registerWithKortnummerMask as S,registerWithMasks as I,registerWithTelefonnummerMask as L}from"./utilities/formatters/util/registerWithMask.js";import{formatAvstand as T}from"./utilities/formatters/avstand/formatAvstand.js";import{formatBytes as b}from"./utilities/formatters/bytes/formatBytes.js";import{formatDate as K}from"./utilities/formatters/date/formatDate.js";import{FODSELSNUMMER_REGEX as P,formatFodselsnummer as D}from"./utilities/formatters/fodselsnummer/formatFodselsnummer.js";import{ORGANISASJONSNUMMER_REGEX as F,formatOrganisasjonsnummer as G}from"./utilities/formatters/organisasjonsnummer/formatOrganisasjonsnummer.js";import{KONTONUMMER_REGEX as w,formatKontonummer as C}from"./utilities/formatters/kontonummer/formatKontonummer.js";import{KORTNUMMER_REGEX as W,formatKortnummer as H}from"./utilities/formatters/kortnummer/formatKortnummer.js";import{TELEFONNUMMER_REGEX as y,formatTelefonnummer as B}from"./utilities/formatters/telefonnummer/formatTelefonnummer.js";import{formatValuta as U}from"./utilities/formatters/valuta/formatValuta.js";import{getThemeAndSize as X}from"./utilities/getThemeAndSize.js";import{mergeRefs as _}from"./utilities/mergeRefs.js";import{mergeProps as x}from"./utilities/polymorphism/mergeProps.js";import{SlotComponent as z}from"./utilities/polymorphism/SlotComponent.js";import{initTabListener as J}from"./utilities/tabListener.js";import{isValidEpost as q}from"./utilities/validators/isValidEpost/isValidEpost.js";import{isValidTelefonnummer as Q}from"./utilities/validators/isValidTelefonnummer/isValidTelefonnummer.js";import{isValidRegistreringsnummer as Y}from"./utilities/validators/isValidRegistreringsnummer/isValidRegistreringsnummer.js";import{isValidChassisnummer as Z}from"./utilities/validators/isValidChassisnummer/isValidChassisnummer.js";import{isValidDogId as $}from"./utilities/validators/isValidDogId/isValidDogId.js";import{isExactLength as ss}from"./utilities/validators/isExactLength/isExactLength.js";import{isInteger as es}from"./utilities/validators/isInteger/isInteger.js";import{isValidFodselsnummer as is}from"./utilities/validators/isValidFodselsnummer/isValidFodselsnummer.js";import{isValidOrganisasjonsnummer as rs}from"./utilities/validators/isValidOrganisasjonsnummer/isValidOrganisasjonsnummer.js";import{isValidName as ts}from"./utilities/validators/isValidName/isValidName.js";import{hasMinimumWords as as}from"./utilities/validators/hasMinimumWords/hasMinimumWords.js";import{hasNoIllegalCharacters as os}from"./utilities/validators/hasNoIllegalCharacters/hasNoIllegalCharacters.js";import{getValuePair as ms}from"./utilities/valuePair.js";export{P as FODSELSNUMMER_REGEX,w as KONTONUMMER_REGEX,W as KORTNUMMER_REGEX,F as ORGANISASJONSNUMMER_REGEX,z as SlotComponent,y as TELEFONNUMMER_REGEX,T as formatAvstand,b as formatBytes,K as formatDate,D as formatFodselsnummer,C as formatKontonummer,H as formatKortnummer,c as formatNumber,G as formatOrganisasjonsnummer,B as formatTelefonnummer,U as formatValuta,X as getThemeAndSize,ms as getValuePair,as as hasMinimumWords,os as hasNoIllegalCharacters,J as initTabListener,ss as isExactLength,es as isInteger,Z as isValidChassisnummer,$ as isValidDogId,q as isValidEpost,is as isValidFodselsnummer,ts as isValidName,rs as isValidOrganisasjonsnummer,Y as isValidRegistreringsnummer,Q as isValidTelefonnummer,x as mergeProps,_ as mergeRefs,O as parseNumber,N as registerWithFodselsnummerMask,A as registerWithKontonummerMask,S as registerWithKortnummerMask,I as registerWithMasks,L as registerWithTelefonnummerMask,s as tokens,R as unicode,e as useAnimatedDetails,i as useAnimatedHeight,r as useAnimatedHeightBetween,g as useAriaLiveRegion,t as useAutoAnimatedHeight,a as useBrowserPreferences,p as useClickOutside,j as useElementDimensions,h as useFocusOutside,E as useId,o as useIntersectionObserver,V as useKeyListener,M as useListNavigation,m as useLocalStorage,v as useMergeRefs,u as useMutationObserver,n as usePreviousValue,l as useProgressiveImg,f as useScreen,d as useScrollIntoView,k as useSwipeGesture};
 //# sourceMappingURL=index.js.map

package/build/es/utilities/index.d.ts

@@ -2,6 +2,7 @@ export * from './constants/index.js';
 export * from './formatters/index.js';
 export * from './getThemeAndSize.js';
 export * from './mergeRefs.js';
+export { useMergeRefs } from '../hooks/useMergeRefs/useMergeRefs.js';
 export * from './polymorphism/index.js';
 export * from './tabListener.js';
 export * from './validators/index.js';

package/build/es/utilities/index.js

@@ -1,2 +1,2 @@
-import{u as s}from"../../index-C1iqmqvT.js";import{formatNumber as a}from"./formatters/util/formatNumber.js";import{parseNumber as r}from"./formatters/util/parseNumber.js";import{registerWithFodselsnummerMask as m,registerWithKontonummerMask as e,registerWithKortnummerMask as o,registerWithMasks as t,registerWithTelefonnummerMask as i}from"./formatters/util/registerWithMask.js";import{formatAvstand as n}from"./formatters/avstand/formatAvstand.js";import{formatBytes as l}from"./formatters/bytes/formatBytes.js";import{formatDate as f}from"./formatters/date/formatDate.js";import{FODSELSNUMMER_REGEX as d,formatFodselsnummer as u}from"./formatters/fodselsnummer/formatFodselsnummer.js";import{ORGANISASJONSNUMMER_REGEX as g,formatOrganisasjonsnummer as p}from"./formatters/organisasjonsnummer/formatOrganisasjonsnummer.js";import{KONTONUMMER_REGEX as E,formatKontonummer as j}from"./formatters/kontonummer/formatKontonummer.js";import{KORTNUMMER_REGEX as M,formatKortnummer as V}from"./formatters/kortnummer/formatKortnummer.js";import{TELEFONNUMMER_REGEX as h,formatTelefonnummer as R}from"./formatters/telefonnummer/formatTelefonnummer.js";import{formatValuta as N}from"./formatters/valuta/formatValuta.js";import{getThemeAndSize as O}from"./getThemeAndSize.js";import{mergeRefs as T,useMergeRefs as v}from"./mergeRefs.js";import{mergeProps as S}from"./polymorphism/mergeProps.js";import{SlotComponent as W}from"./polymorphism/SlotComponent.js";import{initTabListener as I}from"./tabListener.js";import{isValidEpost as K}from"./validators/isValidEpost/isValidEpost.js";import{isValidTelefonnummer as k}from"./validators/isValidTelefonnummer/isValidTelefonnummer.js";import{isValidRegistreringsnummer as F}from"./validators/isValidRegistreringsnummer/isValidRegistreringsnummer.js";import{isValidChassisnummer as G}from"./validators/isValidChassisnummer/isValidChassisnummer.js";import{isValidDogId as C}from"./validators/isValidDogId/isValidDogId.js";import{isExactLength as L}from"./validators/isExactLength/isExactLength.js";import{isInteger as b}from"./validators/isInteger/isInteger.js";import{isValidFodselsnummer as A}from"./validators/isValidFodselsnummer/isValidFodselsnummer.js";import{isValidOrganisasjonsnummer as U}from"./validators/isValidOrganisasjonsnummer/isValidOrganisasjonsnummer.js";import{isValidName as X}from"./validators/isValidName/isValidName.js";import{hasMinimumWords as _}from"./validators/hasMinimumWords/hasMinimumWords.js";import{hasNoIllegalCharacters as c}from"./validators/hasNoIllegalCharacters/hasNoIllegalCharacters.js";import{getValuePair as D}from"./valuePair.js";export{d as FODSELSNUMMER_REGEX,E as KONTONUMMER_REGEX,M as KORTNUMMER_REGEX,g as ORGANISASJONSNUMMER_REGEX,W as SlotComponent,h as TELEFONNUMMER_REGEX,n as formatAvstand,l as formatBytes,f as formatDate,u as formatFodselsnummer,j as formatKontonummer,V as formatKortnummer,a as formatNumber,p as formatOrganisasjonsnummer,R as formatTelefonnummer,N as formatValuta,O as getThemeAndSize,D as getValuePair,_ as hasMinimumWords,c as hasNoIllegalCharacters,I as initTabListener,L as isExactLength,b as isInteger,G as isValidChassisnummer,C as isValidDogId,K as isValidEpost,A as isValidFodselsnummer,X as isValidName,U as isValidOrganisasjonsnummer,F as isValidRegistreringsnummer,k as isValidTelefonnummer,S as mergeProps,T as mergeRefs,r as parseNumber,m as registerWithFodselsnummerMask,e as registerWithKontonummerMask,o as registerWithKortnummerMask,t as registerWithMasks,i as registerWithTelefonnummerMask,s as unicode,v as useMergeRefs};
+import{u as s}from"../../index-C1iqmqvT.js";import{formatNumber as r}from"./formatters/util/formatNumber.js";import{parseNumber as a}from"./formatters/util/parseNumber.js";import{registerWithFodselsnummerMask as m,registerWithKontonummerMask as e,registerWithKortnummerMask as o,registerWithMasks as t,registerWithTelefonnummerMask as i}from"./formatters/util/registerWithMask.js";import{formatAvstand as n}from"./formatters/avstand/formatAvstand.js";import{formatBytes as f}from"./formatters/bytes/formatBytes.js";import{formatDate as l}from"./formatters/date/formatDate.js";import{FODSELSNUMMER_REGEX as u,formatFodselsnummer as d}from"./formatters/fodselsnummer/formatFodselsnummer.js";import{ORGANISASJONSNUMMER_REGEX as g,formatOrganisasjonsnummer as p}from"./formatters/organisasjonsnummer/formatOrganisasjonsnummer.js";import{KONTONUMMER_REGEX as E,formatKontonummer as j}from"./formatters/kontonummer/formatKontonummer.js";import{KORTNUMMER_REGEX as M,formatKortnummer as h}from"./formatters/kortnummer/formatKortnummer.js";import{TELEFONNUMMER_REGEX as V,formatTelefonnummer as R}from"./formatters/telefonnummer/formatTelefonnummer.js";import{formatValuta as N}from"./formatters/valuta/formatValuta.js";import{getThemeAndSize as O}from"./getThemeAndSize.js";import{mergeRefs as T}from"./mergeRefs.js";import{useMergeRefs as v}from"../hooks/useMergeRefs/useMergeRefs.js";import{mergeProps as S}from"./polymorphism/mergeProps.js";import{SlotComponent as W}from"./polymorphism/SlotComponent.js";import{initTabListener as k}from"./tabListener.js";import{isValidEpost as I}from"./validators/isValidEpost/isValidEpost.js";import{isValidTelefonnummer as K}from"./validators/isValidTelefonnummer/isValidTelefonnummer.js";import{isValidRegistreringsnummer as F}from"./validators/isValidRegistreringsnummer/isValidRegistreringsnummer.js";import{isValidChassisnummer as G}from"./validators/isValidChassisnummer/isValidChassisnummer.js";import{isValidDogId as C}from"./validators/isValidDogId/isValidDogId.js";import{isExactLength as L}from"./validators/isExactLength/isExactLength.js";import{isInteger as b}from"./validators/isInteger/isInteger.js";import{isValidFodselsnummer as A}from"./validators/isValidFodselsnummer/isValidFodselsnummer.js";import{isValidOrganisasjonsnummer as U}from"./validators/isValidOrganisasjonsnummer/isValidOrganisasjonsnummer.js";import{isValidName as X}from"./validators/isValidName/isValidName.js";import{hasMinimumWords as _}from"./validators/hasMinimumWords/hasMinimumWords.js";import{hasNoIllegalCharacters as c}from"./validators/hasNoIllegalCharacters/hasNoIllegalCharacters.js";import{getValuePair as D}from"./valuePair.js";export{u as FODSELSNUMMER_REGEX,E as KONTONUMMER_REGEX,M as KORTNUMMER_REGEX,g as ORGANISASJONSNUMMER_REGEX,W as SlotComponent,V as TELEFONNUMMER_REGEX,n as formatAvstand,f as formatBytes,l as formatDate,d as formatFodselsnummer,j as formatKontonummer,h as formatKortnummer,r as formatNumber,p as formatOrganisasjonsnummer,R as formatTelefonnummer,N as formatValuta,O as getThemeAndSize,D as getValuePair,_ as hasMinimumWords,c as hasNoIllegalCharacters,k as initTabListener,L as isExactLength,b as isInteger,G as isValidChassisnummer,C as isValidDogId,I as isValidEpost,A as isValidFodselsnummer,X as isValidName,U as isValidOrganisasjonsnummer,F as isValidRegistreringsnummer,K as isValidTelefonnummer,S as mergeProps,T as mergeRefs,a as parseNumber,m as registerWithFodselsnummerMask,e as registerWithKontonummerMask,o as registerWithKortnummerMask,t as registerWithMasks,i as registerWithTelefonnummerMask,s as unicode,v as useMergeRefs};
 //# sourceMappingURL=index.js.map

package/build/es/utilities/mergeRefs.d.ts

@@ -12,11 +12,3 @@ import { ForwardedRef, MutableRefObject, RefCallback } from 'react';
  * return <div ref={combinedRef} {...props} />;
  */
 export declare function mergeRefs<T>(...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]): RefCallback<T>;
-/**
- * Gjør det samme som {@link mergeRefs}, men wrappet i en `useMemo`, hvis du
- * vil unngå å lage en ny funksjon ved hver render. Som regel ikke nødvendig.
- * @param refs Liste over refs du vil slå sammen
- * @returns En `RefCallback` du kan sende videre til en komponent/element
- * @example const combinedRef = useMergeRefs(ref, forwardedRef, anotherRef);
- */
-export declare function useMergeRefs<T>(...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]): RefCallback<T>;

package/build/es/utilities/mergeRefs.js

@@ -1,2 +1,2 @@
-import{useMemo as e}from"react";function r(...e){return function(r){for(const n of e)n&&("function"==typeof n?n(r):n&&(n.current=r))}}function n(...n){return e(()=>r(...n),[n])}export{r as mergeRefs,n as useMergeRefs};
+function n(...n){return function(o){for(const t of n)t&&("function"==typeof t?t(o):t&&(t.current=o))}}export{n as mergeRefs};
 //# sourceMappingURL=mergeRefs.js.map

package/build/es/utilities/mergeRefs.js.map

@@ -1 +1 @@
-{"version":3,"file":"mergeRefs.js","sources":["../../../src/utilities/mergeRefs.ts"],"sourcesContent":["import {\n    type ForwardedRef,\n    type MutableRefObject,\n    type RefCallback,\n    useMemo,\n} from \"react\";\n\n/**\n * Slår sammen flere refs til én, for eksempel hvis du har både en\n * egen ref i en komponent og også vil kunne ta inn en forwardRef\n * fra brukeren av komponenten.\n * @param refs Liste over refs du vil slå sammen\n * @returns En `RefCallback` du kan sende videre til en komponent/element\n * @example\n * const ref = useRef<HTMLElement>(null);\n * const combinedRef = mergeRefs(ref, forwardedRef, anotherRef);\n *\n * return <div ref={combinedRef} {...props} />;\n */\nexport function mergeRefs<T>(\n    ...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]\n): RefCallback<T> {\n    return function combinedRef(instance: T | null) {\n        for (const ref of refs) {\n            if (!ref) continue;\n\n            if (typeof ref === \"function\") {\n                ref(instance);\n            } else if (ref) {\n                ref.current = instance;\n            }\n        }\n    };\n}\n\n/**\n * Gjør det samme som {@link mergeRefs}, men wrappet i en `useMemo`, hvis du\n * vil unngå å lage en ny funksjon ved hver render. Som regel ikke nødvendig.\n * @param refs Liste over refs du vil slå sammen\n * @returns En `RefCallback` du kan sende videre til en komponent/element\n * @example const combinedRef = useMergeRefs(ref, forwardedRef, anotherRef);\n */\nexport function useMergeRefs<T>(\n    ...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]\n): RefCallback<T> {\n    return useMemo(() => mergeRefs(...refs), [refs]);\n}\n"],"names":["mergeRefs","refs","instance","ref","current","useMergeRefs","useMemo"],"mappings":"gCAmBO,SAASA,KACTC,GAEH,OAAO,SAAqBC,GACxB,IAAA,MAAWC,KAAOF,EACTE,IAEc,mBAARA,EACPA,EAAID,GACGC,IACPA,EAAIC,QAAUF,GAG1B,CACJ,CASO,SAASG,KACTJ,GAEH,OAAOK,EAAQ,IAAMN,KAAaC,GAAO,CAACA,GAC9C"}
+{"version":3,"file":"mergeRefs.js","sources":["../../../src/utilities/mergeRefs.ts"],"sourcesContent":["import type { ForwardedRef, MutableRefObject, RefCallback } from \"react\";\n\n/**\n * Slår sammen flere refs til én, for eksempel hvis du har både en\n * egen ref i en komponent og også vil kunne ta inn en forwardRef\n * fra brukeren av komponenten.\n * @param refs Liste over refs du vil slå sammen\n * @returns En `RefCallback` du kan sende videre til en komponent/element\n * @example\n * const ref = useRef<HTMLElement>(null);\n * const combinedRef = mergeRefs(ref, forwardedRef, anotherRef);\n *\n * return <div ref={combinedRef} {...props} />;\n */\nexport function mergeRefs<T>(\n    ...refs: (ForwardedRef<T> | MutableRefObject<T> | undefined)[]\n): RefCallback<T> {\n    return function combinedRef(instance: T | null) {\n        for (const ref of refs) {\n            if (!ref) continue;\n\n            if (typeof ref === \"function\") {\n                ref(instance);\n            } else if (ref) {\n                ref.current = instance;\n            }\n        }\n    };\n}\n"],"names":["mergeRefs","refs","instance","ref","current"],"mappings":"AAcO,SAASA,KACTC,GAEH,OAAO,SAAqBC,GACxB,IAAA,MAAWC,KAAOF,EACTE,IAEc,mBAARA,EACPA,EAAID,GACGC,IACPA,EAAIC,QAAUF,GAG1B,CACJ"}