@hitachivantara/uikit-react-core/dist/esm/TreeView/internals/hooks/plugins/useTreeViewFocus.js

Core React components for the NEXT Design System.

import * as React from "react";
import { useEventCallback, ownerDocument } from "@mui/material/utils";
import { useInstanceEventHandler } from "../useInstanceEventHandler.js";
import { populateInstance } from "../utils.js";
const useTreeViewFocus = ({
  instance,
  params,
  state,
  setState,
  models,
  rootRef
}) => {
  const setFocusedNodeId = useEventCallback(
    (nodeId) => {
      const cleanNodeId = typeof nodeId === "function" ? nodeId(state.focusedNodeId) : nodeId;
      setState((prevState) => ({ ...prevState, focusedNodeId: cleanNodeId }));
    }
  );
  const isNodeFocused = React.useCallback(
    (nodeId) => state.focusedNodeId === nodeId,
    [state.focusedNodeId]
  );
  const focusNode = useEventCallback(
    (event, nodeId) => {
      if (nodeId) {
        setFocusedNodeId(nodeId);
        if (params.onNodeFocus) {
          params.onNodeFocus(event, nodeId);
        }
      }
    }
  );
  populateInstance(instance, {
    isNodeFocused,
    focusNode
  });
  useInstanceEventHandler(instance, "removeNode", ({ id }) => {
    setFocusedNodeId((oldFocusedNodeId) => {
      if (oldFocusedNodeId === id && rootRef.current === ownerDocument(rootRef.current).activeElement) {
        return instance.getChildrenIds(null)[0];
      }
      return oldFocusedNodeId;
    });
  });
  const createHandleFocus = (otherHandlers) => (event) => {
    otherHandlers.onFocus?.(event);
    if (event.target === event.currentTarget) {
      const isNodeVisible = (nodeId) => {
        const node = instance.getNode(nodeId);
        return node && (node.parentId == null || instance.isNodeExpanded(node.parentId));
      };
      let nodeToFocusId;
      if (Array.isArray(models.selected.value)) {
        nodeToFocusId = models.selected.value.find(isNodeVisible);
      } else if (models.selected.value != null && isNodeVisible(models.selected.value)) {
        nodeToFocusId = models.selected.value;
      }
      if (nodeToFocusId == null) {
        nodeToFocusId = instance.getNavigableChildrenIds(null)[0];
      }
      instance.focusNode(event, nodeToFocusId);
    }
  };
  const createHandleBlur = (otherHandlers) => (event) => {
    otherHandlers.onBlur?.(event);
    setFocusedNodeId(null);
  };
  const focusedNode = instance.getNode(state.focusedNodeId);
  const activeDescendant = focusedNode ? focusedNode.idAttribute : null;
  return {
    getRootProps: (otherHandlers) => ({
      onFocus: createHandleFocus(otherHandlers),
      onBlur: createHandleBlur(otherHandlers),
      "aria-activedescendant": activeDescendant ?? void 0
    })
  };
};
useTreeViewFocus.getInitialState = () => ({ focusedNodeId: null });
useTreeViewFocus.getDefaultizedParams = (params) => ({
  ...params,
  disabledItemsFocusable: params.disabledItemsFocusable ?? false
});
export {
  useTreeViewFocus
};