@chayns-components/core 5.3.12-alpha.0 → 5.4.5-alpha.0

package/lib/esm/components/context-menu/ContextMenu.js

@@ -8,7 +8,7 @@ import Icon from '../icon/Icon';
 import ContextMenuContent from './context-menu-content/ContextMenuContent';
 import { StyledContextMenu } from './ContextMenu.styles';
 import { ContextMenuAlignment } from './ContextMenu.types';
-import { getDefaultFocusedIndex } from './ContextMenu.utils';
+import { getActiveItemIndex, getDefaultFocusedIndex, selectItem } from './ContextMenu.utils';
 import { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';
 const ContextMenu = /*#__PURE__*/forwardRef(({
   alignment,
@@ -73,35 +73,13 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
   const handleHide = useCallback(() => {
     setIsContentShown(false);
   }, []);
-  useEffect(() => {
-    if (!isContentShown) return () => {};
-    const handleKey = e => {
-      if (items.length === 0 || isHovered) return;
-      if (e.key === 'ArrowDown') {
-        e.preventDefault();
-        setFocusedIndex(prev => prev >= items.length - 1 ? 0 : prev + 1);
-      }
-      if (e.key === 'ArrowUp') {
-        e.preventDefault();
-        setFocusedIndex(prev => prev <= 0 ? items.length - 1 : prev - 1);
-      }
-      if (e.key === 'Enter') {
-        e.preventDefault();
-        const item = items[focusedIndex];
-        if (item) {
-          void item.onClick();
-          if (shouldCloseOnPopupClick) {
-            handleHide();
-          }
-        }
-      }
-      if (e.key === 'Escape') {
-        handleHide();
-      }
-    };
-    document.addEventListener('keydown', handleKey);
-    return () => document.removeEventListener('keydown', handleKey);
-  }, [isContentShown, items, focusedIndex, handleHide, shouldCloseOnPopupClick, isHovered]);
+  const handleContainerBlur = useCallback(event => {
+    const nextFocusedElement = event.relatedTarget;
+    const currentContainer = event.currentTarget;
+    if (!nextFocusedElement || !currentContainer.contains(nextFocusedElement) && !contextMenuContentRef.current?.contains(nextFocusedElement)) {
+      handleHide();
+    }
+  }, [handleHide]);
   const handleShow = useCallback(async () => {
     if (isTouch) {
       const {
@@ -173,8 +151,44 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
     if (shouldDisableClick) {
       return;
     }
-    const isContextMenuShortcut = event.key === 'ContextMenu' || event.key === 'F10' && event.shiftKey;
     const isActivationKey = event.key === 'Enter' || event.key === ' ' || event.key === 'Spacebar';
+    if (isContentShown && event.key === 'Escape') {
+      event.preventDefault();
+      event.stopPropagation();
+      handleHide();
+      return;
+    }
+    if (isContentShown && !isHovered && event.key === 'ArrowDown') {
+      event.preventDefault();
+      event.stopPropagation();
+      setFocusedIndex(prev => prev >= items.length - 1 ? 0 : prev + 1);
+      return;
+    }
+    if (isContentShown && !isHovered && event.key === 'ArrowUp') {
+      event.preventDefault();
+      event.stopPropagation();
+      setFocusedIndex(prev => prev <= 0 ? items.length - 1 : prev - 1);
+      return;
+    }
+    if (isContentShown && isActivationKey) {
+      if (selectItem({
+        index: getActiveItemIndex({
+          contextMenuContentElement: contextMenuContentRef.current,
+          focusedIndex
+        }),
+        items,
+        onClose: handleHide,
+        shouldCloseOnPopupClick
+      })) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+      return;
+    }
+    if (event.currentTarget !== event.target) {
+      return;
+    }
+    const isContextMenuShortcut = event.key === 'ContextMenu' || event.key === 'F10' && event.shiftKey;
     if (isContextMenuShortcut) {
       event.preventDefault();
       event.stopPropagation();
@@ -187,7 +201,7 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
       event.stopPropagation();
       void handleShow();
     }
-  }, [handleShow, shouldDisableClick, shouldUseFocusableWrapper]);
+  }, [focusedIndex, handleHide, handleShow, isHovered, isContentShown, items, items.length, shouldCloseOnPopupClick, shouldDisableClick, shouldUseFocusableWrapper]);
   const handleContextMenu = useCallback(event => {
     event.preventDefault();
     event.stopPropagation();
@@ -280,13 +294,7 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
       alignment: alignment ?? internalAlignment,
       ref: contextMenuContentRef,
       focusedIndex: focusedIndex,
-      onKeySelect: index => {
-        const item = items[index];
-        if (item) {
-          void item.onClick();
-          handleHide();
-        }
-      },
+      onItemFocus: setFocusedIndex,
       onMouseEnter: () => {
         setIsHovered(true);
         setFocusedIndex(-1);
@@ -314,6 +322,7 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
     onContextMenuCapture: handleContextMenu,
     onContextMenu: handleContextMenu,
     onKeyDown: handleKeyDown,
+    onBlur: handleContainerBlur,
     ref: contextMenuRef,
     tabIndex: shouldUseKeyboardFocusableWrapper ? 0 : undefined,
     role: shouldUseKeyboardFocusableWrapper ? 'button' : undefined,

package/lib/esm/components/context-menu/ContextMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.js","names":["createDialog","DialogType","AnimatePresence","React","forwardRef","isValidElement","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","useIsTouch","Icon","ContextMenuContent","StyledContextMenu","ContextMenuAlignment","getDefaultFocusedIndex","useKeyboardFocusHighlighting","ContextMenu","alignment","className","children","createElement","icons","size","container","coordinates","headline","items","onHide","onShow","shouldCloseOnPopupClick","shouldDisableClick","shouldHidePopupArrow","shouldShowHoverEffect","shouldEnableKeyboardHighlighting","shouldUseDefaultTriggerStyles","style","yOffset","zIndex","ref","internalCoordinates","setInternalCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","newContainer","setNewContainer","focusedIndex","setFocusedIndex","isContentShown","setIsContentShown","portal","setPortal","isHovered","setIsHovered","shouldUseFocusableWrapper","setShouldUseFocusableWrapper","uuid","contextMenuContentRef","contextMenuRef","shouldSkipNextContextMenuOpenRef","shouldPreventNextNativeContextMenuRef","isTouch","shouldShowKeyboardHighlighting","shouldShowWrapperKeyboardHighlighting","shouldUseKeyboardFocusableWrapper","current","el","element","closest","Element","handleHide","handleKey","e","length","key","preventDefault","prev","item","onClick","document","addEventListener","removeEventListener","handleShow","result","type","SELECT","buttons","list","map","text","isSelected","index","name","id","icon","undefined","open","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","zoomX","offsetWidth","zoomY","offsetHeight","scrollLeft","scrollTop","BottomRight","TopRight","BottomLeft","handleClick","event","stopPropagation","handleKeyDown","isContextMenuShortcut","shiftKey","isActivationKey","handleContextMenu","handleGlobalKeyDown","activeElement","HTMLElement","body","documentElement","shouldOpenFromFocusedParent","contains","handleNativeContextMenuCapture","hide","show","handleDocumentClick","target","window","initial","onKeySelect","onMouseEnter","onMouseLeave","focusableChildSelector","hasFocusableChild","Boolean","querySelector","Fragment","$isActive","$shouldAddHoverEffect","$shouldShowWrapperKeyboardHighlighting","$shouldUseDefaultTriggerStyles","onContextMenuCapture","onContextMenu","onKeyDown","tabIndex","role","displayName"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'motion/react';\nimport React, {\n    forwardRef,\n    isValidElement,\n    KeyboardEventHandler,\n    MouseEvent,\n    MouseEventHandler,\n    ReactPortal,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { useIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\nimport {\n    ContextMenuAlignment,\n    type ContextMenuCoordinates,\n    type ContextMenuProps,\n    type ContextMenuRef,\n} from './ContextMenu.types';\nimport { SelectDialogResult } from '../../types/general';\nimport { getDefaultFocusedIndex } from './ContextMenu.utils';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nconst ContextMenu = forwardRef<ContextMenuRef, ContextMenuProps>(\n    (\n        {\n            alignment,\n            className,\n            children = <Icon icons={['ts-ellipsis_v']} size={18} />,\n            container,\n            coordinates,\n            headline,\n            items,\n            onHide,\n            onShow,\n            shouldCloseOnPopupClick = true,\n            shouldDisableClick = false,\n            shouldHidePopupArrow = false,\n            shouldShowHoverEffect = false,\n            shouldEnableKeyboardHighlighting,\n            shouldUseDefaultTriggerStyles = true,\n            style,\n            yOffset = 0,\n            zIndex = 20,\n        },\n        ref,\n    ) => {\n        const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n            x: 0,\n            y: 0,\n        });\n\n        const [internalAlignment, setInternalAlignment] = useState<ContextMenuAlignment>(\n            ContextMenuAlignment.TopLeft,\n        );\n\n        const [newContainer, setNewContainer] = useState(container ?? null);\n        const [focusedIndex, setFocusedIndex] = useState(getDefaultFocusedIndex(items));\n        const [isContentShown, setIsContentShown] = useState(false);\n        const [portal, setPortal] = useState<ReactPortal>();\n        const [isHovered, setIsHovered] = useState(false);\n        const [shouldUseFocusableWrapper, setShouldUseFocusableWrapper] = useState(false);\n\n        const uuid = useUuid();\n\n        const contextMenuContentRef = useRef<HTMLDivElement>(null);\n        const contextMenuRef = useRef<HTMLSpanElement>(null);\n        const shouldSkipNextContextMenuOpenRef = useRef(false);\n        const shouldPreventNextNativeContextMenuRef = useRef(false);\n\n        const isTouch = useIsTouch();\n        const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n            shouldEnableKeyboardHighlighting && !shouldDisableClick,\n        );\n        const shouldShowWrapperKeyboardHighlighting =\n            shouldShowKeyboardHighlighting && shouldUseFocusableWrapper;\n        const shouldUseKeyboardFocusableWrapper = shouldUseFocusableWrapper && !shouldDisableClick;\n\n        useEffect(() => {\n            if (isContentShown) {\n                setFocusedIndex(getDefaultFocusedIndex(items));\n            }\n        }, [isContentShown, items]);\n\n        useEffect(() => {\n            if (contextMenuRef.current && !container) {\n                const el = contextMenuRef.current as HTMLElement;\n\n                const element = el.closest('.dialog-inner, .page-provider, .tapp, body');\n\n                setNewContainer(element);\n            }\n        }, [container]);\n\n        useEffect(() => {\n            if (container instanceof Element) {\n                setNewContainer(container);\n            }\n        }, [container]);\n\n        const handleHide = useCallback(() => {\n            setIsContentShown(false);\n        }, []);\n\n        useEffect(() => {\n            if (!isContentShown) return () => {};\n\n            const handleKey = (e: KeyboardEvent) => {\n                if (items.length === 0 || isHovered) return;\n\n                if (e.key === 'ArrowDown') {\n                    e.preventDefault();\n                    setFocusedIndex((prev) => (prev >= items.length - 1 ? 0 : prev + 1));\n                }\n\n                if (e.key === 'ArrowUp') {\n                    e.preventDefault();\n                    setFocusedIndex((prev) => (prev <= 0 ? items.length - 1 : prev - 1));\n                }\n\n                if (e.key === 'Enter') {\n                    e.preventDefault();\n                    const item = items[focusedIndex];\n                    if (item) {\n                        void item.onClick();\n\n                        if (shouldCloseOnPopupClick) {\n                            handleHide();\n                        }\n                    }\n                }\n\n                if (e.key === 'Escape') {\n                    handleHide();\n                }\n            };\n\n            document.addEventListener('keydown', handleKey);\n\n            return () => document.removeEventListener('keydown', handleKey);\n        }, [isContentShown, items, focusedIndex, handleHide, shouldCloseOnPopupClick, isHovered]);\n\n        const handleShow = useCallback(async () => {\n            if (isTouch) {\n                const { result } = (await createDialog({\n                    type: DialogType.SELECT,\n                    buttons: [],\n                    list: items.map(({ icons, text, isSelected }, index) => ({\n                        name: text,\n                        id: index,\n                        isSelected,\n                        icon: isValidElement(icons)\n                            ? undefined\n                            : (icons as string[] | undefined)?.[0],\n                    })),\n                }).open()) as SelectDialogResult;\n\n                if (result && typeof result[0] === 'number') {\n                    void items[result[0]]?.onClick();\n                }\n            } else if (contextMenuRef.current) {\n                if (!newContainer) {\n                    return;\n                }\n\n                const {\n                    height: childrenHeight,\n                    left: childrenLeft,\n                    top: childrenTop,\n                    width: childrenWidth,\n                } = contextMenuRef.current.getBoundingClientRect();\n\n                const { height, width, top, left } = newContainer.getBoundingClientRect();\n\n                const zoomX = width / (newContainer as HTMLElement).offsetWidth;\n                const zoomY = height / (newContainer as HTMLElement).offsetHeight;\n\n                const x =\n                    (childrenLeft + childrenWidth / 2 - left) / zoomX + newContainer.scrollLeft;\n                const y =\n                    (childrenTop + childrenHeight / 2 - top) / zoomY +\n                    newContainer.scrollTop -\n                    yOffset;\n\n                setInternalCoordinates({ x, y });\n\n                if (x < width / 2) {\n                    if (y < height / 2) {\n                        setInternalAlignment(ContextMenuAlignment.BottomRight);\n                    } else {\n                        setInternalAlignment(ContextMenuAlignment.TopRight);\n                    }\n                } else if (y < height / 2) {\n                    setInternalAlignment(ContextMenuAlignment.BottomLeft);\n                } else {\n                    setInternalAlignment(ContextMenuAlignment.TopLeft);\n                }\n\n                setIsContentShown(true);\n            }\n        }, [isTouch, items, newContainer, yOffset]);\n\n        const handleClick = useCallback<MouseEventHandler<HTMLSpanElement>>(\n            (event) => {\n                if (shouldDisableClick) {\n                    return;\n                }\n\n                event.preventDefault();\n                event.stopPropagation();\n\n                void handleShow();\n            },\n            [handleShow, shouldDisableClick],\n        );\n\n        const handleKeyDown = useCallback<KeyboardEventHandler<HTMLSpanElement>>(\n            (event) => {\n                if (shouldDisableClick) {\n                    return;\n                }\n\n                const isContextMenuShortcut =\n                    event.key === 'ContextMenu' || (event.key === 'F10' && event.shiftKey);\n                const isActivationKey =\n                    event.key === 'Enter' || event.key === ' ' || event.key === 'Spacebar';\n\n                if (isContextMenuShortcut) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    shouldSkipNextContextMenuOpenRef.current = true;\n                    void handleShow();\n                    return;\n                }\n\n                if (shouldUseFocusableWrapper && isActivationKey) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    void handleShow();\n                }\n            },\n            [handleShow, shouldDisableClick, shouldUseFocusableWrapper],\n        );\n\n        const handleContextMenu = useCallback(\n            (event: MouseEvent<HTMLSpanElement>) => {\n                event.preventDefault();\n                event.stopPropagation();\n\n                if (shouldDisableClick) {\n                    return;\n                }\n\n                if (shouldSkipNextContextMenuOpenRef.current) {\n                    shouldSkipNextContextMenuOpenRef.current = false;\n                    return;\n                }\n\n                void handleShow();\n            },\n            [handleShow, shouldDisableClick],\n        );\n\n        useEffect(() => {\n            const handleGlobalKeyDown = (event: KeyboardEvent) => {\n                if (shouldDisableClick || !contextMenuRef.current) {\n                    return;\n                }\n\n                const isContextMenuShortcut =\n                    event.key === 'ContextMenu' || (event.key === 'F10' && event.shiftKey);\n\n                if (!isContextMenuShortcut) {\n                    return;\n                }\n\n                const { activeElement } = document;\n\n                if (\n                    !(activeElement instanceof HTMLElement) ||\n                    activeElement === document.body ||\n                    activeElement === document.documentElement\n                ) {\n                    return;\n                }\n\n                const shouldOpenFromFocusedParent =\n                    activeElement.contains(contextMenuRef.current) &&\n                    !contextMenuRef.current.contains(activeElement);\n\n                if (!shouldOpenFromFocusedParent) {\n                    return;\n                }\n\n                event.preventDefault();\n                event.stopPropagation();\n                shouldPreventNextNativeContextMenuRef.current = true;\n                void handleShow();\n            };\n\n            const handleNativeContextMenuCapture = (event: Event) => {\n                if (!shouldPreventNextNativeContextMenuRef.current) {\n                    return;\n                }\n\n                shouldPreventNextNativeContextMenuRef.current = false;\n                event.preventDefault();\n                event.stopPropagation();\n            };\n\n            document.addEventListener('keydown', handleGlobalKeyDown, true);\n            document.addEventListener('contextmenu', handleNativeContextMenuCapture, true);\n\n            return () => {\n                document.removeEventListener('keydown', handleGlobalKeyDown, true);\n                document.removeEventListener('contextmenu', handleNativeContextMenuCapture, true);\n            };\n        }, [handleShow, shouldDisableClick]);\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleHide,\n                show: handleShow,\n            }),\n            [handleHide, handleShow],\n        );\n\n        useEffect(() => {\n            const handleDocumentClick = (event: PointerEvent) => {\n                if (\n                    !shouldCloseOnPopupClick &&\n                    contextMenuContentRef.current?.contains(event.target as Node)\n                ) {\n                    return;\n                }\n\n                handleHide();\n            };\n\n            if (isContentShown) {\n                document.addEventListener('click', handleDocumentClick, true);\n                window.addEventListener('blur', handleHide);\n\n                if (typeof onShow === 'function') {\n                    onShow();\n                }\n            } else if (typeof onHide === 'function') {\n                onHide();\n            }\n\n            return () => {\n                document.removeEventListener('click', handleDocumentClick, true);\n                window.removeEventListener('blur', handleHide);\n            };\n        }, [handleHide, isContentShown, onHide, onShow, shouldCloseOnPopupClick]);\n\n        useEffect(() => {\n            if (!newContainer) {\n                return;\n            }\n\n            setPortal(() =>\n                createPortal(\n                    <AnimatePresence initial={false}>\n                        {isContentShown && (\n                            <ContextMenuContent\n                                coordinates={coordinates ?? internalCoordinates}\n                                items={items}\n                                zIndex={zIndex}\n                                headline={headline}\n                                shouldHidePopupArrow={shouldHidePopupArrow}\n                                key={`contextMenu_${uuid}`}\n                                alignment={alignment ?? internalAlignment}\n                                ref={contextMenuContentRef}\n                                focusedIndex={focusedIndex}\n                                onKeySelect={(index) => {\n                                    const item = items[index];\n                                    if (item) {\n                                        void item.onClick();\n                                        handleHide();\n                                    }\n                                }}\n                                onMouseEnter={() => {\n                                    setIsHovered(true);\n                                    setFocusedIndex(-1);\n                                }}\n                                onMouseLeave={() => {\n                                    setIsHovered(false);\n                                }}\n                            />\n                        )}\n                    </AnimatePresence>,\n                    newContainer,\n                ),\n            );\n        }, [\n            alignment,\n            newContainer,\n            coordinates,\n            internalAlignment,\n            internalCoordinates,\n            isContentShown,\n            items,\n            uuid,\n            zIndex,\n            shouldHidePopupArrow,\n            headline,\n            focusedIndex,\n            handleHide,\n        ]);\n\n        useEffect(() => {\n            if (!contextMenuRef.current) {\n                return;\n            }\n\n            const focusableChildSelector =\n                'button:not([disabled]), a[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]), [contenteditable=\"true\"]';\n\n            const hasFocusableChild = Boolean(\n                contextMenuRef.current.querySelector(focusableChildSelector),\n            );\n\n            setShouldUseFocusableWrapper(!hasFocusableChild);\n        }, [children]);\n\n        return (\n            <>\n                <StyledContextMenu\n                    className={\n                        className\n                            ? `beta-chayns-context-menu ${className}`\n                            : 'beta-chayns-context-menu'\n                    }\n                    $isActive={isContentShown && shouldShowHoverEffect}\n                    $shouldAddHoverEffect={!isTouch && shouldShowHoverEffect}\n                    $shouldShowWrapperKeyboardHighlighting={shouldShowWrapperKeyboardHighlighting}\n                    $shouldUseDefaultTriggerStyles={shouldUseDefaultTriggerStyles}\n                    onClick={handleClick}\n                    onContextMenuCapture={handleContextMenu}\n                    onContextMenu={handleContextMenu}\n                    onKeyDown={handleKeyDown}\n                    ref={contextMenuRef}\n                    tabIndex={shouldUseKeyboardFocusableWrapper ? 0 : undefined}\n                    role={shouldUseKeyboardFocusableWrapper ? 'button' : undefined}\n                    aria-haspopup={shouldUseKeyboardFocusableWrapper ? 'menu' : undefined}\n                    aria-expanded={shouldUseKeyboardFocusableWrapper ? isContentShown : undefined}\n                    style={style}\n                >\n                    {children}\n                </StyledContextMenu>\n                {portal}\n            </>\n        );\n    },\n);\n\nContextMenu.displayName = 'ContextMenu';\n\nexport default ContextMenu;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ContextMenu.js","names":["createDialog","DialogType","AnimatePresence","React","forwardRef","isValidElement","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","useIsTouch","Icon","ContextMenuContent","StyledContextMenu","ContextMenuAlignment","getActiveItemIndex","getDefaultFocusedIndex","selectItem","useKeyboardFocusHighlighting","ContextMenu","alignment","className","children","createElement","icons","size","container","coordinates","headline","items","onHide","onShow","shouldCloseOnPopupClick","shouldDisableClick","shouldHidePopupArrow","shouldShowHoverEffect","shouldEnableKeyboardHighlighting","shouldUseDefaultTriggerStyles","style","yOffset","zIndex","ref","internalCoordinates","setInternalCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","newContainer","setNewContainer","focusedIndex","setFocusedIndex","isContentShown","setIsContentShown","portal","setPortal","isHovered","setIsHovered","shouldUseFocusableWrapper","setShouldUseFocusableWrapper","uuid","contextMenuContentRef","contextMenuRef","shouldSkipNextContextMenuOpenRef","shouldPreventNextNativeContextMenuRef","isTouch","shouldShowKeyboardHighlighting","shouldShowWrapperKeyboardHighlighting","shouldUseKeyboardFocusableWrapper","current","el","element","closest","Element","handleHide","handleContainerBlur","event","nextFocusedElement","relatedTarget","currentContainer","currentTarget","contains","handleShow","result","type","SELECT","buttons","list","map","text","isSelected","index","name","id","icon","undefined","open","onClick","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","zoomX","offsetWidth","zoomY","offsetHeight","scrollLeft","scrollTop","BottomRight","TopRight","BottomLeft","handleClick","preventDefault","stopPropagation","handleKeyDown","isActivationKey","key","prev","length","contextMenuContentElement","onClose","target","isContextMenuShortcut","shiftKey","handleContextMenu","handleGlobalKeyDown","activeElement","document","HTMLElement","body","documentElement","shouldOpenFromFocusedParent","handleNativeContextMenuCapture","addEventListener","removeEventListener","hide","show","handleDocumentClick","window","initial","onItemFocus","onMouseEnter","onMouseLeave","focusableChildSelector","hasFocusableChild","Boolean","querySelector","Fragment","$isActive","$shouldAddHoverEffect","$shouldShowWrapperKeyboardHighlighting","$shouldUseDefaultTriggerStyles","onContextMenuCapture","onContextMenu","onKeyDown","onBlur","tabIndex","role","displayName"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'motion/react';\nimport React, {\n    forwardRef,\n    isValidElement,\n    KeyboardEventHandler,\n    MouseEvent,\n    MouseEventHandler,\n    ReactPortal,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { useIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\nimport {\n    ContextMenuAlignment,\n    type ContextMenuCoordinates,\n    type ContextMenuProps,\n    type ContextMenuRef,\n} from './ContextMenu.types';\nimport { SelectDialogResult } from '../../types/general';\nimport { getActiveItemIndex, getDefaultFocusedIndex, selectItem } from './ContextMenu.utils';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nconst ContextMenu = forwardRef<ContextMenuRef, ContextMenuProps>(\n    (\n        {\n            alignment,\n            className,\n            children = <Icon icons={['ts-ellipsis_v']} size={18} />,\n            container,\n            coordinates,\n            headline,\n            items,\n            onHide,\n            onShow,\n            shouldCloseOnPopupClick = true,\n            shouldDisableClick = false,\n            shouldHidePopupArrow = false,\n            shouldShowHoverEffect = false,\n            shouldEnableKeyboardHighlighting,\n            shouldUseDefaultTriggerStyles = true,\n            style,\n            yOffset = 0,\n            zIndex = 20,\n        },\n        ref,\n    ) => {\n        const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n            x: 0,\n            y: 0,\n        });\n\n        const [internalAlignment, setInternalAlignment] = useState<ContextMenuAlignment>(\n            ContextMenuAlignment.TopLeft,\n        );\n\n        const [newContainer, setNewContainer] = useState(container ?? null);\n        const [focusedIndex, setFocusedIndex] = useState(getDefaultFocusedIndex(items));\n        const [isContentShown, setIsContentShown] = useState(false);\n        const [portal, setPortal] = useState<ReactPortal>();\n        const [isHovered, setIsHovered] = useState(false);\n        const [shouldUseFocusableWrapper, setShouldUseFocusableWrapper] = useState(false);\n\n        const uuid = useUuid();\n\n        const contextMenuContentRef = useRef<HTMLDivElement>(null);\n        const contextMenuRef = useRef<HTMLSpanElement>(null);\n        const shouldSkipNextContextMenuOpenRef = useRef(false);\n        const shouldPreventNextNativeContextMenuRef = useRef(false);\n\n        const isTouch = useIsTouch();\n        const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n            shouldEnableKeyboardHighlighting && !shouldDisableClick,\n        );\n        const shouldShowWrapperKeyboardHighlighting =\n            shouldShowKeyboardHighlighting && shouldUseFocusableWrapper;\n        const shouldUseKeyboardFocusableWrapper = shouldUseFocusableWrapper && !shouldDisableClick;\n\n        useEffect(() => {\n            if (isContentShown) {\n                setFocusedIndex(getDefaultFocusedIndex(items));\n            }\n        }, [isContentShown, items]);\n\n        useEffect(() => {\n            if (contextMenuRef.current && !container) {\n                const el = contextMenuRef.current as HTMLElement;\n\n                const element = el.closest('.dialog-inner, .page-provider, .tapp, body');\n\n                setNewContainer(element);\n            }\n        }, [container]);\n\n        useEffect(() => {\n            if (container instanceof Element) {\n                setNewContainer(container);\n            }\n        }, [container]);\n\n        const handleHide = useCallback(() => {\n            setIsContentShown(false);\n        }, []);\n\n        const handleContainerBlur = useCallback(\n            (event: React.FocusEvent<HTMLSpanElement>) => {\n                const nextFocusedElement = event.relatedTarget as Node | null;\n                const currentContainer = event.currentTarget as HTMLElement;\n\n                if (\n                    !nextFocusedElement ||\n                    (!currentContainer.contains(nextFocusedElement) &&\n                        !contextMenuContentRef.current?.contains(nextFocusedElement))\n                ) {\n                    handleHide();\n                }\n            },\n            [handleHide],\n        );\n\n        const handleShow = useCallback(async () => {\n            if (isTouch) {\n                const { result } = (await createDialog({\n                    type: DialogType.SELECT,\n                    buttons: [],\n                    list: items.map(({ icons, text, isSelected }, index) => ({\n                        name: text,\n                        id: index,\n                        isSelected,\n                        icon: isValidElement(icons)\n                            ? undefined\n                            : (icons as string[] | undefined)?.[0],\n                    })),\n                }).open()) as SelectDialogResult;\n\n                if (result && typeof result[0] === 'number') {\n                    void items[result[0]]?.onClick();\n                }\n            } else if (contextMenuRef.current) {\n                if (!newContainer) {\n                    return;\n                }\n\n                const {\n                    height: childrenHeight,\n                    left: childrenLeft,\n                    top: childrenTop,\n                    width: childrenWidth,\n                } = contextMenuRef.current.getBoundingClientRect();\n\n                const { height, width, top, left } = newContainer.getBoundingClientRect();\n\n                const zoomX = width / (newContainer as HTMLElement).offsetWidth;\n                const zoomY = height / (newContainer as HTMLElement).offsetHeight;\n\n                const x =\n                    (childrenLeft + childrenWidth / 2 - left) / zoomX + newContainer.scrollLeft;\n                const y =\n                    (childrenTop + childrenHeight / 2 - top) / zoomY +\n                    newContainer.scrollTop -\n                    yOffset;\n\n                setInternalCoordinates({ x, y });\n\n                if (x < width / 2) {\n                    if (y < height / 2) {\n                        setInternalAlignment(ContextMenuAlignment.BottomRight);\n                    } else {\n                        setInternalAlignment(ContextMenuAlignment.TopRight);\n                    }\n                } else if (y < height / 2) {\n                    setInternalAlignment(ContextMenuAlignment.BottomLeft);\n                } else {\n                    setInternalAlignment(ContextMenuAlignment.TopLeft);\n                }\n\n                setIsContentShown(true);\n            }\n        }, [isTouch, items, newContainer, yOffset]);\n\n        const handleClick = useCallback<MouseEventHandler<HTMLSpanElement>>(\n            (event) => {\n                if (shouldDisableClick) {\n                    return;\n                }\n\n                event.preventDefault();\n                event.stopPropagation();\n\n                void handleShow();\n            },\n            [handleShow, shouldDisableClick],\n        );\n\n        const handleKeyDown = useCallback<KeyboardEventHandler<HTMLSpanElement>>(\n            (event) => {\n                if (shouldDisableClick) {\n                    return;\n                }\n\n                const isActivationKey =\n                    event.key === 'Enter' || event.key === ' ' || event.key === 'Spacebar';\n\n                if (isContentShown && event.key === 'Escape') {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    handleHide();\n                    return;\n                }\n\n                if (isContentShown && !isHovered && event.key === 'ArrowDown') {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    setFocusedIndex((prev) => (prev >= items.length - 1 ? 0 : prev + 1));\n                    return;\n                }\n\n                if (isContentShown && !isHovered && event.key === 'ArrowUp') {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    setFocusedIndex((prev) => (prev <= 0 ? items.length - 1 : prev - 1));\n                    return;\n                }\n\n                if (isContentShown && isActivationKey) {\n                    if (\n                        selectItem({\n                            index: getActiveItemIndex({\n                                contextMenuContentElement: contextMenuContentRef.current,\n                                focusedIndex,\n                            }),\n                            items,\n                            onClose: handleHide,\n                            shouldCloseOnPopupClick,\n                        })\n                    ) {\n                        event.preventDefault();\n                        event.stopPropagation();\n                    }\n\n                    return;\n                }\n\n                if (event.currentTarget !== event.target) {\n                    return;\n                }\n\n                const isContextMenuShortcut =\n                    event.key === 'ContextMenu' || (event.key === 'F10' && event.shiftKey);\n\n                if (isContextMenuShortcut) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    shouldSkipNextContextMenuOpenRef.current = true;\n                    void handleShow();\n                    return;\n                }\n\n                if (shouldUseFocusableWrapper && isActivationKey) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    void handleShow();\n                }\n            },\n            [\n                focusedIndex,\n                handleHide,\n                handleShow,\n                isHovered,\n                isContentShown,\n                items,\n                items.length,\n                shouldCloseOnPopupClick,\n                shouldDisableClick,\n                shouldUseFocusableWrapper,\n            ],\n        );\n\n        const handleContextMenu = useCallback(\n            (event: MouseEvent<HTMLSpanElement>) => {\n                event.preventDefault();\n                event.stopPropagation();\n\n                if (shouldDisableClick) {\n                    return;\n                }\n\n                if (shouldSkipNextContextMenuOpenRef.current) {\n                    shouldSkipNextContextMenuOpenRef.current = false;\n                    return;\n                }\n\n                void handleShow();\n            },\n            [handleShow, shouldDisableClick],\n        );\n\n        useEffect(() => {\n            const handleGlobalKeyDown = (event: KeyboardEvent) => {\n                if (shouldDisableClick || !contextMenuRef.current) {\n                    return;\n                }\n\n                const isContextMenuShortcut =\n                    event.key === 'ContextMenu' || (event.key === 'F10' && event.shiftKey);\n\n                if (!isContextMenuShortcut) {\n                    return;\n                }\n\n                const { activeElement } = document;\n\n                if (\n                    !(activeElement instanceof HTMLElement) ||\n                    activeElement === document.body ||\n                    activeElement === document.documentElement\n                ) {\n                    return;\n                }\n\n                const shouldOpenFromFocusedParent =\n                    activeElement.contains(contextMenuRef.current) &&\n                    !contextMenuRef.current.contains(activeElement);\n\n                if (!shouldOpenFromFocusedParent) {\n                    return;\n                }\n\n                event.preventDefault();\n                event.stopPropagation();\n                shouldPreventNextNativeContextMenuRef.current = true;\n                void handleShow();\n            };\n\n            const handleNativeContextMenuCapture = (event: Event) => {\n                if (!shouldPreventNextNativeContextMenuRef.current) {\n                    return;\n                }\n\n                shouldPreventNextNativeContextMenuRef.current = false;\n                event.preventDefault();\n                event.stopPropagation();\n            };\n\n            document.addEventListener('keydown', handleGlobalKeyDown, true);\n            document.addEventListener('contextmenu', handleNativeContextMenuCapture, true);\n\n            return () => {\n                document.removeEventListener('keydown', handleGlobalKeyDown, true);\n                document.removeEventListener('contextmenu', handleNativeContextMenuCapture, true);\n            };\n        }, [handleShow, shouldDisableClick]);\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleHide,\n                show: handleShow,\n            }),\n            [handleHide, handleShow],\n        );\n\n        useEffect(() => {\n            const handleDocumentClick = (event: PointerEvent) => {\n                if (\n                    !shouldCloseOnPopupClick &&\n                    contextMenuContentRef.current?.contains(event.target as Node)\n                ) {\n                    return;\n                }\n\n                handleHide();\n            };\n\n            if (isContentShown) {\n                document.addEventListener('click', handleDocumentClick, true);\n                window.addEventListener('blur', handleHide);\n\n                if (typeof onShow === 'function') {\n                    onShow();\n                }\n            } else if (typeof onHide === 'function') {\n                onHide();\n            }\n\n            return () => {\n                document.removeEventListener('click', handleDocumentClick, true);\n                window.removeEventListener('blur', handleHide);\n            };\n        }, [handleHide, isContentShown, onHide, onShow, shouldCloseOnPopupClick]);\n\n        useEffect(() => {\n            if (!newContainer) {\n                return;\n            }\n\n            setPortal(() =>\n                createPortal(\n                    <AnimatePresence initial={false}>\n                        {isContentShown && (\n                            <ContextMenuContent\n                                coordinates={coordinates ?? internalCoordinates}\n                                items={items}\n                                zIndex={zIndex}\n                                headline={headline}\n                                shouldHidePopupArrow={shouldHidePopupArrow}\n                                key={`contextMenu_${uuid}`}\n                                alignment={alignment ?? internalAlignment}\n                                ref={contextMenuContentRef}\n                                focusedIndex={focusedIndex}\n                                onItemFocus={setFocusedIndex}\n                                onMouseEnter={() => {\n                                    setIsHovered(true);\n                                    setFocusedIndex(-1);\n                                }}\n                                onMouseLeave={() => {\n                                    setIsHovered(false);\n                                }}\n                            />\n                        )}\n                    </AnimatePresence>,\n                    newContainer,\n                ),\n            );\n        }, [\n            alignment,\n            newContainer,\n            coordinates,\n            internalAlignment,\n            internalCoordinates,\n            isContentShown,\n            items,\n            uuid,\n            zIndex,\n            shouldHidePopupArrow,\n            headline,\n            focusedIndex,\n            handleHide,\n        ]);\n\n        useEffect(() => {\n            if (!contextMenuRef.current) {\n                return;\n            }\n\n            const focusableChildSelector =\n                'button:not([disabled]), a[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]), [contenteditable=\"true\"]';\n\n            const hasFocusableChild = Boolean(\n                contextMenuRef.current.querySelector(focusableChildSelector),\n            );\n\n            setShouldUseFocusableWrapper(!hasFocusableChild);\n        }, [children]);\n\n        return (\n            <>\n                <StyledContextMenu\n                    className={\n                        className\n                            ? `beta-chayns-context-menu ${className}`\n                            : 'beta-chayns-context-menu'\n                    }\n                    $isActive={isContentShown && shouldShowHoverEffect}\n                    $shouldAddHoverEffect={!isTouch && shouldShowHoverEffect}\n                    $shouldShowWrapperKeyboardHighlighting={shouldShowWrapperKeyboardHighlighting}\n                    $shouldUseDefaultTriggerStyles={shouldUseDefaultTriggerStyles}\n                    onClick={handleClick}\n                    onContextMenuCapture={handleContextMenu}\n                    onContextMenu={handleContextMenu}\n                    onKeyDown={handleKeyDown}\n                    onBlur={handleContainerBlur}\n                    ref={contextMenuRef}\n                    tabIndex={shouldUseKeyboardFocusableWrapper ? 0 : undefined}\n                    role={shouldUseKeyboardFocusableWrapper ? 'button' : undefined}\n                    aria-haspopup={shouldUseKeyboardFocusableWrapper ? 'menu' : undefined}\n                    aria-expanded={shouldUseKeyboardFocusableWrapper ? isContentShown : undefined}\n                    style={style}\n                >\n                    {children}\n                </StyledContextMenu>\n                {portal}\n            </>\n        );\n    },\n);\n\nContextMenu.displayName = 'ContextMenu';\n\nexport default ContextMenu;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/context-menu/ContextMenu.utils.js

@@ -1,2 +1,26 @@
 export const getDefaultFocusedIndex = items => items.findIndex(item => item.isSelected);
+export const getActiveItemIndex = ({
+  contextMenuContentElement,
+  focusedIndex
+}) => {
+  const activeElement = document.activeElement;
+  const activeItemElement = contextMenuContentElement?.contains(activeElement) ? activeElement?.closest('[data-index]') : undefined;
+  return activeItemElement ? Number(activeItemElement.dataset.index) : focusedIndex;
+};
+export const selectItem = ({
+  index,
+  items,
+  onClose,
+  shouldCloseOnPopupClick
+}) => {
+  const item = items[index];
+  if (!item) {
+    return false;
+  }
+  void item.onClick();
+  if (shouldCloseOnPopupClick) {
+    onClose();
+  }
+  return true;
+};
 //# sourceMappingURL=ContextMenu.utils.js.map

package/lib/esm/components/context-menu/ContextMenu.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.utils.js","names":["getDefaultFocusedIndex","items","findIndex","item","isSelected"],"sources":["../../../../src/components/context-menu/ContextMenu.utils.ts"],"sourcesContent":["import type { ContextMenuItem } from './ContextMenu.types';\n\nexport const getDefaultFocusedIndex = (items: ContextMenuItem[]): number =>\n    items.findIndex((item) => item.isSelected);\n"],"mappings":"AAEA,OAAO,MAAMA,sBAAsB,GAAIC,KAAwB,IAC3DA,KAAK,CAACC,SAAS,CAAEC,IAAI,IAAKA,IAAI,CAACC,UAAU,CAAC","ignoreList":[]}
+{"version":3,"file":"ContextMenu.utils.js","names":["getDefaultFocusedIndex","items","findIndex","item","isSelected","getActiveItemIndex","contextMenuContentElement","focusedIndex","activeElement","document","activeItemElement","contains","closest","undefined","Number","dataset","index","selectItem","onClose","shouldCloseOnPopupClick","onClick"],"sources":["../../../../src/components/context-menu/ContextMenu.utils.ts"],"sourcesContent":["import type { ContextMenuItem } from './ContextMenu.types';\n\nexport const getDefaultFocusedIndex = (items: ContextMenuItem[]): number =>\n    items.findIndex((item) => item.isSelected);\n\nexport const getActiveItemIndex = ({\n    contextMenuContentElement,\n    focusedIndex,\n}: {\n    contextMenuContentElement: HTMLDivElement | null;\n    focusedIndex: number;\n}) => {\n    const activeElement = document.activeElement as HTMLElement | null;\n    const activeItemElement = contextMenuContentElement?.contains(activeElement)\n        ? activeElement?.closest<HTMLElement>('[data-index]')\n        : undefined;\n\n    return activeItemElement ? Number(activeItemElement.dataset.index) : focusedIndex;\n};\n\nexport const selectItem = ({\n    index,\n    items,\n    onClose,\n    shouldCloseOnPopupClick,\n}: {\n    index: number;\n    items: ContextMenuItem[];\n    onClose: VoidFunction;\n    shouldCloseOnPopupClick: boolean;\n}) => {\n    const item = items[index];\n\n    if (!item) {\n        return false;\n    }\n\n    void item.onClick();\n\n    if (shouldCloseOnPopupClick) {\n        onClose();\n    }\n\n    return true;\n};\n"],"mappings":"AAEA,OAAO,MAAMA,sBAAsB,GAAIC,KAAwB,IAC3DA,KAAK,CAACC,SAAS,CAAEC,IAAI,IAAKA,IAAI,CAACC,UAAU,CAAC;AAE9C,OAAO,MAAMC,kBAAkB,GAAGA,CAAC;EAC/BC,yBAAyB;EACzBC;AAIJ,CAAC,KAAK;EACF,MAAMC,aAAa,GAAGC,QAAQ,CAACD,aAAmC;EAClE,MAAME,iBAAiB,GAAGJ,yBAAyB,EAAEK,QAAQ,CAACH,aAAa,CAAC,GACtEA,aAAa,EAAEI,OAAO,CAAc,cAAc,CAAC,GACnDC,SAAS;EAEf,OAAOH,iBAAiB,GAAGI,MAAM,CAACJ,iBAAiB,CAACK,OAAO,CAACC,KAAK,CAAC,GAAGT,YAAY;AACrF,CAAC;AAED,OAAO,MAAMU,UAAU,GAAGA,CAAC;EACvBD,KAAK;EACLf,KAAK;EACLiB,OAAO;EACPC;AAMJ,CAAC,KAAK;EACF,MAAMhB,IAAI,GAAGF,KAAK,CAACe,KAAK,CAAC;EAEzB,IAAI,CAACb,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EAEA,KAAKA,IAAI,CAACiB,OAAO,CAAC,CAAC;EAEnB,IAAID,uBAAuB,EAAE;IACzBD,OAAO,CAAC,CAAC;EACb;EAEA,OAAO,IAAI;AACf,CAAC","ignoreList":[]}

package/lib/esm/components/context-menu/context-menu-content/ContextMenuContent.js

@@ -9,7 +9,7 @@ const ContextMenuContent = /*#__PURE__*/React.forwardRef(({
   zIndex,
   shouldHidePopupArrow,
   headline,
-  onKeySelect,
+  onItemFocus,
   focusedIndex,
   onMouseEnter,
   onMouseLeave
@@ -69,14 +69,9 @@ const ContextMenuContent = /*#__PURE__*/React.forwardRef(({
       tabIndex: 0,
       $shouldHidePopupArrow: shouldHidePopupArrow,
       $isFocused: isFocused,
-      onKeyDown: e => {
-        if (e.key === 'Enter') {
-          e.preventDefault();
-          onKeySelect(index);
-        }
-      }
+      onFocus: () => onItemFocus(index)
     }, iconElement, /*#__PURE__*/React.createElement(StyledContextMenuContentItemText, null, text)), shouldShowSpacer && /*#__PURE__*/React.createElement(StyledContextMenuContentItemSpacer, null));
-  }), [items, focusedIndex, shouldHidePopupArrow, onKeySelect]);
+  }), [items, focusedIndex, shouldHidePopupArrow, onItemFocus]);
   return /*#__PURE__*/React.createElement(StyledMotionContextMenuContent, {
     animate: {
       opacity: 1,

package/lib/esm/components/context-menu/context-menu-content/ContextMenuContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuContent.js","names":["React","isValidElement","useMemo","Icon","StyledContextMenuContentHeadline","StyledContextMenuContentItem","StyledContextMenuContentItemIconWrapper","StyledContextMenuContentItemSpacer","StyledContextMenuContentItemText","StyledContextMenuContentItemWrapper","StyledMotionContextMenuContent","ContextMenuAlignment","ContextMenuContent","forwardRef","alignment","coordinates","items","zIndex","shouldHidePopupArrow","headline","onKeySelect","focusedIndex","onMouseEnter","onMouseLeave","ref","isBottomLeftAlignment","BottomLeft","isTopLeftAlignment","TopLeft","isTopRightAlignment","TopRight","isTopCenterAlignment","TopCenter","isBottomCenterAlignment","BottomCenter","percentageOffsetX","anchorOffsetX","percentageOffsetY","anchorOffsetY","exitAndInitialY","content","map","onClick","key","text","icons","shouldShowSpacer","index","isFocused","iconElement","Array","isArray","length","createElement","event","preventDefault","stopPropagation","tabIndex","$shouldHidePopupArrow","$isFocused","onKeyDown","e","animate","opacity","y","exit","initial","$position","$zIndex","style","left","x","top","transition","ease","transformTemplate","displayName"],"sources":["../../../../../src/components/context-menu/context-menu-content/ContextMenuContent.tsx"],"sourcesContent":["import React, { isValidElement, useMemo } from 'react';\nimport Icon from '../../icon/Icon';\nimport {\n    StyledContextMenuContentHeadline,\n    StyledContextMenuContentItem,\n    StyledContextMenuContentItemIconWrapper,\n    StyledContextMenuContentItemSpacer,\n    StyledContextMenuContentItemText,\n    StyledContextMenuContentItemWrapper,\n    StyledMotionContextMenuContent,\n} from './ContextMenuContent.styles';\nimport {\n    ContextMenuAlignment,\n    type ContextMenuCoordinates,\n    type ContextMenuItem,\n} from '../ContextMenu.types';\n\ntype ContextMenuContentProps = {\n    alignment: ContextMenuAlignment;\n    coordinates: ContextMenuCoordinates;\n    items: ContextMenuItem[];\n    shouldHidePopupArrow: boolean;\n    headline?: string;\n    zIndex: number;\n    focusedIndex: number;\n    onKeySelect: (index: number) => void;\n    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\n    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\n};\n\nconst ContextMenuContent = React.forwardRef<HTMLDivElement, ContextMenuContentProps>(\n    (\n        {\n            alignment,\n            coordinates,\n            items,\n            zIndex,\n            shouldHidePopupArrow,\n            headline,\n            onKeySelect,\n            focusedIndex,\n            onMouseEnter,\n            onMouseLeave,\n        },\n        ref,\n    ) => {\n        const isBottomLeftAlignment = alignment === ContextMenuAlignment.BottomLeft;\n        const isTopLeftAlignment = alignment === ContextMenuAlignment.TopLeft;\n        const isTopRightAlignment = alignment === ContextMenuAlignment.TopRight;\n        const isTopCenterAlignment = alignment === ContextMenuAlignment.TopCenter;\n        const isBottomCenterAlignment = alignment === ContextMenuAlignment.BottomCenter;\n\n        const percentageOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return -100;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return -50;\n            }\n\n            return 0;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const anchorOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return 15;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return 0;\n            }\n\n            return -15;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const percentageOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -100 : 0;\n\n        const anchorOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -21 : 21;\n\n        const exitAndInitialY = isTopLeftAlignment || isTopRightAlignment ? -16 : 16;\n\n        const content = useMemo(\n            () =>\n                items.map(({ onClick, key, text, icons, shouldShowSpacer }, index) => {\n                    const isFocused = index === focusedIndex;\n\n                    let iconElement = null;\n\n                    if (isValidElement(icons)) {\n                        iconElement = icons;\n                    } else if (Array.isArray(icons) && icons.length > 0) {\n                        iconElement = (\n                            <StyledContextMenuContentItemIconWrapper>\n                                <Icon icons={icons} />\n                            </StyledContextMenuContentItemIconWrapper>\n                        );\n                    }\n\n                    return (\n                        <StyledContextMenuContentItem\n                            key={`context-menu-item-${key}`}\n                            data-index={index}\n                        >\n                            <StyledContextMenuContentItemWrapper\n                                key={key}\n                                onClick={(event) => {\n                                    event.preventDefault();\n                                    event.stopPropagation();\n                                    void onClick(event);\n                                }}\n                                tabIndex={0}\n                                $shouldHidePopupArrow={shouldHidePopupArrow}\n                                $isFocused={isFocused}\n                                onKeyDown={(e) => {\n                                    if (e.key === 'Enter') {\n                                        e.preventDefault();\n                                        onKeySelect(index);\n                                    }\n                                }}\n                            >\n                                {iconElement}\n                                <StyledContextMenuContentItemText>\n                                    {text}\n                                </StyledContextMenuContentItemText>\n                            </StyledContextMenuContentItemWrapper>\n                            {shouldShowSpacer && <StyledContextMenuContentItemSpacer />}\n                        </StyledContextMenuContentItem>\n                    );\n                }),\n            [items, focusedIndex, shouldHidePopupArrow, onKeySelect],\n        );\n\n        return (\n            <StyledMotionContextMenuContent\n                animate={{ opacity: 1, y: 0 }}\n                exit={{ opacity: 0, y: exitAndInitialY }}\n                initial={{ opacity: 0, y: exitAndInitialY }}\n                $position={alignment}\n                $shouldHidePopupArrow={shouldHidePopupArrow}\n                $zIndex={zIndex}\n                ref={ref}\n                style={{ left: coordinates.x, top: coordinates.y }}\n                transition={{ ease: 'anticipate' }}\n                transformTemplate={({ y = '0px' }) => `\n                    translateX(${percentageOffsetX}%)\n                    translateY(${percentageOffsetY}%)\n                    translateX(${anchorOffsetX}px)\n                    translateY(${anchorOffsetY}px)\n                    translateY(${y})\n                `}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n            >\n                {headline && (\n                    <StyledContextMenuContentHeadline>{headline}</StyledContextMenuContentHeadline>\n                )}\n                {content}\n            </StyledMotionContextMenuContent>\n        );\n    },\n);\n\nContextMenuContent.displayName = 'ContextMenuContent';\n\nexport default ContextMenuContent;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ContextMenuContent.js","names":["React","isValidElement","useMemo","Icon","StyledContextMenuContentHeadline","StyledContextMenuContentItem","StyledContextMenuContentItemIconWrapper","StyledContextMenuContentItemSpacer","StyledContextMenuContentItemText","StyledContextMenuContentItemWrapper","StyledMotionContextMenuContent","ContextMenuAlignment","ContextMenuContent","forwardRef","alignment","coordinates","items","zIndex","shouldHidePopupArrow","headline","onItemFocus","focusedIndex","onMouseEnter","onMouseLeave","ref","isBottomLeftAlignment","BottomLeft","isTopLeftAlignment","TopLeft","isTopRightAlignment","TopRight","isTopCenterAlignment","TopCenter","isBottomCenterAlignment","BottomCenter","percentageOffsetX","anchorOffsetX","percentageOffsetY","anchorOffsetY","exitAndInitialY","content","map","onClick","key","text","icons","shouldShowSpacer","index","isFocused","iconElement","Array","isArray","length","createElement","event","preventDefault","stopPropagation","tabIndex","$shouldHidePopupArrow","$isFocused","onFocus","animate","opacity","y","exit","initial","$position","$zIndex","style","left","x","top","transition","ease","transformTemplate","displayName"],"sources":["../../../../../src/components/context-menu/context-menu-content/ContextMenuContent.tsx"],"sourcesContent":["import React, { isValidElement, useMemo } from 'react';\nimport Icon from '../../icon/Icon';\nimport {\n    StyledContextMenuContentHeadline,\n    StyledContextMenuContentItem,\n    StyledContextMenuContentItemIconWrapper,\n    StyledContextMenuContentItemSpacer,\n    StyledContextMenuContentItemText,\n    StyledContextMenuContentItemWrapper,\n    StyledMotionContextMenuContent,\n} from './ContextMenuContent.styles';\nimport {\n    ContextMenuAlignment,\n    type ContextMenuCoordinates,\n    type ContextMenuItem,\n} from '../ContextMenu.types';\n\ntype ContextMenuContentProps = {\n    alignment: ContextMenuAlignment;\n    coordinates: ContextMenuCoordinates;\n    items: ContextMenuItem[];\n    shouldHidePopupArrow: boolean;\n    headline?: string;\n    zIndex: number;\n    focusedIndex: number;\n    onItemFocus: (index: number) => void;\n    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\n    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\n};\n\nconst ContextMenuContent = React.forwardRef<HTMLDivElement, ContextMenuContentProps>(\n    (\n        {\n            alignment,\n            coordinates,\n            items,\n            zIndex,\n            shouldHidePopupArrow,\n            headline,\n            onItemFocus,\n            focusedIndex,\n            onMouseEnter,\n            onMouseLeave,\n        },\n        ref,\n    ) => {\n        const isBottomLeftAlignment = alignment === ContextMenuAlignment.BottomLeft;\n        const isTopLeftAlignment = alignment === ContextMenuAlignment.TopLeft;\n        const isTopRightAlignment = alignment === ContextMenuAlignment.TopRight;\n        const isTopCenterAlignment = alignment === ContextMenuAlignment.TopCenter;\n        const isBottomCenterAlignment = alignment === ContextMenuAlignment.BottomCenter;\n\n        const percentageOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return -100;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return -50;\n            }\n\n            return 0;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const anchorOffsetX = useMemo(() => {\n            if (isBottomLeftAlignment || isTopLeftAlignment) {\n                return 15;\n            }\n\n            if (isBottomCenterAlignment || isTopCenterAlignment) {\n                return 0;\n            }\n\n            return -15;\n        }, [\n            isBottomCenterAlignment,\n            isBottomLeftAlignment,\n            isTopCenterAlignment,\n            isTopLeftAlignment,\n        ]);\n\n        const percentageOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -100 : 0;\n\n        const anchorOffsetY =\n            isTopRightAlignment || isTopLeftAlignment || isTopCenterAlignment ? -21 : 21;\n\n        const exitAndInitialY = isTopLeftAlignment || isTopRightAlignment ? -16 : 16;\n\n        const content = useMemo(\n            () =>\n                items.map(({ onClick, key, text, icons, shouldShowSpacer }, index) => {\n                    const isFocused = index === focusedIndex;\n\n                    let iconElement = null;\n\n                    if (isValidElement(icons)) {\n                        iconElement = icons;\n                    } else if (Array.isArray(icons) && icons.length > 0) {\n                        iconElement = (\n                            <StyledContextMenuContentItemIconWrapper>\n                                <Icon icons={icons} />\n                            </StyledContextMenuContentItemIconWrapper>\n                        );\n                    }\n\n                    return (\n                        <StyledContextMenuContentItem\n                            key={`context-menu-item-${key}`}\n                            data-index={index}\n                        >\n                            <StyledContextMenuContentItemWrapper\n                                key={key}\n                                onClick={(event) => {\n                                    event.preventDefault();\n                                    event.stopPropagation();\n                                    void onClick(event);\n                                }}\n                                tabIndex={0}\n                                $shouldHidePopupArrow={shouldHidePopupArrow}\n                                $isFocused={isFocused}\n                                onFocus={() => onItemFocus(index)}\n                            >\n                                {iconElement}\n                                <StyledContextMenuContentItemText>\n                                    {text}\n                                </StyledContextMenuContentItemText>\n                            </StyledContextMenuContentItemWrapper>\n                            {shouldShowSpacer && <StyledContextMenuContentItemSpacer />}\n                        </StyledContextMenuContentItem>\n                    );\n                }),\n            [items, focusedIndex, shouldHidePopupArrow, onItemFocus],\n        );\n\n        return (\n            <StyledMotionContextMenuContent\n                animate={{ opacity: 1, y: 0 }}\n                exit={{ opacity: 0, y: exitAndInitialY }}\n                initial={{ opacity: 0, y: exitAndInitialY }}\n                $position={alignment}\n                $shouldHidePopupArrow={shouldHidePopupArrow}\n                $zIndex={zIndex}\n                ref={ref}\n                style={{ left: coordinates.x, top: coordinates.y }}\n                transition={{ ease: 'anticipate' }}\n                transformTemplate={({ y = '0px' }) => `\n                    translateX(${percentageOffsetX}%)\n                    translateY(${percentageOffsetY}%)\n                    translateX(${anchorOffsetX}px)\n                    translateY(${anchorOffsetY}px)\n                    translateY(${y})\n                `}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n            >\n                {headline && (\n                    <StyledContextMenuContentHeadline>{headline}</StyledContextMenuContentHeadline>\n                )}\n                {content}\n            </StyledMotionContextMenuContent>\n        );\n    },\n);\n\nContextMenuContent.displayName = 'ContextMenuContent';\n\nexport default ContextMenuContent;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/file-list/file-item/FileItem.js

@@ -6,6 +6,7 @@ import ListItem from '../../list/list-item/ListItem';
 import { StyledFileItem, StyledFileItemKeyboardWrapper, StyledFileItemIcon } from './FileItem.styles';
 import { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';
 import textStrings from '../../../constants/textStrings';
+import { useKeyboardFocusHighlighting } from '../../../hooks/useKeyboardFocusHighlighting';
 const FileItem = ({
   mimeType,
   onRemove,
@@ -15,8 +16,11 @@ const FileItem = ({
   source,
   shouldAllowDownload
 }) => {
+  const canDownload = shouldAllowDownload && !!source;
+  const canRemove = typeof onRemove === 'function';
+  const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(canRemove || !!canDownload);
   const handleRemove = useCallback(() => {
-    if (typeof onRemove === 'function') {
+    if (canRemove) {
       onRemove(id);
     }
   }, [id, onRemove]);
@@ -27,7 +31,7 @@ const FileItem = ({
     }
   }, [handleRemove]);
   const handleRemoveKeyDown = useCallback(event => {
-    if (event.key === 'Enter' || event.key === ' ') {
+    if (canRemove && (event.key === 'Enter' || event.key === ' ')) {
       event.preventDefault();
       event.stopPropagation();
       handleRemove();
@@ -79,8 +83,6 @@ const FileItem = ({
       });
     }
   }, [name, source]);
-  const canDownload = shouldAllowDownload && !!source;
-  const canRemove = typeof onRemove === 'function';
   const downloadText = useTextstringValue({
     textstring: ttsToITextString(textStrings.components.fileItem.download)
   });
@@ -88,6 +90,7 @@ const FileItem = ({
     textstring: ttsToITextString(textStrings.components.fileItem.remove)
   });
   const rightElement = useMemo(() => {
+    if (!canDownload && !canRemove) return undefined;
     // Both actions available → show as ContextMenu
     if (canDownload && canRemove) {
       const items = [{
@@ -105,35 +108,34 @@ const FileItem = ({
         items: items
       });
     }
-
-    // Only download
-    if (canDownload) {
-      return /*#__PURE__*/React.createElement(StyledFileItemIcon, {
-        onClick: handleDownload
-      }, /*#__PURE__*/React.createElement(Icon, {
-        icons: ['fa fa-download']
-      }));
-    }
-
-    // Only remove
-    if (canRemove) {
-      return /*#__PURE__*/React.createElement(StyledFileItemIcon, {
-        onClick: () => onRemove(id)
-      }, /*#__PURE__*/React.createElement(Icon, {
-        icons: ['ts-wrong']
-      }));
-    }
-    return undefined;
-  }, [canDownload, canRemove, downloadText, handleDownload, id, onRemove, removeText]);
+    const handleClick = () => {
+      if (canRemove) {
+        onRemove(id);
+        return;
+      }
+      handleDownload();
+    };
+    const handleKeyDown = canRemove ? handleRemoveKeyDown : undefined;
+    const fileIcon = canRemove ? 'ts-wrong' : 'fa fa-download';
+    return /*#__PURE__*/React.createElement(StyledFileItemIcon, {
+      onClick: handleClick,
+      onKeyDown: handleKeyDown,
+      role: "button",
+      tabIndex: 0
+    }, /*#__PURE__*/React.createElement(Icon, {
+      icons: [fileIcon]
+    }));
+  }, [canDownload, canRemove, downloadText, handleDownload, handleRemoveKeyDown, id, onRemove, removeText]);
   return useMemo(() => /*#__PURE__*/React.createElement(StyledFileItem, null, /*#__PURE__*/React.createElement(StyledFileItemKeyboardWrapper, {
     onKeyDown: handleItemKeyDown,
-    tabIndex: typeof onRemove === 'function' ? 0 : -1
+    tabIndex: -1
   }, /*#__PURE__*/React.createElement(ListItem, {
     title: name,
     subtitle: humanFileSize,
     icons: [icon],
-    rightElements: rightElement
-  }))), [handleItemKeyDown, humanFileSize, icon, name, rightElement]);
+    rightElements: rightElement,
+    shouldEnableKeyboardHighlighting: shouldShowKeyboardHighlighting
+  }))), [handleItemKeyDown, humanFileSize, icon, name, rightElement, shouldShowKeyboardHighlighting]);
 };
 FileItem.displayName = 'FileList';
 export default FileItem;

package/lib/esm/components/file-list/file-item/FileItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileItem.js","names":["React","useCallback","useMemo","getHumanSize","getIconByMimeType","Icon","ContextMenu","ListItem","StyledFileItem","StyledFileItemKeyboardWrapper","StyledFileItemIcon","ttsToITextString","useTextstringValue","textStrings","FileItem","mimeType","onRemove","size","name","id","source","shouldAllowDownload","handleRemove","handleItemKeyDown","event","key","preventDefault","handleRemoveKeyDown","stopPropagation","humanFileSize","undefined","icon","handleDownload","File","url","URL","createObjectURL","a","document","createElement","href","download","body","appendChild","click","removeChild","revokeObjectURL","fetch","then","res","ok","Error","blob","catch","rel","target","canDownload","canRemove","downloadText","textstring","components","fileItem","removeText","remove","rightElement","items","icons","onClick","text","onKeyDown","tabIndex","title","subtitle","rightElements","displayName"],"sources":["../../../../../src/components/file-list/file-item/FileItem.tsx"],"sourcesContent":["import React, { FC, KeyboardEventHandler, useCallback, useMemo } from 'react';\nimport { getHumanSize, getIconByMimeType } from '../../../utils/file';\nimport Icon from '../../icon/Icon';\nimport ContextMenu from '../../context-menu/ContextMenu';\nimport type { ContextMenuItem } from '../../context-menu/ContextMenu.types';\nimport ListItem from '../../list/list-item/ListItem';\nimport type { IFileItem } from '../FileList';\nimport {\n    StyledFileItem,\n    StyledFileItemActions,\n    StyledFileItemKeyboardWrapper,\n    StyledFileItemRemoveButton,\n    StyledFileItemIcon,\n} from './FileItem.styles';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport textStrings from '../../../constants/textStrings';\n\nexport type FileItemProps = IFileItem & {\n    onRemove?: (name: string) => void;\n    shouldAllowDownload?: boolean;\n};\n\nconst FileItem: FC<FileItemProps> = ({\n    mimeType,\n    onRemove,\n    size,\n    name,\n    id,\n    source,\n    shouldAllowDownload,\n}) => {\n    const handleRemove = useCallback(() => {\n        if (typeof onRemove === 'function') {\n            onRemove(id);\n        }\n    }, [id, onRemove]);\n\n    const handleItemKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (event.key === 'Delete') {\n                event.preventDefault();\n                handleRemove();\n            }\n        },\n        [handleRemove],\n    );\n\n    const handleRemoveKeyDown = useCallback<KeyboardEventHandler<HTMLSpanElement>>(\n        (event) => {\n            if (event.key === 'Enter' || event.key === ' ') {\n                event.preventDefault();\n                event.stopPropagation();\n                handleRemove();\n            }\n        },\n        [handleRemove],\n    );\n\n    const humanFileSize = useMemo(() => {\n        if (typeof size === 'number') {\n            return getHumanSize(size);\n        }\n\n        return undefined;\n    }, [size]);\n\n    const icon = useMemo(() => getIconByMimeType(mimeType), [mimeType]);\n\n    const handleDownload = useCallback(() => {\n        if (!source) return;\n\n        if (source instanceof File) {\n            const url = URL.createObjectURL(source);\n            const a = document.createElement('a');\n            a.href = url;\n            a.download = name;\n            document.body.appendChild(a);\n            a.click();\n            document.body.removeChild(a);\n            URL.revokeObjectURL(url);\n        } else {\n            // Try fetching as blob to force download. If CORS blocks it,\n            // fall back to opening the URL directly.\n            fetch(source)\n                .then((res) => {\n                    if (!res.ok) throw new Error('fetch failed');\n                    return res.blob();\n                })\n                .then((blob) => {\n                    const url = URL.createObjectURL(blob);\n                    const a = document.createElement('a');\n                    a.href = url;\n                    a.download = name;\n                    document.body.appendChild(a);\n                    a.click();\n                    document.body.removeChild(a);\n                    URL.revokeObjectURL(url);\n                })\n                .catch(() => {\n                    // CORS or network error: fall back to direct link\n                    const a = document.createElement('a');\n                    a.href = source;\n                    a.download = name;\n                    a.rel = 'noopener noreferrer';\n                    a.target = '_blank';\n                    document.body.appendChild(a);\n                    a.click();\n                    document.body.removeChild(a);\n                });\n        }\n    }, [name, source]);\n\n    const canDownload = shouldAllowDownload && !!source;\n    const canRemove = typeof onRemove === 'function';\n\n    const downloadText = useTextstringValue({\n        textstring: ttsToITextString(textStrings.components.fileItem.download),\n    });\n    const removeText = useTextstringValue({\n        textstring: ttsToITextString(textStrings.components.fileItem.remove),\n    });\n\n    const rightElement = useMemo(() => {\n        // Both actions available → show as ContextMenu\n        if (canDownload && canRemove) {\n            const items: ContextMenuItem[] = [\n                {\n                    icons: ['fa fa-download'],\n                    key: 'download',\n                    onClick: handleDownload,\n                    text: downloadText,\n                },\n                {\n                    icons: ['fa fa-trash'],\n                    key: 'remove',\n                    onClick: () => onRemove(id),\n                    text: removeText,\n                },\n            ];\n\n            return <ContextMenu items={items} />;\n        }\n\n        // Only download\n        if (canDownload) {\n            return (\n                <StyledFileItemIcon onClick={handleDownload}>\n                    <Icon icons={['fa fa-download']} />\n                </StyledFileItemIcon>\n            );\n        }\n\n        // Only remove\n        if (canRemove) {\n            return (\n                <StyledFileItemIcon onClick={() => onRemove(id)}>\n                    <Icon icons={['ts-wrong']} />\n                </StyledFileItemIcon>\n            );\n        }\n\n        return undefined;\n    }, [canDownload, canRemove, downloadText, handleDownload, id, onRemove, removeText]);\n\n    return useMemo(\n        () => (\n            <StyledFileItem>\n                <StyledFileItemKeyboardWrapper\n                    onKeyDown={handleItemKeyDown}\n                    tabIndex={typeof onRemove === 'function' ? 0 : -1}\n                >\n                    <ListItem\n                        title={name}\n                        subtitle={humanFileSize}\n                        icons={[icon]}\n                        rightElements={rightElement}\n                    />\n                </StyledFileItemKeyboardWrapper>\n            </StyledFileItem>\n        ),\n        [handleItemKeyDown, humanFileSize, icon, name, rightElement],\n    );\n};\n\nFileItem.displayName = 'FileList';\n\nexport default FileItem;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FileItem.js","names":["React","useCallback","useMemo","getHumanSize","getIconByMimeType","Icon","ContextMenu","ListItem","StyledFileItem","StyledFileItemKeyboardWrapper","StyledFileItemIcon","ttsToITextString","useTextstringValue","textStrings","useKeyboardFocusHighlighting","FileItem","mimeType","onRemove","size","name","id","source","shouldAllowDownload","canDownload","canRemove","shouldShowKeyboardHighlighting","handleRemove","handleItemKeyDown","event","key","preventDefault","handleRemoveKeyDown","stopPropagation","humanFileSize","undefined","icon","handleDownload","File","url","URL","createObjectURL","a","document","createElement","href","download","body","appendChild","click","removeChild","revokeObjectURL","fetch","then","res","ok","Error","blob","catch","rel","target","downloadText","textstring","components","fileItem","removeText","remove","rightElement","items","icons","onClick","text","handleClick","handleKeyDown","fileIcon","onKeyDown","role","tabIndex","title","subtitle","rightElements","shouldEnableKeyboardHighlighting","displayName"],"sources":["../../../../../src/components/file-list/file-item/FileItem.tsx"],"sourcesContent":["import React, { FC, KeyboardEventHandler, useCallback, useMemo } from 'react';\nimport { getHumanSize, getIconByMimeType } from '../../../utils/file';\nimport Icon from '../../icon/Icon';\nimport ContextMenu from '../../context-menu/ContextMenu';\nimport type { ContextMenuItem } from '../../context-menu/ContextMenu.types';\nimport ListItem from '../../list/list-item/ListItem';\nimport type { IFileItem } from '../FileList';\nimport {\n    StyledFileItem,\n    StyledFileItemActions,\n    StyledFileItemKeyboardWrapper,\n    StyledFileItemRemoveButton,\n    StyledFileItemIcon,\n} from './FileItem.styles';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport textStrings from '../../../constants/textStrings';\nimport { useKeyboardFocusHighlighting } from '../../../hooks/useKeyboardFocusHighlighting';\n\nexport type FileItemProps = IFileItem & {\n    onRemove?: (name: string) => void;\n    shouldAllowDownload?: boolean;\n};\n\nconst FileItem: FC<FileItemProps> = ({\n    mimeType,\n    onRemove,\n    size,\n    name,\n    id,\n    source,\n    shouldAllowDownload,\n}) => {\n    const canDownload = shouldAllowDownload && !!source;\n    const canRemove = typeof onRemove === 'function';\n\n    const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(canRemove || !!canDownload);\n\n    const handleRemove = useCallback(() => {\n        if (canRemove) {\n            onRemove(id);\n        }\n    }, [id, onRemove]);\n\n    const handleItemKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (event.key === 'Delete') {\n                event.preventDefault();\n                handleRemove();\n            }\n        },\n        [handleRemove],\n    );\n\n    const handleRemoveKeyDown = useCallback<KeyboardEventHandler<HTMLSpanElement>>(\n        (event) => {\n            if (canRemove && (event.key === 'Enter' || event.key === ' ')) {\n                event.preventDefault();\n                event.stopPropagation();\n                handleRemove();\n            }\n        },\n        [handleRemove],\n    );\n\n    const humanFileSize = useMemo(() => {\n        if (typeof size === 'number') {\n            return getHumanSize(size);\n        }\n\n        return undefined;\n    }, [size]);\n\n    const icon = useMemo(() => getIconByMimeType(mimeType), [mimeType]);\n\n    const handleDownload = useCallback(() => {\n        if (!source) return;\n\n        if (source instanceof File) {\n            const url = URL.createObjectURL(source);\n            const a = document.createElement('a');\n            a.href = url;\n            a.download = name;\n            document.body.appendChild(a);\n            a.click();\n            document.body.removeChild(a);\n            URL.revokeObjectURL(url);\n        } else {\n            // Try fetching as blob to force download. If CORS blocks it,\n            // fall back to opening the URL directly.\n            fetch(source)\n                .then((res) => {\n                    if (!res.ok) throw new Error('fetch failed');\n                    return res.blob();\n                })\n                .then((blob) => {\n                    const url = URL.createObjectURL(blob);\n                    const a = document.createElement('a');\n                    a.href = url;\n                    a.download = name;\n                    document.body.appendChild(a);\n                    a.click();\n                    document.body.removeChild(a);\n                    URL.revokeObjectURL(url);\n                })\n                .catch(() => {\n                    // CORS or network error: fall back to direct link\n                    const a = document.createElement('a');\n                    a.href = source;\n                    a.download = name;\n                    a.rel = 'noopener noreferrer';\n                    a.target = '_blank';\n                    document.body.appendChild(a);\n                    a.click();\n                    document.body.removeChild(a);\n                });\n        }\n    }, [name, source]);\n\n    const downloadText = useTextstringValue({\n        textstring: ttsToITextString(textStrings.components.fileItem.download),\n    });\n    const removeText = useTextstringValue({\n        textstring: ttsToITextString(textStrings.components.fileItem.remove),\n    });\n\n    const rightElement = useMemo(() => {\n        if (!canDownload && !canRemove) return undefined;\n        // Both actions available → show as ContextMenu\n        if (canDownload && canRemove) {\n            const items: ContextMenuItem[] = [\n                {\n                    icons: ['fa fa-download'],\n                    key: 'download',\n                    onClick: handleDownload,\n                    text: downloadText,\n                },\n                {\n                    icons: ['fa fa-trash'],\n                    key: 'remove',\n                    onClick: () => onRemove(id),\n                    text: removeText,\n                },\n            ];\n\n            return <ContextMenu items={items} />;\n        }\n\n        const handleClick = () => {\n            if (canRemove) {\n                onRemove(id);\n                return;\n            }\n\n            handleDownload();\n        };\n\n        const handleKeyDown = canRemove ? handleRemoveKeyDown : undefined;\n\n        const fileIcon = canRemove ? 'ts-wrong' : 'fa fa-download';\n\n        return (\n            <StyledFileItemIcon\n                onClick={handleClick}\n                onKeyDown={handleKeyDown}\n                role=\"button\"\n                tabIndex={0}\n            >\n                <Icon icons={[fileIcon]} />\n            </StyledFileItemIcon>\n        );\n    }, [\n        canDownload,\n        canRemove,\n        downloadText,\n        handleDownload,\n        handleRemoveKeyDown,\n        id,\n        onRemove,\n        removeText,\n    ]);\n\n    return useMemo(\n        () => (\n            <StyledFileItem>\n                <StyledFileItemKeyboardWrapper onKeyDown={handleItemKeyDown} tabIndex={-1}>\n                    <ListItem\n                        title={name}\n                        subtitle={humanFileSize}\n                        icons={[icon]}\n                        rightElements={rightElement}\n                        shouldEnableKeyboardHighlighting={shouldShowKeyboardHighlighting}\n                    />\n                </StyledFileItemKeyboardWrapper>\n            </StyledFileItem>\n        ),\n        [\n            handleItemKeyDown,\n            humanFileSize,\n            icon,\n            name,\n            rightElement,\n            shouldShowKeyboardHighlighting,\n        ],\n    );\n};\n\nFileItem.displayName = 'FileList';\n\nexport default FileItem;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/file-list/file-item/FileItem.styles.js

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
-import { keyboardFocusHighlightingRingCss } from '../../../utils/keyboardFocusHighlighting.styles';
+import { keyboardFocusHighlightingCircleRingCss, keyboardFocusHighlightingRingCss } from '../../../utils/keyboardFocusHighlighting.styles';
 export const StyledFileItem = styled.div``;
 export const StyledFileItemIcon = styled.div`
     align-items: center;
@@ -9,6 +9,12 @@ export const StyledFileItemIcon = styled.div`
     border-radius: 3px;
     padding: 6px;
     transition: background-color 0.3s ease;
+
+    &:focus-visible {
+        outline: none;
+        color: inherit;
+        ${keyboardFocusHighlightingCircleRingCss};
+    }
 `;
 export const StyledFileItemKeyboardWrapper = styled.div`
     &:focus-visible {

package/lib/esm/components/file-list/file-item/FileItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileItem.styles.js","names":["styled","keyboardFocusHighlightingRingCss","StyledFileItem","div","StyledFileItemIcon","StyledFileItemKeyboardWrapper","StyledFileItemActions","span","StyledFileItemRemoveButton"],"sources":["../../../../../src/components/file-list/file-item/FileItem.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { keyboardFocusHighlightingRingCss } from '../../../utils/keyboardFocusHighlighting.styles';\n\nexport const StyledFileItem = styled.div``;\nexport const StyledFileItemIcon = styled.div`\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    background-color: transparent;\n    border-radius: 3px;\n    padding: 6px;\n    transition: background-color 0.3s ease;\n`;\n\nexport const StyledFileItemKeyboardWrapper = styled.div`\n    &:focus-visible {\n        ${keyboardFocusHighlightingRingCss}\n    }\n`;\n\nexport const StyledFileItemActions = styled.span`\n    display: flex;\n    gap: 8px;\n    align-items: center;\n`;\n\nexport const StyledFileItemRemoveButton = styled.span`\n    display: inline-flex;\n\n    &:focus-visible {\n        ${keyboardFocusHighlightingRingCss}\n    }\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,gCAAgC,QAAQ,iDAAiD;AAElG,OAAO,MAAMC,cAAc,GAAGF,MAAM,CAACG,GAAG,EAAE;AAC1C,OAAO,MAAMC,kBAAkB,GAAGJ,MAAM,CAACG,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAME,6BAA6B,GAAGL,MAAM,CAACG,GAAG;AACvD;AACA,UAAUF,gCAAgC;AAC1C;AACA,CAAC;AAED,OAAO,MAAMK,qBAAqB,GAAGN,MAAM,CAACO,IAAI;AAChD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,0BAA0B,GAAGR,MAAM,CAACO,IAAI;AACrD;AACA;AACA;AACA,UAAUN,gCAAgC;AAC1C;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"FileItem.styles.js","names":["styled","keyboardFocusHighlightingCircleRingCss","keyboardFocusHighlightingRingCss","StyledFileItem","div","StyledFileItemIcon","StyledFileItemKeyboardWrapper","StyledFileItemActions","span","StyledFileItemRemoveButton"],"sources":["../../../../../src/components/file-list/file-item/FileItem.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport {\n    keyboardFocusHighlightingCircleRingCss,\n    keyboardFocusHighlightingRingCss,\n} from '../../../utils/keyboardFocusHighlighting.styles';\n\nexport const StyledFileItem = styled.div``;\nexport const StyledFileItemIcon = styled.div`\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    background-color: transparent;\n    border-radius: 3px;\n    padding: 6px;\n    transition: background-color 0.3s ease;\n\n    &:focus-visible {\n        outline: none;\n        color: inherit;\n        ${keyboardFocusHighlightingCircleRingCss};\n    }\n`;\n\nexport const StyledFileItemKeyboardWrapper = styled.div`\n    &:focus-visible {\n        ${keyboardFocusHighlightingRingCss}\n    }\n`;\n\nexport const StyledFileItemActions = styled.span`\n    display: flex;\n    gap: 8px;\n    align-items: center;\n`;\n\nexport const StyledFileItemRemoveButton = styled.span`\n    display: inline-flex;\n\n    &:focus-visible {\n        ${keyboardFocusHighlightingRingCss}\n    }\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SACIC,sCAAsC,EACtCC,gCAAgC,QAC7B,iDAAiD;AAExD,OAAO,MAAMC,cAAc,GAAGH,MAAM,CAACI,GAAG,EAAE;AAC1C,OAAO,MAAMC,kBAAkB,GAAGL,MAAM,CAACI,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAUH,sCAAsC;AAChD;AACA,CAAC;AAED,OAAO,MAAMK,6BAA6B,GAAGN,MAAM,CAACI,GAAG;AACvD;AACA,UAAUF,gCAAgC;AAC1C;AACA,CAAC;AAED,OAAO,MAAMK,qBAAqB,GAAGP,MAAM,CAACQ,IAAI;AAChD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,0BAA0B,GAAGT,MAAM,CAACQ,IAAI;AACrD;AACA;AACA;AACA,UAAUN,gCAAgC;AAC1C;AACA,CAAC","ignoreList":[]}