@chayns-components/core 5.4.6-alpha.0 → 5.4.6

package/lib/cjs/hooks/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.js","names":["_react","require","_dropdown","useIsomorphicLayoutEffect","window","useLayoutEffect","useEffect","useDropdownListener","onClick","onClose","onTouchEnd","onTouchStart","shouldCaptureEvents","document","addEventListener","removeEventListener","exports","useDropdownAlignment","anchorElement","contentWidth","direction","shouldUseTopAlignment","translateX","setTranslateX","useState","translateY","setTranslateY","DropdownDirection","BOTTOM_LEFT","TOP_LEFT","LEFT","includes","difference","clientWidth","useTopAlignment","TOP","TOP_RIGHT","useMemo","x","y","useDropdownPosition","container","contentHeight","shouldShowDropdown","coordinates","setCoordinates","setShouldUseTopAlignment","calculateCoordinates","useCallback","left","anchorLeft","top","anchorTop","height","anchorHeight","getBoundingClientRect","scrollLeft","scrollTop","hasBottomAlignment","BOTTOM","BOTTOM_RIGHT","handleResize","setTimeout","useDropdown","transform","width"],"sources":["../../../src/hooks/dropdown.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';\nimport { DropdownCoordinates, DropdownDirection } from '../types/dropdown';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\ninterface UseDropdownListenerOptions {\n    onClick: (event: MouseEvent) => void;\n    onClose: () => void;\n    onTouchEnd: (event: TouchEvent) => void;\n    onTouchStart: (event: TouchEvent) => void;\n    shouldCaptureEvents?: boolean;\n}\n\nexport const useDropdownListener = ({\n    onClick,\n    onClose,\n    onTouchEnd,\n    onTouchStart,\n    shouldCaptureEvents,\n}: UseDropdownListenerOptions) => {\n    useEffect(() => {\n        document.addEventListener('click', onClick, shouldCaptureEvents);\n        document.addEventListener('touchend', onTouchEnd, shouldCaptureEvents);\n        document.addEventListener('touchstart', onTouchStart, shouldCaptureEvents);\n\n        window.addEventListener('blur', onClose);\n\n        return () => {\n            document.removeEventListener('click', onClick, shouldCaptureEvents);\n            document.removeEventListener('touchend', onTouchEnd, shouldCaptureEvents);\n            document.removeEventListener('touchstart', onTouchStart, shouldCaptureEvents);\n\n            window.removeEventListener('blur', onClose);\n        };\n    }, [onClick, onClose, onTouchEnd, onTouchStart]);\n};\n\ninterface UseDropdownAlignmentOptions {\n    direction: DropdownDirection;\n    shouldUseTopAlignment: boolean;\n    contentWidth: number;\n    anchorElement: Element;\n}\n\nexport const useDropdownAlignment = ({\n    anchorElement,\n    contentWidth,\n    direction,\n    shouldUseTopAlignment,\n}: UseDropdownAlignmentOptions) => {\n    const [translateX, setTranslateX] = useState<string>('0px');\n    const [translateY, setTranslateY] = useState<string>('0px');\n\n    useEffect(() => {\n        if (\n            [\n                DropdownDirection.BOTTOM_LEFT,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.LEFT,\n            ].includes(direction)\n        ) {\n            const difference = anchorElement.clientWidth - contentWidth;\n\n            setTranslateX(`${difference}px`);\n        } else {\n            setTranslateX('0px');\n        }\n    }, [anchorElement.clientWidth, contentWidth, direction]);\n\n    useEffect(() => {\n        const useTopAlignment =\n            shouldUseTopAlignment ||\n            [\n                DropdownDirection.TOP,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.TOP_RIGHT,\n            ].includes(direction);\n\n        if (useTopAlignment) {\n            setTranslateY('-100%');\n        } else {\n            setTranslateY('0px');\n        }\n    }, [direction, shouldUseTopAlignment]);\n\n    return useMemo(() => ({ x: translateX, y: translateY }), [translateX, translateY]);\n};\n\ninterface UseDropdownPositionOptions {\n    anchorElement: Element;\n    container?: Element;\n    contentHeight?: number;\n    direction: DropdownDirection;\n    shouldShowDropdown: boolean;\n}\n\nexport const useDropdownPosition = ({\n    anchorElement,\n    container,\n    contentHeight = 0,\n    direction,\n    shouldShowDropdown,\n}: UseDropdownPositionOptions) => {\n    const [coordinates, setCoordinates] = useState<DropdownCoordinates>({ x: 0, y: 0 });\n    const [shouldUseTopAlignment, setShouldUseTopAlignment] = useState(false);\n\n    const calculateCoordinates = useCallback(() => {\n        if (container) {\n            const {\n                left: anchorLeft,\n                top: anchorTop,\n                height: anchorHeight,\n            } = anchorElement.getBoundingClientRect();\n\n            const { left, top, height } = container.getBoundingClientRect();\n\n            const x = anchorLeft - left + container.scrollLeft;\n            const y = anchorTop - top + container.scrollTop;\n\n            let useTopAlignment = [\n                DropdownDirection.TOP,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.TOP_RIGHT,\n            ].includes(direction);\n\n            const hasBottomAlignment = [\n                DropdownDirection.BOTTOM,\n                DropdownDirection.BOTTOM_LEFT,\n                DropdownDirection.BOTTOM_RIGHT,\n            ].includes(direction);\n\n            if (!hasBottomAlignment && y + anchorHeight + contentHeight > height) {\n                useTopAlignment = true;\n\n                setShouldUseTopAlignment(true);\n            } else {\n                setShouldUseTopAlignment(false);\n            }\n\n            setCoordinates({ x, y: useTopAlignment ? y : y + anchorHeight });\n        }\n    }, [anchorElement, container, contentHeight, direction]);\n\n    useIsomorphicLayoutEffect(() => {\n        const handleResize = () => {\n            calculateCoordinates();\n\n            setTimeout(calculateCoordinates, 300);\n        };\n\n        handleResize();\n\n        if (shouldShowDropdown) {\n            window.addEventListener('resize', handleResize);\n        }\n\n        return () => {\n            window.removeEventListener('resize', handleResize);\n        };\n    }, [calculateCoordinates, shouldShowDropdown]);\n\n    return useMemo(\n        () => ({ shouldUseTopAlignment, coordinates }),\n        [coordinates, shouldUseTopAlignment],\n    );\n};\n\ninterface UseDropdownOptions {\n    anchorElement: Element;\n    container?: Element;\n    contentHeight?: number;\n    contentWidth: number;\n    direction: DropdownDirection;\n    shouldShowDropdown: boolean;\n}\n\nexport const useDropdown = ({\n    anchorElement,\n    container,\n    contentHeight,\n    contentWidth,\n    direction,\n    shouldShowDropdown,\n}: UseDropdownOptions) => {\n    const { shouldUseTopAlignment, coordinates } = useDropdownPosition({\n        anchorElement,\n        container,\n        contentHeight,\n        direction,\n        shouldShowDropdown,\n    });\n\n    const transform = useDropdownAlignment({\n        anchorElement,\n        contentWidth,\n        direction,\n        shouldUseTopAlignment,\n    });\n\n    const width = anchorElement.clientWidth;\n\n    return useMemo(() => ({ coordinates, transform, width }), [coordinates, transform, width]);\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AAEA,MAAME,yBAAyB,GAAG,OAAOC,MAAM,KAAK,WAAW,GAAGC,sBAAe,GAAGC,gBAAS;AAUtF,MAAMC,mBAAmB,GAAGA,CAAC;EAChCC,OAAO;EACPC,OAAO;EACPC,UAAU;EACVC,YAAY;EACZC;AACwB,CAAC,KAAK;EAC9B,IAAAN,gBAAS,EAAC,MAAM;IACZO,QAAQ,CAACC,gBAAgB,CAAC,OAAO,EAAEN,OAAO,EAAEI,mBAAmB,CAAC;IAChEC,QAAQ,CAACC,gBAAgB,CAAC,UAAU,EAAEJ,UAAU,EAAEE,mBAAmB,CAAC;IACtEC,QAAQ,CAACC,gBAAgB,CAAC,YAAY,EAAEH,YAAY,EAAEC,mBAAmB,CAAC;IAE1ER,MAAM,CAACU,gBAAgB,CAAC,MAAM,EAAEL,OAAO,CAAC;IAExC,OAAO,MAAM;MACTI,QAAQ,CAACE,mBAAmB,CAAC,OAAO,EAAEP,OAAO,EAAEI,mBAAmB,CAAC;MACnEC,QAAQ,CAACE,mBAAmB,CAAC,UAAU,EAAEL,UAAU,EAAEE,mBAAmB,CAAC;MACzEC,QAAQ,CAACE,mBAAmB,CAAC,YAAY,EAAEJ,YAAY,EAAEC,mBAAmB,CAAC;MAE7ER,MAAM,CAACW,mBAAmB,CAAC,MAAM,EAAEN,OAAO,CAAC;IAC/C,CAAC;EACL,CAAC,EAAE,CAACD,OAAO,EAAEC,OAAO,EAAEC,UAAU,EAAEC,YAAY,CAAC,CAAC;AACpD,CAAC;AAACK,OAAA,CAAAT,mBAAA,GAAAA,mBAAA;AASK,MAAMU,oBAAoB,GAAGA,CAAC;EACjCC,aAAa;EACbC,YAAY;EACZC,SAAS;EACTC;AACyB,CAAC,KAAK;EAC/B,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAC,eAAQ,EAAS,KAAK,CAAC;EAC3D,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAF,eAAQ,EAAS,KAAK,CAAC;EAE3D,IAAAlB,gBAAS,EAAC,MAAM;IACZ,IACI,CACIqB,2BAAiB,CAACC,WAAW,EAC7BD,2BAAiB,CAACE,QAAQ,EAC1BF,2BAAiB,CAACG,IAAI,CACzB,CAACC,QAAQ,CAACX,SAAS,CAAC,EACvB;MACE,MAAMY,UAAU,GAAGd,aAAa,CAACe,WAAW,GAAGd,YAAY;MAE3DI,aAAa,CAAC,GAAGS,UAAU,IAAI,CAAC;IACpC,CAAC,MAAM;MACHT,aAAa,CAAC,KAAK,CAAC;IACxB;EACJ,CAAC,EAAE,CAACL,aAAa,CAACe,WAAW,EAAEd,YAAY,EAAEC,SAAS,CAAC,CAAC;EAExD,IAAAd,gBAAS,EAAC,MAAM;IACZ,MAAM4B,eAAe,GACjBb,qBAAqB,IACrB,CACIM,2BAAiB,CAACQ,GAAG,EACrBR,2BAAiB,CAACE,QAAQ,EAC1BF,2BAAiB,CAACS,SAAS,CAC9B,CAACL,QAAQ,CAACX,SAAS,CAAC;IAEzB,IAAIc,eAAe,EAAE;MACjBR,aAAa,CAAC,OAAO,CAAC;IAC1B,CAAC,MAAM;MACHA,aAAa,CAAC,KAAK,CAAC;IACxB;EACJ,CAAC,EAAE,CAACN,SAAS,EAAEC,qBAAqB,CAAC,CAAC;EAEtC,OAAO,IAAAgB,cAAO,EAAC,OAAO;IAAEC,CAAC,EAAEhB,UAAU;IAAEiB,CAAC,EAAEd;EAAW,CAAC,CAAC,EAAE,CAACH,UAAU,EAAEG,UAAU,CAAC,CAAC;AACtF,CAAC;AAACT,OAAA,CAAAC,oBAAA,GAAAA,oBAAA;AAUK,MAAMuB,mBAAmB,GAAGA,CAAC;EAChCtB,aAAa;EACbuB,SAAS;EACTC,aAAa,GAAG,CAAC;EACjBtB,SAAS;EACTuB;AACwB,CAAC,KAAK;EAC9B,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAArB,eAAQ,EAAsB;IAAEc,CAAC,EAAE,CAAC;IAAEC,CAAC,EAAE;EAAE,CAAC,CAAC;EACnF,MAAM,CAAClB,qBAAqB,EAAEyB,wBAAwB,CAAC,GAAG,IAAAtB,eAAQ,EAAC,KAAK,CAAC;EAEzE,MAAMuB,oBAAoB,GAAG,IAAAC,kBAAW,EAAC,MAAM;IAC3C,IAAIP,SAAS,EAAE;MACX,MAAM;QACFQ,IAAI,EAAEC,UAAU;QAChBC,GAAG,EAAEC,SAAS;QACdC,MAAM,EAAEC;MACZ,CAAC,GAAGpC,aAAa,CAACqC,qBAAqB,CAAC,CAAC;MAEzC,MAAM;QAAEN,IAAI;QAAEE,GAAG;QAAEE;MAAO,CAAC,GAAGZ,SAAS,CAACc,qBAAqB,CAAC,CAAC;MAE/D,MAAMjB,CAAC,GAAGY,UAAU,GAAGD,IAAI,GAAGR,SAAS,CAACe,UAAU;MAClD,MAAMjB,CAAC,GAAGa,SAAS,GAAGD,GAAG,GAAGV,SAAS,CAACgB,SAAS;MAE/C,IAAIvB,eAAe,GAAG,CAClBP,2BAAiB,CAACQ,GAAG,EACrBR,2BAAiB,CAACE,QAAQ,EAC1BF,2BAAiB,CAACS,SAAS,CAC9B,CAACL,QAAQ,CAACX,SAAS,CAAC;MAErB,MAAMsC,kBAAkB,GAAG,CACvB/B,2BAAiB,CAACgC,MAAM,EACxBhC,2BAAiB,CAACC,WAAW,EAC7BD,2BAAiB,CAACiC,YAAY,CACjC,CAAC7B,QAAQ,CAACX,SAAS,CAAC;MAErB,IAAI,CAACsC,kBAAkB,IAAInB,CAAC,GAAGe,YAAY,GAAGZ,aAAa,GAAGW,MAAM,EAAE;QAClEnB,eAAe,GAAG,IAAI;QAEtBY,wBAAwB,CAAC,IAAI,CAAC;MAClC,CAAC,MAAM;QACHA,wBAAwB,CAAC,KAAK,CAAC;MACnC;MAEAD,cAAc,CAAC;QAAEP,CAAC;QAAEC,CAAC,EAAEL,eAAe,GAAGK,CAAC,GAAGA,CAAC,GAAGe;MAAa,CAAC,CAAC;IACpE;EACJ,CAAC,EAAE,CAACpC,aAAa,EAAEuB,SAAS,EAAEC,aAAa,EAAEtB,SAAS,CAAC,CAAC;EAExDjB,yBAAyB,CAAC,MAAM;IAC5B,MAAM0D,YAAY,GAAGA,CAAA,KAAM;MACvBd,oBAAoB,CAAC,CAAC;MAEtBe,UAAU,CAACf,oBAAoB,EAAE,GAAG,CAAC;IACzC,CAAC;IAEDc,YAAY,CAAC,CAAC;IAEd,IAAIlB,kBAAkB,EAAE;MACpBvC,MAAM,CAACU,gBAAgB,CAAC,QAAQ,EAAE+C,YAAY,CAAC;IACnD;IAEA,OAAO,MAAM;MACTzD,MAAM,CAACW,mBAAmB,CAAC,QAAQ,EAAE8C,YAAY,CAAC;IACtD,CAAC;EACL,CAAC,EAAE,CAACd,oBAAoB,EAAEJ,kBAAkB,CAAC,CAAC;EAE9C,OAAO,IAAAN,cAAO,EACV,OAAO;IAAEhB,qBAAqB;IAAEuB;EAAY,CAAC,CAAC,EAC9C,CAACA,WAAW,EAAEvB,qBAAqB,CACvC,CAAC;AACL,CAAC;AAACL,OAAA,CAAAwB,mBAAA,GAAAA,mBAAA;AAWK,MAAMuB,WAAW,GAAGA,CAAC;EACxB7C,aAAa;EACbuB,SAAS;EACTC,aAAa;EACbvB,YAAY;EACZC,SAAS;EACTuB;AACgB,CAAC,KAAK;EACtB,MAAM;IAAEtB,qBAAqB;IAAEuB;EAAY,CAAC,GAAGJ,mBAAmB,CAAC;IAC/DtB,aAAa;IACbuB,SAAS;IACTC,aAAa;IACbtB,SAAS;IACTuB;EACJ,CAAC,CAAC;EAEF,MAAMqB,SAAS,GAAG/C,oBAAoB,CAAC;IACnCC,aAAa;IACbC,YAAY;IACZC,SAAS;IACTC;EACJ,CAAC,CAAC;EAEF,MAAM4C,KAAK,GAAG/C,aAAa,CAACe,WAAW;EAEvC,OAAO,IAAAI,cAAO,EAAC,OAAO;IAAEO,WAAW;IAAEoB,SAAS;IAAEC;EAAM,CAAC,CAAC,EAAE,CAACrB,WAAW,EAAEoB,SAAS,EAAEC,KAAK,CAAC,CAAC;AAC9F,CAAC;AAACjD,OAAA,CAAA+C,WAAA,GAAAA,WAAA","ignoreList":[]}
+{"version":3,"file":"dropdown.js","names":["_react","require","_dropdown","useIsomorphicLayoutEffect","window","useLayoutEffect","useEffect","useDropdownListener","onClick","onClose","onTouchEnd","onTouchStart","shouldCaptureEvents","document","addEventListener","removeEventListener","exports","useDropdownAlignment","anchorElement","contentWidth","direction","shouldUseTopAlignment","translateX","setTranslateX","useState","translateY","setTranslateY","DropdownDirection","BOTTOM_LEFT","TOP_LEFT","LEFT","includes","difference","clientWidth","useTopAlignment","TOP","TOP_RIGHT","useMemo","x","y","AVAILABLE_HEIGHT_SPACING","useDropdownPosition","container","contentHeight","shouldShowDropdown","coordinates","setCoordinates","setShouldUseTopAlignment","availableMaxHeight","setAvailableMaxHeight","calculateCoordinates","useCallback","left","anchorLeft","top","anchorTop","height","anchorHeight","getBoundingClientRect","scrollLeft","scrollTop","hasBottomAlignment","BOTTOM","BOTTOM_RIGHT","spaceToTop","spaceToBottom","nextAvailableMaxHeight","Math","max","round","currentAvailableMaxHeight","abs","handleResize","setTimeout","useDropdown","transform","width"],"sources":["../../../src/hooks/dropdown.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';\nimport { DropdownCoordinates, DropdownDirection } from '../types/dropdown';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\ninterface UseDropdownListenerOptions {\n    onClick: (event: MouseEvent) => void;\n    onClose: () => void;\n    onTouchEnd: (event: TouchEvent) => void;\n    onTouchStart: (event: TouchEvent) => void;\n    shouldCaptureEvents?: boolean;\n}\n\nexport const useDropdownListener = ({\n    onClick,\n    onClose,\n    onTouchEnd,\n    onTouchStart,\n    shouldCaptureEvents,\n}: UseDropdownListenerOptions) => {\n    useEffect(() => {\n        document.addEventListener('click', onClick, shouldCaptureEvents);\n        document.addEventListener('touchend', onTouchEnd, shouldCaptureEvents);\n        document.addEventListener('touchstart', onTouchStart, shouldCaptureEvents);\n\n        window.addEventListener('blur', onClose);\n\n        return () => {\n            document.removeEventListener('click', onClick, shouldCaptureEvents);\n            document.removeEventListener('touchend', onTouchEnd, shouldCaptureEvents);\n            document.removeEventListener('touchstart', onTouchStart, shouldCaptureEvents);\n\n            window.removeEventListener('blur', onClose);\n        };\n    }, [onClick, onClose, onTouchEnd, onTouchStart]);\n};\n\ninterface UseDropdownAlignmentOptions {\n    direction: DropdownDirection;\n    shouldUseTopAlignment: boolean;\n    contentWidth: number;\n    anchorElement: Element;\n}\n\nexport const useDropdownAlignment = ({\n    anchorElement,\n    contentWidth,\n    direction,\n    shouldUseTopAlignment,\n}: UseDropdownAlignmentOptions) => {\n    const [translateX, setTranslateX] = useState<string>('0px');\n    const [translateY, setTranslateY] = useState<string>('0px');\n\n    useEffect(() => {\n        if (\n            [\n                DropdownDirection.BOTTOM_LEFT,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.LEFT,\n            ].includes(direction)\n        ) {\n            const difference = anchorElement.clientWidth - contentWidth;\n\n            setTranslateX(`${difference}px`);\n        } else {\n            setTranslateX('0px');\n        }\n    }, [anchorElement.clientWidth, contentWidth, direction]);\n\n    useEffect(() => {\n        const useTopAlignment =\n            shouldUseTopAlignment ||\n            [\n                DropdownDirection.TOP,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.TOP_RIGHT,\n            ].includes(direction);\n\n        if (useTopAlignment) {\n            setTranslateY('-100%');\n        } else {\n            setTranslateY('0px');\n        }\n    }, [direction, shouldUseTopAlignment]);\n\n    return useMemo(() => ({ x: translateX, y: translateY }), [translateX, translateY]);\n};\n\ninterface UseDropdownPositionOptions {\n    anchorElement: Element;\n    container?: Element;\n    contentHeight?: number;\n    direction: DropdownDirection;\n    shouldShowDropdown: boolean;\n}\n\n/**\n * The space (in pixels) that should be kept between the dropdown content and the edge of the\n * container when calculating the available maximum height.\n */\nconst AVAILABLE_HEIGHT_SPACING = 16;\n\nexport const useDropdownPosition = ({\n    anchorElement,\n    container,\n    contentHeight = 0,\n    direction,\n    shouldShowDropdown,\n}: UseDropdownPositionOptions) => {\n    const [coordinates, setCoordinates] = useState<DropdownCoordinates>({ x: 0, y: 0 });\n    const [shouldUseTopAlignment, setShouldUseTopAlignment] = useState(false);\n    const [availableMaxHeight, setAvailableMaxHeight] = useState<number>(0);\n\n    const calculateCoordinates = useCallback(() => {\n        if (container) {\n            const {\n                left: anchorLeft,\n                top: anchorTop,\n                height: anchorHeight,\n            } = anchorElement.getBoundingClientRect();\n\n            const { left, top, height } = container.getBoundingClientRect();\n\n            const x = anchorLeft - left + container.scrollLeft;\n            const y = anchorTop - top + container.scrollTop;\n\n            let useTopAlignment = [\n                DropdownDirection.TOP,\n                DropdownDirection.TOP_LEFT,\n                DropdownDirection.TOP_RIGHT,\n            ].includes(direction);\n\n            const hasBottomAlignment = [\n                DropdownDirection.BOTTOM,\n                DropdownDirection.BOTTOM_LEFT,\n                DropdownDirection.BOTTOM_RIGHT,\n            ].includes(direction);\n\n            if (!hasBottomAlignment && y + anchorHeight + contentHeight > height) {\n                useTopAlignment = true;\n\n                setShouldUseTopAlignment(true);\n            } else {\n                setShouldUseTopAlignment(false);\n            }\n\n            // Calculate the space that is available for the dropdown content. When the dropdown is\n            // opened to the top, the available space reaches from the anchor to the top edge of the\n            // container. When it is opened to the bottom, it reaches from the bottom of the anchor\n            // to the bottom edge of the container. A small spacing is subtracted so the content does\n            // not touch the container edge (e.g. to leave room for shadows).\n            const spaceToTop = y;\n            const spaceToBottom = height - (y + anchorHeight);\n\n            const nextAvailableMaxHeight = Math.max(\n                Math.round(\n                    (useTopAlignment ? spaceToTop : spaceToBottom) - AVAILABLE_HEIGHT_SPACING,\n                ),\n                0,\n            );\n\n            // Only update the available max height when it changes by more than one pixel. This\n            // prevents subpixel fluctuations of getBoundingClientRect from repeatedly triggering\n            // re-renders of the consumer, which could otherwise cause a layout shift loop.\n            setAvailableMaxHeight((currentAvailableMaxHeight) =>\n                Math.abs(currentAvailableMaxHeight - nextAvailableMaxHeight) <= 1\n                    ? currentAvailableMaxHeight\n                    : nextAvailableMaxHeight,\n            );\n\n            setCoordinates({ x, y: useTopAlignment ? y : y + anchorHeight });\n        }\n    }, [anchorElement, container, contentHeight, direction]);\n\n    useIsomorphicLayoutEffect(() => {\n        const handleResize = () => {\n            calculateCoordinates();\n\n            setTimeout(calculateCoordinates, 300);\n        };\n\n        handleResize();\n\n        if (shouldShowDropdown) {\n            window.addEventListener('resize', handleResize);\n        }\n\n        return () => {\n            window.removeEventListener('resize', handleResize);\n        };\n    }, [calculateCoordinates, shouldShowDropdown]);\n\n    return useMemo(\n        () => ({ shouldUseTopAlignment, coordinates, availableMaxHeight }),\n        [availableMaxHeight, coordinates, shouldUseTopAlignment],\n    );\n};\n\ninterface UseDropdownOptions {\n    anchorElement: Element;\n    container?: Element;\n    contentHeight?: number;\n    contentWidth: number;\n    direction: DropdownDirection;\n    shouldShowDropdown: boolean;\n}\n\nexport const useDropdown = ({\n    anchorElement,\n    container,\n    contentHeight,\n    contentWidth,\n    direction,\n    shouldShowDropdown,\n}: UseDropdownOptions) => {\n    const { shouldUseTopAlignment, coordinates, availableMaxHeight } = useDropdownPosition({\n        anchorElement,\n        container,\n        contentHeight,\n        direction,\n        shouldShowDropdown,\n    });\n\n    const transform = useDropdownAlignment({\n        anchorElement,\n        contentWidth,\n        direction,\n        shouldUseTopAlignment,\n    });\n\n    const width = anchorElement.clientWidth;\n\n    return useMemo(\n        () => ({ coordinates, transform, width, availableMaxHeight }),\n        [availableMaxHeight, coordinates, transform, width],\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/utils/file.js.map

@@ -1 +1 @@
-{"version":3,"file":"file.js","names":["hasDuplicate","items","newItem","comparator","some","item","exports","filterDuplicateFile","files","newFile","a","b","name","size","filterDuplicateFileUrls","getHumanSize","bytes","FILE_SIZE_UNITS","unitIndex","Math","round","toString","replace","isValidFileType","types","file","allowedTypesArray","split","map","type","trim","fileType","endsWith","baseType","slice","startsWith","MIME_TYPE_MAPPING","getIconByMimeType","mimeType","matchedType","Object","keys","find"],"sources":["../../../src/utils/file.ts"],"sourcesContent":["import type { UploadedFile } from '../components/file-select/FileSelect';\n\nexport const hasDuplicate = <T>(\n    items: T[],\n    newItem: T,\n    comparator: (a: T, b: T) => boolean,\n): boolean => items.some((item) => comparator(item, newItem));\n\ninterface FilerDuplicateFileOptions {\n    files: File[];\n    newFile: File;\n}\n\nexport const filterDuplicateFile = ({ files, newFile }: FilerDuplicateFileOptions) =>\n    hasDuplicate(files, newFile, (a, b) => a.name === b.name && a.size === b.size);\n\ninterface FilterDuplicateFileUrlsOptions {\n    files: UploadedFile[];\n    newFile: UploadedFile;\n}\n\nexport const filterDuplicateFileUrls = ({ files, newFile }: FilterDuplicateFileUrlsOptions) =>\n    hasDuplicate(files, newFile, (a, b) => a === b);\n\nexport const getHumanSize = (bytes: number): string => {\n    const FILE_SIZE_UNITS = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];\n    let size = bytes || 0;\n    let unitIndex = 0;\n\n    while (size >= 1024) {\n        size /= 1024;\n        unitIndex += 1;\n    }\n\n    size = Math.round(size * 10) / 10;\n\n    return `${size.toString().replace('.', ',')} ${FILE_SIZE_UNITS[unitIndex] ?? ''}`;\n};\n\ninterface IsValidFileTypeOptions {\n    file: File;\n    types: string;\n}\n\nexport const isValidFileType = ({ types, file }: IsValidFileTypeOptions) => {\n    const allowedTypesArray = types.split(',').map((type) => type.trim());\n    const fileType = file.type;\n\n    return allowedTypesArray.some((type) => {\n        if (type.endsWith('/*')) {\n            const baseType = type.slice(0, -2); // remove '/*'\n            return fileType.startsWith(baseType);\n        }\n        return fileType === type;\n    });\n};\n\nexport const MIME_TYPE_MAPPING: Record<string, string> = {\n    // Haupttypen\n    'application/pdf': 'fa fa-file-pdf',\n    'application/zip': 'fa fa-file-archive',\n    'application/msword': 'fa fa-file-word',\n    'application/vnd.ms-excel': 'fa fa-file-excel',\n    // Typen mit Wildcards\n    'application/vnd.openxmlformats-officedocument.': 'fa fa-file-word',\n    'application/x-': 'fa fa-file-archive',\n    // Addiere nur spezifische Fälle\n    'text/pdf': 'fa fa-file-pdf',\n};\n\nexport const getIconByMimeType = (mimeType?: string): string => {\n    const matchedType = Object.keys(MIME_TYPE_MAPPING).find((type) => mimeType?.startsWith(type));\n    return MIME_TYPE_MAPPING[matchedType!] || 'fa fa-file';\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"file.js","names":["hasDuplicate","items","newItem","comparator","some","item","exports","filterDuplicateFile","files","newFile","a","b","name","size","filterDuplicateFileUrls","getHumanSize","bytes","FILE_SIZE_UNITS","unitIndex","Math","round","toString","replace","isValidFileType","types","file","allowedTypesArray","split","map","type","trim","fileType","endsWith","baseType","slice","startsWith","MIME_TYPE_MAPPING","getIconByMimeType","mimeType","matchedType","Object","keys","find"],"sources":["../../../src/utils/file.ts"],"sourcesContent":["import { UploadedFile } from '../components/file-select/FileSelect';\n\nexport const hasDuplicate = <T>(\n    items: T[],\n    newItem: T,\n    comparator: (a: T, b: T) => boolean,\n): boolean => items.some((item) => comparator(item, newItem));\n\ninterface FilerDuplicateFileOptions {\n    files: File[];\n    newFile: File;\n}\n\nexport const filterDuplicateFile = ({ files, newFile }: FilerDuplicateFileOptions) =>\n    hasDuplicate(files, newFile, (a, b) => a.name === b.name && a.size === b.size);\n\ninterface FilterDuplicateFileUrlsOptions {\n    files: UploadedFile[];\n    newFile: UploadedFile;\n}\n\nexport const filterDuplicateFileUrls = ({ files, newFile }: FilterDuplicateFileUrlsOptions) =>\n    hasDuplicate(files, newFile, (a, b) => a === b);\n\nexport const getHumanSize = (bytes: number): string => {\n    const FILE_SIZE_UNITS = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];\n    let size = bytes || 0;\n    let unitIndex = 0;\n\n    while (size >= 1024) {\n        size /= 1024;\n        unitIndex += 1;\n    }\n\n    size = Math.round(size * 10) / 10;\n\n    return `${size.toString().replace('.', ',')} ${FILE_SIZE_UNITS[unitIndex] ?? ''}`;\n};\n\ninterface IsValidFileTypeOptions {\n    file: File;\n    types: string;\n}\n\nexport const isValidFileType = ({ types, file }: IsValidFileTypeOptions) => {\n    const allowedTypesArray = types.split(',').map((type) => type.trim());\n    const fileType = file.type;\n\n    return allowedTypesArray.some((type) => {\n        if (type.endsWith('/*')) {\n            const baseType = type.slice(0, -2); // remove '/*'\n            return fileType.startsWith(baseType);\n        }\n        return fileType === type;\n    });\n};\n\nexport const MIME_TYPE_MAPPING: Record<string, string> = {\n    // Haupttypen\n    'application/pdf': 'fa fa-file-pdf',\n    'application/zip': 'fa fa-file-archive',\n    'application/msword': 'fa fa-file-word',\n    'application/vnd.ms-excel': 'fa fa-file-excel',\n    // Typen mit Wildcards\n    'application/vnd.openxmlformats-officedocument.': 'fa fa-file-word',\n    'application/x-': 'fa fa-file-archive',\n    // Addiere nur spezifische Fälle\n    'text/pdf': 'fa fa-file-pdf',\n};\n\nexport const getIconByMimeType = (mimeType?: string): string => {\n    const matchedType = Object.keys(MIME_TYPE_MAPPING).find((type) => mimeType?.startsWith(type));\n    return MIME_TYPE_MAPPING[matchedType!] || 'fa fa-file';\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/accordion/Accordion.js

@@ -1,9 +1,7 @@
 import { AnimatePresence, MotionConfig } from 'motion/react';
 import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { useUuid } from '../../hooks/uuid';
-import { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';
 import { AreaContext } from '../area-provider/AreaContextProvider';
-import { useColorScheme } from '../color-scheme-provider/ColorSchemeProvider';
 import AccordionBody from './accordion-body/AccordionBody';
 import { AccordionGroupContext } from './accordion-group/AccordionGroup';
 import AccordionHead from './accordion-head/AccordionHead';
@@ -43,19 +41,14 @@ const Accordion = ({
   shouldSkipAnimation: shouldSkipAnimationProp = false,
   colors,
   shouldIndex = false,
-  onBodyAnimationComplete,
-  shouldEnableKeyboardHighlighting
+  onBodyAnimationComplete
 }) => {
   const {
     isWrapped: groupIsWrapped,
     openAccordionUuid,
     accordionGroupUuid,
     accordionUuids,
-    updateOpenAccordionUuid,
-    activeAccordionUuid,
-    updateActiveAccordionUuid,
-    registerAccordionUuid,
-    unregisterAccordionUuid
+    updateOpenAccordionUuid
   } = useContext(AccordionGroupContext);
   const {
     isWrapped: isParentWrapped
@@ -63,11 +56,8 @@ const Accordion = ({
   const {
     isWrapped: contextIsWrapped
   } = useContext(AccordionWrappedContext);
-  const colorScheme = useColorScheme();
-  const shouldEnableKeyboardHighlightingEffective = shouldEnableKeyboardHighlighting ?? colorScheme?.shouldEnableKeyboardHighlighting ?? false;
   const isWrapped = useMemo(() => groupIsWrapped ?? contextIsWrapped, [contextIsWrapped, groupIsWrapped]);
   const [isAccordionOpen, setIsAccordionOpen] = useState(isDefaultOpen ?? isOpened);
-  const [isGroupFocusWithin, setIsGroupFocusWithin] = useState(false);
   const uuid = useUuid();
   const isInitialRenderRef = useRef(true);
   const initialRenderSkipRef = useInitialRenderRef(true);
@@ -77,18 +67,6 @@ const Accordion = ({
   const isOpenRef = useRef(isOpen);
   const onCloseRef = useRef(onClose);
   const onOpenRef = useRef(onOpen);
-  const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(shouldEnableKeyboardHighlightingEffective);
-  const isKeyboardFocusable = !isDisabled && (shouldIndex || shouldEnableKeyboardHighlightingEffective);
-  const isInKeyboardNavigationGroup = isKeyboardFocusable && typeof updateActiveAccordionUuid === 'function' && typeof accordionGroupUuid === 'string';
-  useEffect(() => {
-    if (typeof accordionGroupUuid === 'string' && typeof registerAccordionUuid === 'function' && typeof unregisterAccordionUuid === 'function') {
-      registerAccordionUuid(uuid);
-      return () => {
-        unregisterAccordionUuid(uuid);
-      };
-    }
-    return undefined;
-  }, [accordionGroupUuid, registerAccordionUuid, unregisterAccordionUuid, uuid]);
   const isLastAccordion = useMemo(() => accordionUuids ? accordionUuids[accordionUuids.length - 1] === uuid : false, [accordionUuids, uuid]);
   useEffect(() => {
     isOpenRef.current = isOpen;
@@ -99,14 +77,11 @@ const Accordion = ({
     if (isDisabled) {
       return;
     }
-    if (isKeyboardFocusable && typeof updateActiveAccordionUuid === 'function') {
-      updateActiveAccordionUuid(uuid);
-    }
     if (typeof updateOpenAccordionUuid === 'function') {
       updateOpenAccordionUuid(uuid);
     }
     setIsAccordionOpen(currentIsAccordionOpen => !currentIsAccordionOpen);
-  }, [isDisabled, isKeyboardFocusable, updateActiveAccordionUuid, updateOpenAccordionUuid, uuid]);
+  }, [isDisabled, updateOpenAccordionUuid, uuid]);
   useEffect(() => {
     if (isDisabled && isOpen) {
       if (typeof updateOpenAccordionUuid === 'function') {
@@ -170,75 +145,6 @@ const Accordion = ({
       opacity: 0
     };
   }, [isOpen, shouldSkipAnimation]);
-  const tabIndex = useMemo(() => isKeyboardFocusable ? 0 : -1, [isKeyboardFocusable]);
-  const handleKeyDown = useCallback(e => {
-    const isCurrentAccordionTarget = e.currentTarget === e.target;
-    if (isCurrentAccordionTarget && isInKeyboardNavigationGroup && accordionUuids?.length && (e.key === 'ArrowDown' || e.key === 'ArrowUp')) {
-      const currentIndex = accordionUuids.indexOf(uuid);
-      if (currentIndex !== -1) {
-        const nextIndex = e.key === 'ArrowDown' ? (currentIndex + 1) % accordionUuids.length : (currentIndex - 1 + accordionUuids.length) % accordionUuids.length;
-        const nextAccordionUuid = accordionUuids[nextIndex];
-        if (nextAccordionUuid && nextAccordionUuid !== uuid) {
-          const nextAccordionElement = document.querySelector(`[data-uuid="${accordionGroupUuid}---${nextAccordionUuid}"]`);
-          if (nextAccordionElement) {
-            updateActiveAccordionUuid(nextAccordionUuid);
-            nextAccordionElement.focus();
-            return;
-          }
-        }
-      }
-    }
-    if (isCurrentAccordionTarget && (e.key === 'Enter' || e.key === ' ') && isKeyboardFocusable) {
-      handleHeadClick();
-    }
-    if (isCurrentAccordionTarget && e.key === 'ArrowRight' && isKeyboardFocusable && !isOpen) {
-      e.preventDefault();
-      handleHeadClick();
-    }
-    if (isCurrentAccordionTarget && (e.key === 'Escape' || e.key === 'ArrowLeft')) {
-      if (isOpen && isKeyboardFocusable) {
-        e.preventDefault();
-        handleHeadClick();
-        return;
-      }
-      if (isInKeyboardNavigationGroup && typeof updateActiveAccordionUuid === 'function') {
-        e.preventDefault();
-        updateActiveAccordionUuid(undefined);
-        let parentAccordion = e.currentTarget.parentElement?.closest('.beta-chayns-accordion');
-        while (parentAccordion) {
-          const parentGroupId = parentAccordion.getAttribute('data-uuid')?.split('---')[0];
-          if (parentGroupId !== accordionGroupUuid) {
-            parentAccordion.focus();
-            break;
-          }
-          parentAccordion = parentAccordion.parentElement?.closest('.beta-chayns-accordion');
-        }
-      }
-    }
-  }, [accordionGroupUuid, accordionUuids, handleHeadClick, isInKeyboardNavigationGroup, isKeyboardFocusable, isOpen, updateActiveAccordionUuid, uuid]);
-  const handleFocus = useCallback(e => {
-    if (e.currentTarget === e.target && isInKeyboardNavigationGroup && typeof updateActiveAccordionUuid === 'function') {
-      setIsGroupFocusWithin(true);
-      updateActiveAccordionUuid(uuid);
-    }
-  }, [isInKeyboardNavigationGroup, updateActiveAccordionUuid, uuid]);
-  const handleBlur = useCallback(e => {
-    if (isInKeyboardNavigationGroup && typeof updateActiveAccordionUuid === 'function' && typeof accordionGroupUuid === 'string') {
-      const nextFocusedElement = e.relatedTarget;
-      const currentGroupElement = e.currentTarget;
-      if (!nextFocusedElement || !currentGroupElement.contains(nextFocusedElement)) {
-        setIsGroupFocusWithin(false);
-        updateActiveAccordionUuid(undefined);
-      }
-    }
-  }, [accordionGroupUuid, isInKeyboardNavigationGroup, updateActiveAccordionUuid]);
-  useEffect(() => {
-    if (!isInKeyboardNavigationGroup) {
-      setIsGroupFocusWithin(false);
-    } else if (activeAccordionUuid == null && typeof updateActiveAccordionUuid === 'function' && accordionUuids?.[0] === uuid) {
-      updateActiveAccordionUuid(uuid);
-    }
-  }, [accordionUuids, activeAccordionUuid, isInKeyboardNavigationGroup, updateActiveAccordionUuid, uuid]);
   return /*#__PURE__*/React.createElement(StyledMotionAccordion, {
     animate: {
       height: 'auto',
@@ -252,7 +158,7 @@ const Accordion = ({
     },
     initial: initialAnimation,
     $isOpen: isOpen,
-    tabIndex: tabIndex,
+    tabIndex: shouldIndex ? 0 : -1,
     $shouldShowLines: !isLastAccordion || !isWrapped,
     $isParentWrapped: isParentWrapped,
     $isWrapped: isWrapped,
@@ -260,11 +166,13 @@ const Accordion = ({
     $shouldHideBackground: shouldHideBackground,
     $shouldHideBottomLine: shouldHideBottomLine,
     $bottomBorderColor: colors?.borderBottomColor,
-    $shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlightingEffective,
-    $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
-    onKeyDown: handleKeyDown,
-    onFocus: handleFocus,
-    onBlur: handleBlur,
+    onKeyDown: e => {
+      if ((e.key === 'Enter' || e.key === ' ') && e.target.className.includes('beta-chayns-accordion') && shouldIndex) {
+        e.preventDefault();
+        e.stopPropagation();
+        handleHeadClick();
+      }
+    },
     onMouseEnter: onHoverStart,
     onMouseLeave: onHoverEnd,
     transition: {
@@ -294,8 +202,7 @@ const Accordion = ({
     titleElement: titleElement,
     onTitleInputChange: onTitleInputChange,
     titleInputProps: titleInputProps,
-    titleColor: colors?.titleColor,
-    shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlightingEffective
+    titleColor: colors?.titleColor
   }), /*#__PURE__*/React.createElement(AnimatePresence, {
     initial: false
   }, (isOpen || shouldRenderClosed) && /*#__PURE__*/React.createElement(AccordionBody, {

package/lib/esm/components/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","names":["AnimatePresence","MotionConfig","React","useCallback","useContext","useEffect","useMemo","useRef","useState","useUuid","useKeyboardFocusHighlighting","AreaContext","useColorScheme","AccordionBody","AccordionGroupContext","AccordionHead","AccordionWrappedContext","StyledMotionAccordion","useInitialRenderRef","AccordionContext","createContext","isWrapped","undefined","Accordion","bodyMaxHeight","children","icon","isDefaultOpen","isDisabled","isFixed","isOpened","isTitleGreyed","onBodyScroll","onClose","onHoverEnd","onHoverStart","onOpen","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldForceBackground","shouldHideBackground","shouldRenderClosed","shouldRotateIcon","shouldHideBottomLine","title","titleElement","onTitleInputChange","titleInputProps","shouldSkipAnimation","shouldSkipAnimationProp","colors","shouldIndex","onBodyAnimationComplete","shouldEnableKeyboardHighlighting","groupIsWrapped","openAccordionUuid","accordionGroupUuid","accordionUuids","updateOpenAccordionUuid","activeAccordionUuid","updateActiveAccordionUuid","registerAccordionUuid","unregisterAccordionUuid","isParentWrapped","contextIsWrapped","colorScheme","shouldEnableKeyboardHighlightingEffective","isAccordionOpen","setIsAccordionOpen","isGroupFocusWithin","setIsGroupFocusWithin","uuid","isInitialRenderRef","initialRenderSkipRef","current","isInGroup","isOpen","isOpenRef","onCloseRef","onOpenRef","shouldShowKeyboardHighlighting","isKeyboardFocusable","isInKeyboardNavigationGroup","isLastAccordion","length","handleHeadClick","currentIsAccordionOpen","shouldOnlyOpen","accordionContextProviderValue","areaContextProviderValue","shouldChangeColor","accordionWrappedContextProviderValue","initialAnimation","height","opacity","tabIndex","handleKeyDown","e","isCurrentAccordionTarget","currentTarget","target","key","currentIndex","indexOf","nextIndex","nextAccordionUuid","nextAccordionElement","document","querySelector","focus","preventDefault","parentAccordion","parentElement","closest","parentGroupId","getAttribute","split","handleFocus","handleBlur","nextFocusedElement","relatedTarget","currentGroupElement","contains","createElement","animate","className","exit","initial","$isOpen","$shouldShowLines","$isParentWrapped","$isWrapped","$shouldForceBackground","$shouldHideBackground","$shouldHideBottomLine","$bottomBorderColor","borderBottomColor","$shouldEnableKeyboardHighlighting","$shouldShowKeyboardHighlighting","onKeyDown","onFocus","onBlur","onMouseEnter","onMouseLeave","transition","duration","Provider","value","type","onClick","titleColor","maxHeight","onScroll","onAnimationComplete","shouldHideBody","displayName"],"sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { AnimatePresence, MotionConfig } from 'motion/react';\nimport React, {\n    ChangeEventHandler,\n    type CSSProperties,\n    FC,\n    type MouseEventHandler,\n    ReactNode,\n    UIEvent,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    KeyboardEvent,\n    FocusEvent,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport { useColorScheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputProps } from '../input/Input';\nimport AccordionBody from './accordion-body/AccordionBody';\nimport { AccordionGroupContext } from './accordion-group/AccordionGroup';\nimport AccordionHead from './accordion-head/AccordionHead';\nimport { AccordionWrappedContext } from './accordion-provider/AccordionContextProvider';\nimport { StyledMotionAccordion } from './Accordion.styles';\nimport { useInitialRenderRef } from '../../hooks/ref';\n\nexport const AccordionContext = React.createContext<{ isWrapped?: boolean }>({\n    isWrapped: undefined,\n});\n\ntype AccordionColors = {\n    titleColor?: CSSProperties['color'];\n    borderBottomColor?: CSSProperties['borderBottomColor'];\n};\n\nexport type AccordionProps = {\n    /**\n     * Maximum height of the accordion body element. This automatically makes the content of the\n     * body element scrollable.\n     */\n    bodyMaxHeight?: number;\n    /**\n     * The content of the accordion body\n     */\n    children: ReactNode;\n    /**\n     * The icon that is displayed in front of the title\n     */\n    icon?: string;\n    /**\n     * This can be used to automatically expand the Accordion during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This will disable the Accordion so that it cannot be opened and will gray out the title. Does not work with isOpened.\n     */\n    isDisabled?: boolean;\n    /**\n     * This can be used so that the Accordion cannot be opened or closed.\n     * In addition, in this case the icon is exchanged to mark the Accordions.\n     */\n    isFixed?: boolean;\n    /**\n     * This can be used to open the Accordion from the outside\n     */\n    isOpened?: boolean;\n    /**\n     * This will gray out the title of the Accordion to indicate hidden content, for example.\n     */\n    isTitleGreyed?: boolean;\n    /**\n     * Function that is executed when the accordion body will be scrolled\n     */\n    onBodyScroll?: (event: UIEvent<HTMLDivElement>) => void;\n    /**\n     * Function that is executed when the accordion will be closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the accordion is no longer hovered.\n     */\n    onHoverEnd?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the accordion is hovered.\n     */\n    onHoverStart?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function that is executed when the accordion will be opened.\n     */\n    onOpen?: VoidFunction;\n    /**\n     * Function that is executed when the accordion body is animated\n     */\n    onBodyAnimationComplete?: VoidFunction;\n    /**\n     * Function that is executed when the text of the search in the accordion\n     * head changes. When this function is given, the search field is displayed\n     * in the Accordion Head.\n     */\n    onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function that is executed when the text of the search in the accordion\n     * title changes. When this function is given, the search field is displayed\n     * as the Accordion title.\n     */\n    onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Content to be displayed on the right side in the head of the Accordion\n     */\n    rightElement?: ReactNode;\n    /**\n     * The placeholder to be used for the search\n     */\n    searchPlaceholder?: string;\n    /**\n     * The value that is displayed inside the search\n     */\n    searchValue?: string;\n    /**\n     * This will force the background color of the accordion to be used even if it is closed and not hovered.\n     */\n    shouldForceBackground?: boolean;\n    /**\n     * This will hide the background color of the accordion\n     */\n    shouldHideBackground?: boolean;\n    /**\n     * Whether the bottom line should be hidden.\n     */\n    shouldHideBottomLine?: boolean;\n    /**\n     * This will render the Accordion closed on the first render.\n     */\n    shouldRenderClosed?: boolean;\n    /**\n     * Whether the icon should be rotating.\n     */\n    shouldRotateIcon?: boolean;\n    /**\n     * Whether the animation should be skipped.\n     * If 'isDefaultOpen' is true the initial animation will be skipped even this prop is false\n     */\n    shouldSkipAnimation?: boolean;\n    /**\n     * Title of the Accordion displayed in the head\n     */\n    title?: string;\n    /**\n     * Additional elements to be displayed in the header next to the title.\n     */\n    titleElement?: ReactNode;\n    /**\n     * The props of the title Input.\n     */\n    titleInputProps?: InputProps;\n    /**\n     * Provide custom colors to the Accordion Component\n     */\n    colors?: AccordionColors;\n    /**\n     * Whether the accordion should be indexed.\n     */\n    shouldIndex?: boolean;\n    /**\n     * Enables keyboard-only focus highlighting. The highlighting is only visible while the\n     * user navigates with the keyboard and is reset on mouse movement or click.\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst Accordion: FC<AccordionProps> = ({\n    bodyMaxHeight,\n    children,\n    icon,\n    isDefaultOpen = false,\n    isDisabled = false,\n    isFixed = false,\n    isOpened,\n    isTitleGreyed = false,\n    onBodyScroll,\n    onClose,\n    onHoverEnd,\n    onHoverStart,\n    onOpen,\n    onSearchChange,\n    rightElement,\n    searchPlaceholder,\n    searchValue,\n    shouldForceBackground = false,\n    shouldHideBackground = false,\n    shouldRenderClosed = false,\n    shouldRotateIcon = true,\n    shouldHideBottomLine = false,\n    title,\n    titleElement,\n    onTitleInputChange,\n    titleInputProps,\n    shouldSkipAnimation: shouldSkipAnimationProp = false,\n    colors,\n    shouldIndex = false,\n    onBodyAnimationComplete,\n    shouldEnableKeyboardHighlighting,\n}) => {\n    const {\n        isWrapped: groupIsWrapped,\n        openAccordionUuid,\n        accordionGroupUuid,\n        accordionUuids,\n        updateOpenAccordionUuid,\n        activeAccordionUuid,\n        updateActiveAccordionUuid,\n        registerAccordionUuid,\n        unregisterAccordionUuid,\n    } = useContext(AccordionGroupContext);\n    const { isWrapped: isParentWrapped } = useContext(AccordionContext);\n\n    const { isWrapped: contextIsWrapped } = useContext(AccordionWrappedContext);\n    const colorScheme = useColorScheme();\n    const shouldEnableKeyboardHighlightingEffective =\n        shouldEnableKeyboardHighlighting ?? colorScheme?.shouldEnableKeyboardHighlighting ?? false;\n\n    const isWrapped = useMemo(\n        () => groupIsWrapped ?? contextIsWrapped,\n        [contextIsWrapped, groupIsWrapped],\n    );\n\n    const [isAccordionOpen, setIsAccordionOpen] = useState<boolean>(isDefaultOpen ?? isOpened);\n    const [isGroupFocusWithin, setIsGroupFocusWithin] = useState(false);\n\n    const uuid = useUuid();\n\n    const isInitialRenderRef = useRef(true);\n\n    const initialRenderSkipRef = useInitialRenderRef(true);\n\n    const shouldSkipAnimation =\n        shouldSkipAnimationProp ?? (initialRenderSkipRef.current && isDefaultOpen);\n\n    const isInGroup = shouldSkipAnimation ? false : typeof updateOpenAccordionUuid === 'function';\n\n    const isOpen = isInGroup ? openAccordionUuid === uuid : isAccordionOpen;\n\n    const isOpenRef = useRef(isOpen);\n    const onCloseRef = useRef(onClose);\n    const onOpenRef = useRef(onOpen);\n    const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n        shouldEnableKeyboardHighlightingEffective,\n    );\n    const isKeyboardFocusable =\n        !isDisabled && (shouldIndex || shouldEnableKeyboardHighlightingEffective);\n\n    const isInKeyboardNavigationGroup =\n        isKeyboardFocusable &&\n        typeof updateActiveAccordionUuid === 'function' &&\n        typeof accordionGroupUuid === 'string';\n\n    useEffect(() => {\n        if (\n            typeof accordionGroupUuid === 'string' &&\n            typeof registerAccordionUuid === 'function' &&\n            typeof unregisterAccordionUuid === 'function'\n        ) {\n            registerAccordionUuid(uuid);\n\n            return () => {\n                unregisterAccordionUuid(uuid);\n            };\n        }\n\n        return undefined;\n    }, [accordionGroupUuid, registerAccordionUuid, unregisterAccordionUuid, uuid]);\n\n    const isLastAccordion = useMemo(\n        () => (accordionUuids ? accordionUuids[accordionUuids.length - 1] === uuid : false),\n        [accordionUuids, uuid],\n    );\n\n    useEffect(() => {\n        isOpenRef.current = isOpen;\n        onCloseRef.current = onClose;\n        onOpenRef.current = onOpen;\n    }, [isOpen, onClose, onOpen]);\n\n    const handleHeadClick = useCallback(() => {\n        if (isDisabled) {\n            return;\n        }\n\n        if (isKeyboardFocusable && typeof updateActiveAccordionUuid === 'function') {\n            updateActiveAccordionUuid(uuid);\n        }\n\n        if (typeof updateOpenAccordionUuid === 'function') {\n            updateOpenAccordionUuid(uuid);\n        }\n\n        setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n    }, [isDisabled, isKeyboardFocusable, updateActiveAccordionUuid, updateOpenAccordionUuid, uuid]);\n\n    useEffect(() => {\n        if (isDisabled && isOpen) {\n            if (typeof updateOpenAccordionUuid === 'function') {\n                updateOpenAccordionUuid(uuid);\n            }\n\n            setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n        }\n    }, [isDisabled, isOpen, updateOpenAccordionUuid, uuid]);\n\n    useEffect(() => {\n        if (isInitialRenderRef.current) {\n            isInitialRenderRef.current = false;\n        } else if (isOpen) {\n            if (typeof onOpenRef.current === 'function') {\n                onOpenRef.current();\n            }\n        } else if (typeof onCloseRef.current === 'function') {\n            onCloseRef.current();\n        }\n    }, [isOpen]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            if (typeof updateOpenAccordionUuid === 'function') {\n                updateOpenAccordionUuid(uuid, { shouldOnlyOpen: true });\n            } else {\n                setIsAccordionOpen(true);\n            }\n        }\n    }, [isDefaultOpen, updateOpenAccordionUuid, uuid]);\n\n    useEffect(() => {\n        if (typeof isOpened === 'boolean') {\n            if (typeof updateOpenAccordionUuid === 'function' && isOpened !== isOpenRef.current) {\n                updateOpenAccordionUuid(uuid);\n            } else {\n                setIsAccordionOpen(isOpened);\n            }\n        }\n    }, [isOpened, updateOpenAccordionUuid, uuid]);\n\n    const accordionContextProviderValue = useMemo(\n        () => ({ isWrapped: isWrapped === true }),\n        [isWrapped],\n    );\n\n    const areaContextProviderValue = useMemo(\n        () => ({ shouldChangeColor: !shouldHideBackground }),\n        [shouldHideBackground],\n    );\n\n    const accordionWrappedContextProviderValue = useMemo(() => ({ isWrapped: true }), []);\n\n    const initialAnimation = useMemo(() => {\n        if (shouldSkipAnimation) {\n            return { height: 'auto', opacity: 1 };\n        }\n\n        return isOpen ? { height: 'auto', opacity: 1 } : { height: 0, opacity: 0 };\n    }, [isOpen, shouldSkipAnimation]);\n\n    const tabIndex = useMemo(() => (isKeyboardFocusable ? 0 : -1), [isKeyboardFocusable]);\n\n    const handleKeyDown = useCallback(\n        (e: KeyboardEvent<HTMLDivElement>) => {\n            const isCurrentAccordionTarget = e.currentTarget === e.target;\n\n            if (\n                isCurrentAccordionTarget &&\n                isInKeyboardNavigationGroup &&\n                accordionUuids?.length &&\n                (e.key === 'ArrowDown' || e.key === 'ArrowUp')\n            ) {\n                const currentIndex = accordionUuids.indexOf(uuid);\n\n                if (currentIndex !== -1) {\n                    const nextIndex =\n                        e.key === 'ArrowDown'\n                            ? (currentIndex + 1) % accordionUuids.length\n                            : (currentIndex - 1 + accordionUuids.length) % accordionUuids.length;\n                    const nextAccordionUuid = accordionUuids[nextIndex];\n\n                    if (nextAccordionUuid && nextAccordionUuid !== uuid) {\n                        const nextAccordionElement = document.querySelector<HTMLDivElement>(\n                            `[data-uuid=\"${accordionGroupUuid}---${nextAccordionUuid}\"]`,\n                        );\n\n                        if (nextAccordionElement) {\n                            updateActiveAccordionUuid(nextAccordionUuid);\n                            nextAccordionElement.focus();\n                            return;\n                        }\n                    }\n                }\n            }\n\n            if (\n                isCurrentAccordionTarget &&\n                (e.key === 'Enter' || e.key === ' ') &&\n                isKeyboardFocusable\n            ) {\n                handleHeadClick();\n            }\n\n            if (\n                isCurrentAccordionTarget &&\n                e.key === 'ArrowRight' &&\n                isKeyboardFocusable &&\n                !isOpen\n            ) {\n                e.preventDefault();\n                handleHeadClick();\n            }\n\n            if (isCurrentAccordionTarget && (e.key === 'Escape' || e.key === 'ArrowLeft')) {\n                if (isOpen && isKeyboardFocusable) {\n                    e.preventDefault();\n                    handleHeadClick();\n                    return;\n                }\n\n                if (\n                    isInKeyboardNavigationGroup &&\n                    typeof updateActiveAccordionUuid === 'function'\n                ) {\n                    e.preventDefault();\n                    updateActiveAccordionUuid(undefined);\n                    let parentAccordion =\n                        e.currentTarget.parentElement?.closest<HTMLElement>(\n                            '.beta-chayns-accordion',\n                        );\n                    while (parentAccordion) {\n                        const parentGroupId = parentAccordion\n                            .getAttribute('data-uuid')\n                            ?.split('---')[0];\n                        if (parentGroupId !== accordionGroupUuid) {\n                            parentAccordion.focus();\n                            break;\n                        }\n                        parentAccordion =\n                            parentAccordion.parentElement?.closest<HTMLElement>(\n                                '.beta-chayns-accordion',\n                            );\n                    }\n                }\n            }\n        },\n        [\n            accordionGroupUuid,\n            accordionUuids,\n            handleHeadClick,\n            isInKeyboardNavigationGroup,\n            isKeyboardFocusable,\n            isOpen,\n            updateActiveAccordionUuid,\n            uuid,\n        ],\n    );\n\n    const handleFocus = useCallback(\n        (e: FocusEvent<HTMLDivElement>) => {\n            if (\n                e.currentTarget === e.target &&\n                isInKeyboardNavigationGroup &&\n                typeof updateActiveAccordionUuid === 'function'\n            ) {\n                setIsGroupFocusWithin(true);\n                updateActiveAccordionUuid(uuid);\n            }\n        },\n        [isInKeyboardNavigationGroup, updateActiveAccordionUuid, uuid],\n    );\n\n    const handleBlur = useCallback(\n        (e: FocusEvent<HTMLDivElement>) => {\n            if (\n                isInKeyboardNavigationGroup &&\n                typeof updateActiveAccordionUuid === 'function' &&\n                typeof accordionGroupUuid === 'string'\n            ) {\n                const nextFocusedElement = e.relatedTarget as Node | null;\n                const currentGroupElement = e.currentTarget as HTMLElement;\n\n                if (!nextFocusedElement || !currentGroupElement.contains(nextFocusedElement)) {\n                    setIsGroupFocusWithin(false);\n                    updateActiveAccordionUuid(undefined);\n                }\n            }\n        },\n        [accordionGroupUuid, isInKeyboardNavigationGroup, updateActiveAccordionUuid],\n    );\n\n    useEffect(() => {\n        if (!isInKeyboardNavigationGroup) {\n            setIsGroupFocusWithin(false);\n        } else if (\n            activeAccordionUuid == null &&\n            typeof updateActiveAccordionUuid === 'function' &&\n            accordionUuids?.[0] === uuid\n        ) {\n            updateActiveAccordionUuid(uuid);\n        }\n    }, [\n        accordionUuids,\n        activeAccordionUuid,\n        isInKeyboardNavigationGroup,\n        updateActiveAccordionUuid,\n        uuid,\n    ]);\n\n    return (\n        <StyledMotionAccordion\n            animate={{ height: 'auto', opacity: 1 }}\n            data-uuid={`${accordionGroupUuid ?? ''}---${uuid}`}\n            className=\"beta-chayns-accordion\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={initialAnimation}\n            $isOpen={isOpen}\n            tabIndex={tabIndex}\n            $shouldShowLines={!isLastAccordion || !isWrapped}\n            $isParentWrapped={isParentWrapped}\n            $isWrapped={isWrapped}\n            $shouldForceBackground={shouldForceBackground}\n            $shouldHideBackground={shouldHideBackground}\n            $shouldHideBottomLine={shouldHideBottomLine}\n            $bottomBorderColor={colors?.borderBottomColor}\n            $shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlightingEffective}\n            $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n            onKeyDown={handleKeyDown}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            onMouseEnter={onHoverStart}\n            onMouseLeave={onHoverEnd}\n            transition={{ duration: shouldSkipAnimation ? 0 : 0.25 }}\n        >\n            <AccordionContext.Provider value={accordionContextProviderValue}>\n                <MotionConfig transition={{ type: 'tween' }}>\n                    <AccordionHead\n                        uuid={uuid}\n                        icon={icon}\n                        isOpen={isOpen}\n                        shouldSkipAnimation={shouldSkipAnimation}\n                        isFixed={isFixed}\n                        isTitleGreyed={isTitleGreyed || isDisabled}\n                        isWrapped={isWrapped === true}\n                        onClick={handleHeadClick}\n                        onSearchChange={onSearchChange}\n                        rightElement={rightElement}\n                        searchPlaceholder={searchPlaceholder}\n                        searchValue={searchValue}\n                        shouldRotateIcon={shouldRotateIcon}\n                        title={title}\n                        titleElement={titleElement}\n                        onTitleInputChange={onTitleInputChange}\n                        titleInputProps={titleInputProps}\n                        titleColor={colors?.titleColor}\n                        shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlightingEffective}\n                    />\n                    <AnimatePresence initial={false}>\n                        {(isOpen || shouldRenderClosed) && (\n                            <AccordionBody\n                                shouldSkipAnimation={shouldSkipAnimation}\n                                maxHeight={bodyMaxHeight}\n                                onScroll={onBodyScroll}\n                                onAnimationComplete={onBodyAnimationComplete}\n                                shouldHideBody={shouldRenderClosed && !isOpen}\n                            >\n                                <AccordionWrappedContext.Provider\n                                    value={accordionWrappedContextProviderValue}\n                                >\n                                    <AreaContext.Provider value={areaContextProviderValue}>\n                                        {children}\n                                    </AreaContext.Provider>\n                                </AccordionWrappedContext.Provider>\n                            </AccordionBody>\n                        )}\n                    </AnimatePresence>\n                </MotionConfig>\n            </AccordionContext.Provider>\n        </StyledMotionAccordion>\n    );\n};\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Accordion.js","names":["AnimatePresence","MotionConfig","React","useCallback","useContext","useEffect","useMemo","useRef","useState","useUuid","AreaContext","AccordionBody","AccordionGroupContext","AccordionHead","AccordionWrappedContext","StyledMotionAccordion","useInitialRenderRef","AccordionContext","createContext","isWrapped","undefined","Accordion","bodyMaxHeight","children","icon","isDefaultOpen","isDisabled","isFixed","isOpened","isTitleGreyed","onBodyScroll","onClose","onHoverEnd","onHoverStart","onOpen","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldForceBackground","shouldHideBackground","shouldRenderClosed","shouldRotateIcon","shouldHideBottomLine","title","titleElement","onTitleInputChange","titleInputProps","shouldSkipAnimation","shouldSkipAnimationProp","colors","shouldIndex","onBodyAnimationComplete","groupIsWrapped","openAccordionUuid","accordionGroupUuid","accordionUuids","updateOpenAccordionUuid","isParentWrapped","contextIsWrapped","isAccordionOpen","setIsAccordionOpen","uuid","isInitialRenderRef","initialRenderSkipRef","current","isInGroup","isOpen","isOpenRef","onCloseRef","onOpenRef","isLastAccordion","length","handleHeadClick","currentIsAccordionOpen","shouldOnlyOpen","accordionContextProviderValue","areaContextProviderValue","shouldChangeColor","accordionWrappedContextProviderValue","initialAnimation","height","opacity","createElement","animate","className","exit","initial","$isOpen","tabIndex","$shouldShowLines","$isParentWrapped","$isWrapped","$shouldForceBackground","$shouldHideBackground","$shouldHideBottomLine","$bottomBorderColor","borderBottomColor","onKeyDown","e","key","target","includes","preventDefault","stopPropagation","onMouseEnter","onMouseLeave","transition","duration","Provider","value","type","onClick","titleColor","maxHeight","onScroll","onAnimationComplete","shouldHideBody","displayName"],"sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { AnimatePresence, MotionConfig } from 'motion/react';\nimport React, {\n    ChangeEventHandler,\n    type CSSProperties,\n    FC,\n    type MouseEventHandler,\n    ReactNode,\n    UIEvent,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { InputProps } from '../input/Input';\nimport AccordionBody from './accordion-body/AccordionBody';\nimport { AccordionGroupContext } from './accordion-group/AccordionGroup';\nimport AccordionHead from './accordion-head/AccordionHead';\nimport { AccordionWrappedContext } from './accordion-provider/AccordionContextProvider';\nimport { StyledMotionAccordion } from './Accordion.styles';\nimport { useInitialRenderRef } from '../../hooks/ref';\n\nexport const AccordionContext = React.createContext<{ isWrapped?: boolean }>({\n    isWrapped: undefined,\n});\n\ntype AccordionColors = {\n    titleColor?: CSSProperties['color'];\n    borderBottomColor?: CSSProperties['borderBottomColor'];\n};\n\nexport type AccordionProps = {\n    /**\n     * Maximum height of the accordion body element. This automatically makes the content of the\n     * body element scrollable.\n     */\n    bodyMaxHeight?: number;\n    /**\n     * The content of the accordion body\n     */\n    children: ReactNode;\n    /**\n     * The icon that is displayed in front of the title\n     */\n    icon?: string;\n    /**\n     * This can be used to automatically expand the Accordion during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This will disable the Accordion so that it cannot be opened and will gray out the title. Does not work with isOpened.\n     */\n    isDisabled?: boolean;\n    /**\n     * This can be used so that the Accordion cannot be opened or closed.\n     * In addition, in this case the icon is exchanged to mark the Accordions.\n     */\n    isFixed?: boolean;\n    /**\n     * This can be used to open the Accordion from the outside\n     */\n    isOpened?: boolean;\n    /**\n     * This will gray out the title of the Accordion to indicate hidden content, for example.\n     */\n    isTitleGreyed?: boolean;\n    /**\n     * Function that is executed when the accordion body will be scrolled\n     */\n    onBodyScroll?: (event: UIEvent<HTMLDivElement>) => void;\n    /**\n     * Function that is executed when the accordion will be closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the accordion is no longer hovered.\n     */\n    onHoverEnd?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the accordion is hovered.\n     */\n    onHoverStart?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function that is executed when the accordion will be opened.\n     */\n    onOpen?: VoidFunction;\n    /**\n     * Function that is executed when the accordion body is animated\n     */\n    onBodyAnimationComplete?: VoidFunction;\n    /**\n     * Function that is executed when the text of the search in the accordion\n     * head changes. When this function is given, the search field is displayed\n     * in the Accordion Head.\n     */\n    onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function that is executed when the text of the search in the accordion\n     * title changes. When this function is given, the search field is displayed\n     * as the Accordion title.\n     */\n    onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Content to be displayed on the right side in the head of the Accordion\n     */\n    rightElement?: ReactNode;\n    /**\n     * The placeholder to be used for the search\n     */\n    searchPlaceholder?: string;\n    /**\n     * The value that is displayed inside the search\n     */\n    searchValue?: string;\n    /**\n     * This will force the background color of the accordion to be used even if it is closed and not hovered.\n     */\n    shouldForceBackground?: boolean;\n    /**\n     * This will hide the background color of the accordion\n     */\n    shouldHideBackground?: boolean;\n    /**\n     * Whether the bottom line should be hidden.\n     */\n    shouldHideBottomLine?: boolean;\n    /**\n     * This will render the Accordion closed on the first render.\n     */\n    shouldRenderClosed?: boolean;\n    /**\n     * Whether the icon should be rotating.\n     */\n    shouldRotateIcon?: boolean;\n    /**\n     * Whether the animation should be skipped.\n     * If 'isDefaultOpen' is true the initial animation will be skipped even this prop is false\n     */\n    shouldSkipAnimation?: boolean;\n    /**\n     * Title of the Accordion displayed in the head\n     */\n    title?: string;\n    /**\n     * Additional elements to be displayed in the header next to the title.\n     */\n    titleElement?: ReactNode;\n    /**\n     * The props of the title Input.\n     */\n    titleInputProps?: InputProps;\n    /**\n     * Provide custom colors to the Accordion Component\n     */\n    colors?: AccordionColors;\n    /**\n     * Whether the accordion should be indexed.\n     */\n    shouldIndex?: boolean;\n};\n\nconst Accordion: FC<AccordionProps> = ({\n    bodyMaxHeight,\n    children,\n    icon,\n    isDefaultOpen = false,\n    isDisabled = false,\n    isFixed = false,\n    isOpened,\n    isTitleGreyed = false,\n    onBodyScroll,\n    onClose,\n    onHoverEnd,\n    onHoverStart,\n    onOpen,\n    onSearchChange,\n    rightElement,\n    searchPlaceholder,\n    searchValue,\n    shouldForceBackground = false,\n    shouldHideBackground = false,\n    shouldRenderClosed = false,\n    shouldRotateIcon = true,\n    shouldHideBottomLine = false,\n    title,\n    titleElement,\n    onTitleInputChange,\n    titleInputProps,\n    shouldSkipAnimation: shouldSkipAnimationProp = false,\n    colors,\n    shouldIndex = false,\n    onBodyAnimationComplete,\n}) => {\n    const {\n        isWrapped: groupIsWrapped,\n        openAccordionUuid,\n        accordionGroupUuid,\n        accordionUuids,\n        updateOpenAccordionUuid,\n    } = useContext(AccordionGroupContext);\n    const { isWrapped: isParentWrapped } = useContext(AccordionContext);\n\n    const { isWrapped: contextIsWrapped } = useContext(AccordionWrappedContext);\n    const isWrapped = useMemo(\n        () => groupIsWrapped ?? contextIsWrapped,\n        [contextIsWrapped, groupIsWrapped],\n    );\n\n    const [isAccordionOpen, setIsAccordionOpen] = useState<boolean>(isDefaultOpen ?? isOpened);\n\n    const uuid = useUuid();\n\n    const isInitialRenderRef = useRef(true);\n\n    const initialRenderSkipRef = useInitialRenderRef(true);\n\n    const shouldSkipAnimation =\n        shouldSkipAnimationProp ?? (initialRenderSkipRef.current && isDefaultOpen);\n\n    const isInGroup = shouldSkipAnimation ? false : typeof updateOpenAccordionUuid === 'function';\n\n    const isOpen = isInGroup ? openAccordionUuid === uuid : isAccordionOpen;\n\n    const isOpenRef = useRef(isOpen);\n    const onCloseRef = useRef(onClose);\n    const onOpenRef = useRef(onOpen);\n\n    const isLastAccordion = useMemo(\n        () => (accordionUuids ? accordionUuids[accordionUuids.length - 1] === uuid : false),\n        [accordionUuids, uuid],\n    );\n\n    useEffect(() => {\n        isOpenRef.current = isOpen;\n        onCloseRef.current = onClose;\n        onOpenRef.current = onOpen;\n    }, [isOpen, onClose, onOpen]);\n\n    const handleHeadClick = useCallback(() => {\n        if (isDisabled) {\n            return;\n        }\n\n        if (typeof updateOpenAccordionUuid === 'function') {\n            updateOpenAccordionUuid(uuid);\n        }\n\n        setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n    }, [isDisabled, updateOpenAccordionUuid, uuid]);\n\n    useEffect(() => {\n        if (isDisabled && isOpen) {\n            if (typeof updateOpenAccordionUuid === 'function') {\n                updateOpenAccordionUuid(uuid);\n            }\n\n            setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n        }\n    }, [isDisabled, isOpen, updateOpenAccordionUuid, uuid]);\n\n    useEffect(() => {\n        if (isInitialRenderRef.current) {\n            isInitialRenderRef.current = false;\n        } else if (isOpen) {\n            if (typeof onOpenRef.current === 'function') {\n                onOpenRef.current();\n            }\n        } else if (typeof onCloseRef.current === 'function') {\n            onCloseRef.current();\n        }\n    }, [isOpen]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            if (typeof updateOpenAccordionUuid === 'function') {\n                updateOpenAccordionUuid(uuid, { shouldOnlyOpen: true });\n            } else {\n                setIsAccordionOpen(true);\n            }\n        }\n    }, [isDefaultOpen, updateOpenAccordionUuid, uuid]);\n\n    useEffect(() => {\n        if (typeof isOpened === 'boolean') {\n            if (typeof updateOpenAccordionUuid === 'function' && isOpened !== isOpenRef.current) {\n                updateOpenAccordionUuid(uuid);\n            } else {\n                setIsAccordionOpen(isOpened);\n            }\n        }\n    }, [isOpened, updateOpenAccordionUuid, uuid]);\n\n    const accordionContextProviderValue = useMemo(\n        () => ({ isWrapped: isWrapped === true }),\n        [isWrapped],\n    );\n\n    const areaContextProviderValue = useMemo(\n        () => ({ shouldChangeColor: !shouldHideBackground }),\n        [shouldHideBackground],\n    );\n\n    const accordionWrappedContextProviderValue = useMemo(() => ({ isWrapped: true }), []);\n\n    const initialAnimation = useMemo(() => {\n        if (shouldSkipAnimation) {\n            return { height: 'auto', opacity: 1 };\n        }\n\n        return isOpen ? { height: 'auto', opacity: 1 } : { height: 0, opacity: 0 };\n    }, [isOpen, shouldSkipAnimation]);\n\n    return (\n        <StyledMotionAccordion\n            animate={{ height: 'auto', opacity: 1 }}\n            data-uuid={`${accordionGroupUuid ?? ''}---${uuid}`}\n            className=\"beta-chayns-accordion\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={initialAnimation}\n            $isOpen={isOpen}\n            tabIndex={shouldIndex ? 0 : -1}\n            $shouldShowLines={!isLastAccordion || !isWrapped}\n            $isParentWrapped={isParentWrapped}\n            $isWrapped={isWrapped}\n            $shouldForceBackground={shouldForceBackground}\n            $shouldHideBackground={shouldHideBackground}\n            $shouldHideBottomLine={shouldHideBottomLine}\n            $bottomBorderColor={colors?.borderBottomColor}\n            onKeyDown={(e) => {\n                if (\n                    (e.key === 'Enter' || e.key === ' ') &&\n                    (e.target as HTMLDivElement).className.includes('beta-chayns-accordion') &&\n                    shouldIndex\n                ) {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    handleHeadClick();\n                }\n            }}\n            onMouseEnter={onHoverStart}\n            onMouseLeave={onHoverEnd}\n            transition={{ duration: shouldSkipAnimation ? 0 : 0.25 }}\n        >\n            <AccordionContext.Provider value={accordionContextProviderValue}>\n                <MotionConfig transition={{ type: 'tween' }}>\n                    <AccordionHead\n                        uuid={uuid}\n                        icon={icon}\n                        isOpen={isOpen}\n                        shouldSkipAnimation={shouldSkipAnimation}\n                        isFixed={isFixed}\n                        isTitleGreyed={isTitleGreyed || isDisabled}\n                        isWrapped={isWrapped === true}\n                        onClick={handleHeadClick}\n                        onSearchChange={onSearchChange}\n                        rightElement={rightElement}\n                        searchPlaceholder={searchPlaceholder}\n                        searchValue={searchValue}\n                        shouldRotateIcon={shouldRotateIcon}\n                        title={title}\n                        titleElement={titleElement}\n                        onTitleInputChange={onTitleInputChange}\n                        titleInputProps={titleInputProps}\n                        titleColor={colors?.titleColor}\n                    />\n                    <AnimatePresence initial={false}>\n                        {(isOpen || shouldRenderClosed) && (\n                            <AccordionBody\n                                shouldSkipAnimation={shouldSkipAnimation}\n                                maxHeight={bodyMaxHeight}\n                                onScroll={onBodyScroll}\n                                onAnimationComplete={onBodyAnimationComplete}\n                                shouldHideBody={shouldRenderClosed && !isOpen}\n                            >\n                                <AccordionWrappedContext.Provider\n                                    value={accordionWrappedContextProviderValue}\n                                >\n                                    <AreaContext.Provider value={areaContextProviderValue}>\n                                        {children}\n                                    </AreaContext.Provider>\n                                </AccordionWrappedContext.Provider>\n                            </AccordionBody>\n                        )}\n                    </AnimatePresence>\n                </MotionConfig>\n            </AccordionContext.Provider>\n        </StyledMotionAccordion>\n    );\n};\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/accordion/Accordion.styles.js

@@ -1,6 +1,5 @@
 import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
-import { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';
 export const StyledMotionAccordion = styled(motion.div)`
     ${({
   $isOpen,
@@ -70,30 +69,11 @@ export const StyledMotionAccordion = styled(motion.div)`
     ${({
   $isWrapped,
   $shouldHideBackground,
-  theme,
-  $shouldEnableKeyboardHighlighting
+  theme
 }) => !$isWrapped && !$shouldHideBackground && css`
-            &:hover {
-                background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});
-            }
-            ${!$shouldEnableKeyboardHighlighting ? css`
-                      &:focus-visible {
-                          background-color: rgba(
-                              ${theme['100-rgb']},
-                              ${theme.cardBackgroundOpacity}
-                          );
-                      }
-                  ` : null}
-        `};
-
-    ${({
-  $shouldEnableKeyboardHighlighting,
-  $shouldShowKeyboardHighlighting,
-  $shouldHideBackground
-}) => $shouldEnableKeyboardHighlighting && $shouldShowKeyboardHighlighting && !$shouldHideBackground && css`
+            &:hover,
             &:focus-visible {
-                transition: none;
-                ${keyboardFocusHighlightingRingCss};
+                background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});
             }
         `};
 `;

package/lib/esm/components/accordion/Accordion.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.styles.js","names":["motion","styled","css","keyboardFocusHighlightingRingCss","StyledMotionAccordion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","shouldShowBottomBorder","$isParentWrapped","$shouldEnableKeyboardHighlighting","$shouldShowKeyboardHighlighting"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';\n\ntype StyledMotionAccordionProps = WithTheme<{\n    $isOpen: boolean;\n    $isParentWrapped?: boolean;\n    $isWrapped?: boolean;\n    $shouldForceBackground?: boolean;\n    $shouldHideBackground?: boolean;\n    $shouldShowLines?: boolean;\n    $shouldHideBottomLine: boolean;\n    $bottomBorderColor?: string;\n    $shouldEnableKeyboardHighlighting?: boolean;\n    $shouldShowKeyboardHighlighting?: boolean;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n    ${({\n        $isOpen,\n        $isWrapped,\n        $shouldForceBackground,\n        $shouldHideBackground,\n        theme,\n    }: StyledMotionAccordionProps) =>\n        ($isOpen || $shouldForceBackground) &&\n        !$isWrapped &&\n        !$shouldHideBackground &&\n        css`\n            background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n            border-radius: ${theme.cardBorderRadius}px;\n            box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n        `}\n\n    ${({ theme }: StyledMotionAccordionProps) =>\n        theme.accordionLines &&\n        css`\n            border-bottom: 1px solid transparent;\n        `}\n\n    margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n        $isOpen && !$isWrapped ? '30px' : '0px'};\n    transition:\n        background-color 0.3s ease,\n        border-bottom-color 0.3s ease,\n        border-radius 0.3s ease,\n        box-shadow 0.3s ease,\n        margin-bottom 0.3s ease;\n    will-change: unset !important;\n\n    margin-top: 10px;\n\n    ${({\n        $isOpen,\n        $isWrapped,\n        $shouldForceBackground,\n        $shouldShowLines,\n        $shouldHideBottomLine,\n        theme,\n        $bottomBorderColor,\n    }: StyledMotionAccordionProps) => {\n        if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n        const shouldShowBottomBorder =\n            theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);\n\n        if ($bottomBorderColor && shouldShowBottomBorder)\n            return css`\n                border-bottom-color: ${$bottomBorderColor};\n            `;\n\n        if (shouldShowBottomBorder) {\n            return css`\n                border-bottom-color: rgba(${theme['headline-rgb']}, 1);\n            `;\n        }\n\n        return undefined;\n    }}\n    ${({ $isParentWrapped }: StyledMotionAccordionProps) =>\n        $isParentWrapped &&\n        css`\n            padding-left: 17px;\n        `}\n    ${({ $isWrapped }: StyledMotionAccordionProps) =>\n        !$isWrapped\n            ? css`\n                  margin-top: 5px;\n              `\n            : css`\n                  margin: 0;\n              `}\n    ${({\n        $isWrapped,\n        $shouldHideBackground,\n        theme,\n        $shouldEnableKeyboardHighlighting,\n    }: StyledMotionAccordionProps) =>\n        !$isWrapped &&\n        !$shouldHideBackground &&\n        css`\n            &:hover {\n                background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n            }\n            ${!$shouldEnableKeyboardHighlighting\n                ? css`\n                      &:focus-visible {\n                          background-color: rgba(\n                              ${theme['100-rgb']},\n                              ${theme.cardBackgroundOpacity}\n                          );\n                      }\n                  `\n                : null}\n        `};\n\n    ${({\n        $shouldEnableKeyboardHighlighting,\n        $shouldShowKeyboardHighlighting,\n        $shouldHideBackground,\n    }: StyledMotionAccordionProps) =>\n        $shouldEnableKeyboardHighlighting &&\n        $shouldShowKeyboardHighlighting &&\n        !$shouldHideBackground &&\n        css`\n            &:focus-visible {\n                transition: none;\n                ${keyboardFocusHighlightingRingCss};\n            }\n        `};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,gCAAgC,QAAQ,8CAA8C;AAe/F,OAAO,MAAMC,qBAAqB,GAAGH,MAAM,CAACD,MAAM,CAACK,GAAG,CAA6B;AACnF,MAAM,CAAC;EACCC,OAAO;EACPC,UAAU;EACVC,sBAAsB;EACtBC,qBAAqB;EACrBC;AACwB,CAAC,KACzB,CAACJ,OAAO,IAAIE,sBAAsB,KAClC,CAACD,UAAU,IACX,CAACE,qBAAqB,IACtBP,GAAG;AACX,qCAAqCQ,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACrF,6BAA6BD,KAAK,CAACE,gBAAgB;AACnD,oDAAoDF,KAAK,CAACG,UAAU;AACpE,SAAS;AACT;AACA,MAAM,CAAC;EAAEH;AAAkC,CAAC,KACpCA,KAAK,CAACI,cAAc,IACpBZ,GAAG;AACX;AACA,SAAS;AACT;AACA,qBAAqB,CAAC;EAAEI,OAAO;EAAEC;AAAuC,CAAC,KACjED,OAAO,IAAI,CAACC,UAAU,GAAG,MAAM,GAAG,KAAK;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EACCD,OAAO;EACPC,UAAU;EACVC,sBAAsB;EACtBO,gBAAgB;EAChBC,qBAAqB;EACrBN,KAAK;EACLO;AACwB,CAAC,KAAK;EAC9B,IAAIT,sBAAsB,IAAIQ,qBAAqB,EAAE,OAAOE,SAAS;EACrE,MAAMC,sBAAsB,GACxBT,KAAK,CAACI,cAAc,IAAIC,gBAAgB,KAAKR,UAAU,IAAI,CAACD,OAAO,CAAC;EAExE,IAAIW,kBAAkB,IAAIE,sBAAsB,EAC5C,OAAOjB,GAAG;AACtB,uCAAuCe,kBAAkB;AACzD,aAAa;EAEL,IAAIE,sBAAsB,EAAE;IACxB,OAAOjB,GAAG;AACtB,4CAA4CQ,KAAK,CAAC,cAAc,CAAC;AACjE,aAAa;EACL;EAEA,OAAOQ,SAAS;AACpB,CAAC;AACL,MAAM,CAAC;EAAEE;AAA6C,CAAC,KAC/CA,gBAAgB,IAChBlB,GAAG;AACX;AACA,SAAS;AACT,MAAM,CAAC;EAAEK;AAAuC,CAAC,KACzC,CAACA,UAAU,GACLL,GAAG;AACjB;AACA,eAAe,GACDA,GAAG;AACjB;AACA,eAAe;AACf,MAAM,CAAC;EACCK,UAAU;EACVE,qBAAqB;EACrBC,KAAK;EACLW;AACwB,CAAC,KACzB,CAACd,UAAU,IACX,CAACE,qBAAqB,IACtBP,GAAG;AACX;AACA,yCAAyCQ,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACzF;AACA,cAAc,CAACU,iCAAiC,GAC9BnB,GAAG;AACrB;AACA;AACA,gCAAgCQ,KAAK,CAAC,SAAS,CAAC;AAChD,gCAAgCA,KAAK,CAACC,qBAAqB;AAC3D;AACA;AACA,mBAAmB,GACD,IAAI;AACtB,SAAS;AACT;AACA,MAAM,CAAC;EACCU,iCAAiC;EACjCC,+BAA+B;EAC/Bb;AACwB,CAAC,KACzBY,iCAAiC,IACjCC,+BAA+B,IAC/B,CAACb,qBAAqB,IACtBP,GAAG;AACX;AACA;AACA,kBAAkBC,gCAAgC;AAClD;AACA,SAAS;AACT,CAAC","ignoreList":[]}
+{"version":3,"file":"Accordion.styles.js","names":["motion","styled","css","StyledMotionAccordion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","shouldShowBottomBorder","$isParentWrapped"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionProps = WithTheme<{\n    $isOpen: boolean;\n    $isParentWrapped?: boolean;\n    $isWrapped?: boolean;\n    $shouldForceBackground?: boolean;\n    $shouldHideBackground?: boolean;\n    $shouldShowLines?: boolean;\n    $shouldHideBottomLine: boolean;\n    $bottomBorderColor?: string;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n    ${({\n        $isOpen,\n        $isWrapped,\n        $shouldForceBackground,\n        $shouldHideBackground,\n        theme,\n    }: StyledMotionAccordionProps) =>\n        ($isOpen || $shouldForceBackground) &&\n        !$isWrapped &&\n        !$shouldHideBackground &&\n        css`\n            background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n            border-radius: ${theme.cardBorderRadius}px;\n            box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n        `}\n\n    ${({ theme }: StyledMotionAccordionProps) =>\n        theme.accordionLines &&\n        css`\n            border-bottom: 1px solid transparent;\n        `}\n\n    margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n        $isOpen && !$isWrapped ? '30px' : '0px'};\n    transition:\n        background-color 0.3s ease,\n        border-bottom-color 0.3s ease,\n        border-radius 0.3s ease,\n        box-shadow 0.3s ease,\n        margin-bottom 0.3s ease;\n    will-change: unset !important;\n\n    margin-top: 10px;\n\n    ${({\n        $isOpen,\n        $isWrapped,\n        $shouldForceBackground,\n        $shouldShowLines,\n        $shouldHideBottomLine,\n        theme,\n        $bottomBorderColor,\n    }: StyledMotionAccordionProps) => {\n        if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n        const shouldShowBottomBorder =\n            theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);\n\n        if ($bottomBorderColor && shouldShowBottomBorder)\n            return css`\n                border-bottom-color: ${$bottomBorderColor};\n            `;\n\n        if (shouldShowBottomBorder) {\n            return css`\n                border-bottom-color: rgba(${theme['headline-rgb']}, 1);\n            `;\n        }\n\n        return undefined;\n    }}\n    ${({ $isParentWrapped }: StyledMotionAccordionProps) =>\n        $isParentWrapped &&\n        css`\n            padding-left: 17px;\n        `}\n    ${({ $isWrapped }: StyledMotionAccordionProps) =>\n        !$isWrapped\n            ? css`\n                  margin-top: 5px;\n              `\n            : css`\n                  margin: 0;\n              `}\n    ${({ $isWrapped, $shouldHideBackground, theme }: StyledMotionAccordionProps) =>\n        !$isWrapped &&\n        !$shouldHideBackground &&\n        css`\n            &:hover,\n            &:focus-visible {\n                background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n            }\n        `};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAc/C,OAAO,MAAMC,qBAAqB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAA6B;AACnF,MAAM,CAAC;EACCC,OAAO;EACPC,UAAU;EACVC,sBAAsB;EACtBC,qBAAqB;EACrBC;AACwB,CAAC,KACzB,CAACJ,OAAO,IAAIE,sBAAsB,KAClC,CAACD,UAAU,IACX,CAACE,qBAAqB,IACtBN,GAAG;AACX,qCAAqCO,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACrF,6BAA6BD,KAAK,CAACE,gBAAgB;AACnD,oDAAoDF,KAAK,CAACG,UAAU;AACpE,SAAS;AACT;AACA,MAAM,CAAC;EAAEH;AAAkC,CAAC,KACpCA,KAAK,CAACI,cAAc,IACpBX,GAAG;AACX;AACA,SAAS;AACT;AACA,qBAAqB,CAAC;EAAEG,OAAO;EAAEC;AAAuC,CAAC,KACjED,OAAO,IAAI,CAACC,UAAU,GAAG,MAAM,GAAG,KAAK;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EACCD,OAAO;EACPC,UAAU;EACVC,sBAAsB;EACtBO,gBAAgB;EAChBC,qBAAqB;EACrBN,KAAK;EACLO;AACwB,CAAC,KAAK;EAC9B,IAAIT,sBAAsB,IAAIQ,qBAAqB,EAAE,OAAOE,SAAS;EACrE,MAAMC,sBAAsB,GACxBT,KAAK,CAACI,cAAc,IAAIC,gBAAgB,KAAKR,UAAU,IAAI,CAACD,OAAO,CAAC;EAExE,IAAIW,kBAAkB,IAAIE,sBAAsB,EAC5C,OAAOhB,GAAG;AACtB,uCAAuCc,kBAAkB;AACzD,aAAa;EAEL,IAAIE,sBAAsB,EAAE;IACxB,OAAOhB,GAAG;AACtB,4CAA4CO,KAAK,CAAC,cAAc,CAAC;AACjE,aAAa;EACL;EAEA,OAAOQ,SAAS;AACpB,CAAC;AACL,MAAM,CAAC;EAAEE;AAA6C,CAAC,KAC/CA,gBAAgB,IAChBjB,GAAG;AACX;AACA,SAAS;AACT,MAAM,CAAC;EAAEI;AAAuC,CAAC,KACzC,CAACA,UAAU,GACLJ,GAAG;AACjB;AACA,eAAe,GACDA,GAAG;AACjB;AACA,eAAe;AACf,MAAM,CAAC;EAAEI,UAAU;EAAEE,qBAAqB;EAAEC;AAAkC,CAAC,KACvE,CAACH,UAAU,IACX,CAACE,qBAAqB,IACtBN,GAAG;AACX;AACA;AACA,yCAAyCO,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACzF;AACA,SAAS;AACT,CAAC","ignoreList":[]}

package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js

@@ -1,9 +1,7 @@
 import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 export const StyledMotionAccordionBody = styled(motion.div)`
-    /* overflow: clip erlaubt overflow-clip-margin, sodass der Fokusring sichtbar bleibt */
-    overflow: clip;
-    overflow-clip-margin: 4px;
+    overflow: hidden;
     transition: none !important;
 
     ${({

package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionBody.styles.js","names":["motion","styled","css","StyledMotionAccordionBody","div","$maxHeight"],"sources":["../../../../../src/components/accordion/accordion-body/AccordionBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionBodyProps = WithTheme<{\n    $maxHeight?: number;\n}>;\n\nexport const StyledMotionAccordionBody = styled(motion.div)<StyledMotionAccordionBodyProps>`\n    /* overflow: clip erlaubt overflow-clip-margin, sodass der Fokusring sichtbar bleibt */\n    overflow: clip;\n    overflow-clip-margin: 4px;\n    transition: none !important;\n\n    ${({ $maxHeight }) =>\n        typeof $maxHeight === 'number' &&\n        css`\n            max-height: ${$maxHeight}px;\n            overflow-y: scroll;\n        `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAO/C,OAAO,MAAMC,yBAAyB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAAiC;AAC3F;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,OAAOA,UAAU,KAAK,QAAQ,IAC9BH,GAAG;AACX,0BAA0BG,UAAU;AACpC;AACA,SAAS;AACT,CAAC","ignoreList":[]}
+{"version":3,"file":"AccordionBody.styles.js","names":["motion","styled","css","StyledMotionAccordionBody","div","$maxHeight"],"sources":["../../../../../src/components/accordion/accordion-body/AccordionBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionBodyProps = WithTheme<{\n    $maxHeight?: number;\n}>;\n\nexport const StyledMotionAccordionBody = styled(motion.div)<StyledMotionAccordionBodyProps>`\n    overflow: hidden;\n    transition: none !important;\n\n    ${({ $maxHeight }) =>\n        typeof $maxHeight === 'number' &&\n        css`\n            max-height: ${$maxHeight}px;\n            overflow-y: scroll;\n        `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAO/C,OAAO,MAAMC,yBAAyB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAAiC;AAC3F;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,OAAOA,UAAU,KAAK,QAAQ,IAC9BH,GAAG;AACX,0BAA0BG,UAAU;AACpC;AACA,SAAS;AACT,CAAC","ignoreList":[]}

package/lib/esm/components/accordion/accordion-group/AccordionGroup.js

@@ -8,10 +8,7 @@ export const AccordionGroupContext = /*#__PURE__*/React.createContext({
   setOpenAccordionUuid: undefined,
   updateOpenAccordionUuid: undefined,
   accordionUuids: undefined,
-  registerAccordionUuid: undefined,
-  unregisterAccordionUuid: undefined,
-  activeAccordionUuid: undefined,
-  updateActiveAccordionUuid: undefined,
+  updateAccordionUuids: undefined,
   accordionGroupUuid: undefined
 });
 AccordionGroupContext.displayName = 'AccordionGroupContext';
@@ -23,10 +20,13 @@ const AccordionGroup = ({
 }) => {
   const [openAccordionUuid, setOpenAccordionUuid] = useState(undefined);
   const [accordionUuids, setAccordionUuids] = useState();
-  const [activeAccordionUuid, setActiveAccordionUuid] = useState(undefined);
   const accordionGroupId = useUuid();
   const isInitialRenderRef = useRef(true);
+  const updateAccordionUuids = useCallback(uuids => {
+    setAccordionUuids(uuids);
+  }, []);
   const areaProvider = useContext(AreaContext);
+  const childrenCount = React.Children.count(children);
   const shouldWrap = areaProvider.shouldChangeColor ? true : isWrapped;
   const updateOpenAccordionUuid = useCallback((uuid, {
     shouldOnlyOpen
@@ -38,30 +38,19 @@ const AccordionGroup = ({
       return uuid;
     });
   }, [setOpenAccordionUuid]);
-  const sortAccordionUuidsByDom = useCallback(uuids => {
-    if (typeof document === 'undefined') return uuids;
-    const domOrderedUuids = Array.from(document.querySelectorAll(`[data-uuid^="${accordionGroupId}---"]`)).map(element => element.getAttribute('data-uuid')?.split('---')[1]).filter(uuid => Boolean(uuid));
-    return domOrderedUuids.filter(uuid => uuids.includes(uuid));
-  }, [accordionGroupId]);
-  const registerAccordionUuid = useCallback(uuid => {
-    setAccordionUuids((currentAccordionUuids = []) => {
-      const nextAccordionUuids = currentAccordionUuids.includes(uuid) ? currentAccordionUuids : [...currentAccordionUuids, uuid];
-      return sortAccordionUuidsByDom(nextAccordionUuids);
-    });
-  }, [sortAccordionUuidsByDom]);
-  const unregisterAccordionUuid = useCallback(uuid => {
-    setAccordionUuids((currentAccordionUuids = []) => currentAccordionUuids.filter(currentUuid => currentUuid !== uuid));
-  }, []);
-  const updateActiveAccordionUuid = useCallback(uuid => {
-    setActiveAccordionUuid(uuid);
-  }, []);
   useEffect(() => {
-    if (!accordionUuids?.length) {
-      setActiveAccordionUuid(undefined);
-      return;
-    }
-    setActiveAccordionUuid(currentActiveAccordionUuid => currentActiveAccordionUuid && accordionUuids.includes(currentActiveAccordionUuid) ? currentActiveAccordionUuid : undefined);
-  }, [accordionUuids]);
+    if (childrenCount === 0) return;
+    const elements = document.querySelectorAll('[data-uuid]');
+    const elementUuids = Array.from(elements).map(el => el.getAttribute('data-uuid'));
+    const result = [];
+    elementUuids.forEach(elementUuid => {
+      const [groupUuid, accordionUuid] = (elementUuid ?? '').split('---');
+      if (groupUuid === accordionGroupId && typeof accordionUuid === 'string') {
+        result.push(accordionUuid);
+      }
+    });
+    updateAccordionUuids(result);
+  }, [accordionGroupId, childrenCount, updateAccordionUuids]);
   useEffect(() => {
     if (isInitialRenderRef.current) {
       isInitialRenderRef.current = false;
@@ -78,13 +67,10 @@ const AccordionGroup = ({
     openAccordionUuid,
     setOpenAccordionUuid,
     updateOpenAccordionUuid,
+    updateAccordionUuids,
     accordionUuids,
-    registerAccordionUuid,
-    unregisterAccordionUuid,
-    activeAccordionUuid,
-    updateActiveAccordionUuid,
     accordionGroupUuid: accordionGroupId
-  }), [accordionGroupId, accordionUuids, shouldWrap, openAccordionUuid, registerAccordionUuid, unregisterAccordionUuid, updateOpenAccordionUuid, activeAccordionUuid, updateActiveAccordionUuid]);
+  }), [accordionGroupId, accordionUuids, shouldWrap, openAccordionUuid, updateAccordionUuids, updateOpenAccordionUuid]);
   return /*#__PURE__*/React.createElement(AccordionGroupContext.Provider, {
     value: providerValue
   }, /*#__PURE__*/React.createElement(MotionConfig, {