@mui/x-tree-view 8.0.0-alpha.8 → 8.0.0-beta.0

package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts

@@ -0,0 +1,184 @@
+import { TreeViewRootSelector } from "../../utils/selectors.js";
+import { UseTreeViewExpansionSignature } from "./useTreeViewExpansion.types.js";
+/**
+ * Check if an item is expanded.
+ * @param {TreeViewState<[UseTreeViewExpansionSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expanded, `false` otherwise.
+ */
+export declare const selectorIsItemExpanded: ((state: any, itemId: string) => boolean) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    expandedItemsMap: Map<string, true>;
+    expansionTrigger: "content" | "iconContainer";
+  }, resultFuncArgs_1: string) => boolean;
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    expandedItemsMap: Map<string, true>;
+    expansionTrigger: "content" | "iconContainer";
+  }, resultFuncArgs_1: string) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => boolean;
+  dependencies: [TreeViewRootSelector<UseTreeViewExpansionSignature>, (_: any, itemId: string) => string];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Check if an item is expandable.
+ * @param {TreeViewState<[UseTreeViewItemsSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expandable, `false` otherwise.
+ */
+export declare const selectorIsItemExpandable: ((state: any, itemId: string | null) => boolean) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: import("../..").TreeViewItemMeta | null) => boolean;
+  memoizedResultFunc: ((resultFuncArgs_0: import("../..").TreeViewItemMeta | null) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => boolean;
+  dependencies: [((state: any, itemId: string | null) => import("../..").TreeViewItemMeta | null) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  } & {
+    resultFunc: (resultFuncArgs_0: {
+      [itemId: string]: import("../..").TreeViewItemMeta;
+    }, resultFuncArgs_1: string | null) => import("../..").TreeViewItemMeta | null;
+    memoizedResultFunc: ((resultFuncArgs_0: {
+      [itemId: string]: import("../..").TreeViewItemMeta;
+    }, resultFuncArgs_1: string | null) => import("../..").TreeViewItemMeta | null) & {
+      clearCache: () => void;
+      resultsCount: () => number;
+      resetResultsCount: () => void;
+    };
+    lastResult: () => import("../..").TreeViewItemMeta | null;
+    dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("../useTreeViewItems").UseTreeViewItemsState<import("../../..").TreeViewDefaultItemModelProperties> & Partial<{}> & {
+      cacheKey: import("../../models").TreeViewStateCacheKey;
+    }) => {
+      [itemId: string]: import("../..").TreeViewItemMeta;
+    }) & {
+      clearCache: () => void;
+      resultsCount: () => number;
+      resetResultsCount: () => void;
+    } & {
+      resultFunc: (resultFuncArgs_0: {
+        disabledItemsFocusable: boolean;
+        itemModelLookup: {
+          [itemId: string]: import("../../..").TreeViewBaseItem<import("../../..").TreeViewDefaultItemModelProperties>;
+        };
+        itemMetaLookup: {
+          [itemId: string]: import("../..").TreeViewItemMeta;
+        };
+        itemOrderedChildrenIdsLookup: {
+          [parentItemId: string]: string[];
+        };
+        itemChildrenIndexesLookup: {
+          [parentItemId: string]: {
+            [itemId: string]: number;
+          };
+        };
+        loading: boolean;
+        error: Error | null;
+      }) => {
+        [itemId: string]: import("../..").TreeViewItemMeta;
+      };
+      memoizedResultFunc: ((resultFuncArgs_0: {
+        disabledItemsFocusable: boolean;
+        itemModelLookup: {
+          [itemId: string]: import("../../..").TreeViewBaseItem<import("../../..").TreeViewDefaultItemModelProperties>;
+        };
+        itemMetaLookup: {
+          [itemId: string]: import("../..").TreeViewItemMeta;
+        };
+        itemOrderedChildrenIdsLookup: {
+          [parentItemId: string]: string[];
+        };
+        itemChildrenIndexesLookup: {
+          [parentItemId: string]: {
+            [itemId: string]: number;
+          };
+        };
+        loading: boolean;
+        error: Error | null;
+      }) => {
+        [itemId: string]: import("../..").TreeViewItemMeta;
+      }) & {
+        clearCache: () => void;
+        resultsCount: () => number;
+        resetResultsCount: () => void;
+      };
+      lastResult: () => {
+        [itemId: string]: import("../..").TreeViewItemMeta;
+      };
+      dependencies: [TreeViewRootSelector<import("../useTreeViewItems").UseTreeViewItemsSignature>];
+      recomputations: () => number;
+      resetRecomputations: () => void;
+      dependencyRecomputations: () => number;
+      resetDependencyRecomputations: () => void;
+    } & {
+      argsMemoize: typeof import("reselect").weakMapMemoize;
+      memoize: typeof import("reselect").weakMapMemoize;
+    }, (_: any, itemId: string | null) => string | null];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+  } & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+  }];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Get the slot that triggers the item's expansion when clicked.
+ * @param {TreeViewState<[UseTreeViewExpansionSignature]>} state The state of the tree view.
+ * @returns {'content' | 'iconContainer'} The slot that triggers the item's expansion when clicked. Is `null` if the item is not expandable.
+ */
+export declare const selectorItemExpansionTrigger: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewExpansion.types").UseTreeViewExpansionState & Partial<{}> & {
+  cacheKey: import("../../models").TreeViewStateCacheKey;
+}) => "content" | "iconContainer") & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    expandedItemsMap: Map<string, true>;
+    expansionTrigger: "content" | "iconContainer";
+  }) => "content" | "iconContainer";
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    expandedItemsMap: Map<string, true>;
+    expansionTrigger: "content" | "iconContainer";
+  }) => "content" | "iconContainer") & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => "content" | "iconContainer";
+  dependencies: [TreeViewRootSelector<UseTreeViewExpansionSignature>];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};

package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.js

@@ -0,0 +1,24 @@
+import { createSelector } from "../../utils/selectors.js";
+import { selectorItemMeta } from "../useTreeViewItems/useTreeViewItems.selectors.js";
+const selectorExpansion = state => state.expansion;
+
+/**
+ * Check if an item is expanded.
+ * @param {TreeViewState<[UseTreeViewExpansionSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expanded, `false` otherwise.
+ */
+export const selectorIsItemExpanded = createSelector([selectorExpansion, (_, itemId) => itemId], (expansionState, itemId) => expansionState.expandedItemsMap.has(itemId));
+
+/**
+ * Check if an item is expandable.
+ * @param {TreeViewState<[UseTreeViewItemsSignature]>} state The state of the tree view.
+ * @returns {boolean} `true` if the item is expandable, `false` otherwise.
+ */
+export const selectorIsItemExpandable = createSelector([selectorItemMeta], itemMeta => itemMeta?.expandable ?? false);
+
+/**
+ * Get the slot that triggers the item's expansion when clicked.
+ * @param {TreeViewState<[UseTreeViewExpansionSignature]>} state The state of the tree view.
+ * @returns {'content' | 'iconContainer'} The slot that triggers the item's expansion when clicked. Is `null` if the item is not expandable.
+ */
+export const selectorItemExpansionTrigger = createSelector([selectorExpansion], expansionState => expansionState.expansionTrigger);

package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts

@@ -0,0 +1,102 @@
+import * as React from 'react';
+import { DefaultizedProps } from '@mui/x-internals/types';
+import { TreeViewPluginSignature } from "../../models/index.js";
+import { UseTreeViewItemsSignature } from "../useTreeViewItems/index.js";
+import { TreeViewItemId } from "../../../models/index.js";
+import { UseTreeViewLabelSignature } from "../useTreeViewLabel/index.js";
+export interface UseTreeViewExpansionPublicAPI {
+  /**
+   * Change the expansion status of a given item.
+   * @param {object} parameters The parameters of the method.
+   * @param {string} parameters.itemId The id of the item to expand of collapse.
+   * @param {React.SyntheticEvent} parameters.event The DOM event that triggered the change.
+   * @param {boolean} parameters.shouldBeExpanded If `true` the item will be expanded. If `false` the item will be collapsed. If not defined, the item's expansion status will be the toggled.
+   */
+  setItemExpansion: (parameters: {
+    itemId: string;
+    event?: React.SyntheticEvent;
+    shouldBeExpanded?: boolean;
+  }) => void;
+}
+export interface UseTreeViewExpansionInstance extends UseTreeViewExpansionPublicAPI {
+  /**
+   * Expand all the siblings (i.e.: the items that have the same parent) of a given item.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change.
+   * @param {TreeViewItemId} itemId The id of the item whose siblings will be expanded.
+   */
+  expandAllSiblings: (event: React.KeyboardEvent, itemId: TreeViewItemId) => void;
+  /**
+   * APply the new expansion status of a given item.
+   * Is used by the `setItemExpansion` method and by the `useTreeViewLazyLoading` plugin.
+   * Unlike `setItemExpansion`, this method does not trigger the lazy loading.
+   * @param {object} parameters The parameters of the method.
+   * @param {string} parameters.itemId The id of the item to expand of collapse.
+   * @param {React.SyntheticEvent | null} parameters.event The DOM event that triggered the change.
+   * @param {boolean} parameters.shouldBeExpanded If `true` the item will be expanded. If `false` the item will be collapsed.
+   */
+  applyItemExpansion: (parameters: {
+    itemId: string;
+    event: React.SyntheticEvent | null;
+    shouldBeExpanded: boolean;
+  }) => void;
+}
+export interface UseTreeViewExpansionParameters {
+  /**
+   * Expanded item ids.
+   * Used when the item's expansion is controlled.
+   */
+  expandedItems?: string[];
+  /**
+   * Expanded item ids.
+   * Used when the item's expansion is not controlled.
+   * @default []
+   */
+  defaultExpandedItems?: string[];
+  /**
+   * Callback fired when Tree Items are expanded/collapsed.
+   * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
+   * @param {array} itemIds The ids of the expanded items.
+   */
+  onExpandedItemsChange?: (event: React.SyntheticEvent | null, itemIds: string[]) => void;
+  /**
+   * Callback fired when a Tree Item is expanded or collapsed.
+   * @param {React.SyntheticEvent | null} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
+   * @param {array} itemId The itemId of the modified item.
+   * @param {array} isExpanded `true` if the item has just been expanded, `false` if it has just been collapsed.
+   */
+  onItemExpansionToggle?: (event: React.SyntheticEvent | null, itemId: string, isExpanded: boolean) => void;
+  /**
+   * The slot that triggers the item's expansion when clicked.
+   * @default 'content'
+   */
+  expansionTrigger?: 'content' | 'iconContainer';
+}
+export type UseTreeViewExpansionDefaultizedParameters = DefaultizedProps<UseTreeViewExpansionParameters, 'defaultExpandedItems'>;
+export interface UseTreeViewExpansionState {
+  expansion: {
+    expandedItemsMap: Map<string, true>;
+    expansionTrigger: 'content' | 'iconContainer';
+  };
+}
+interface UseTreeViewExpansionEventLookup {
+  beforeItemToggleExpansion: {
+    params: {
+      isExpansionPrevented: boolean;
+      shouldBeExpanded: boolean;
+      event: React.SyntheticEvent | null;
+      itemId: TreeViewItemId;
+    };
+  };
+}
+export type UseTreeViewExpansionSignature = TreeViewPluginSignature<{
+  params: UseTreeViewExpansionParameters;
+  defaultizedParams: UseTreeViewExpansionDefaultizedParameters;
+  instance: UseTreeViewExpansionInstance;
+  publicAPI: UseTreeViewExpansionPublicAPI;
+  modelNames: 'expandedItems';
+  state: UseTreeViewExpansionState;
+  dependencies: [UseTreeViewItemsSignature];
+  optionalDependencies: [UseTreeViewLabelSignature];
+  events: UseTreeViewExpansionEventLookup;
+}>;
+export {};

package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.js

@@ -0,0 +1 @@
+export {};

package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.utils.d.ts

@@ -0,0 +1,7 @@
+import { TreeViewUsedDefaultizedParams } from "../../models/index.js";
+import { UseTreeViewExpansionSignature } from "./useTreeViewExpansion.types.js";
+export declare const createExpandedItemsMap: (expandedItems: string[]) => Map<string, true>;
+export declare const getExpansionTrigger: ({
+  isItemEditable,
+  expansionTrigger
+}: Pick<TreeViewUsedDefaultizedParams<UseTreeViewExpansionSignature>, "isItemEditable" | "expansionTrigger">) => "content" | "iconContainer";

package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.utils.js

@@ -0,0 +1,19 @@
+export const createExpandedItemsMap = expandedItems => {
+  const expandedItemsMap = new Map();
+  expandedItems.forEach(id => {
+    expandedItemsMap.set(id, true);
+  });
+  return expandedItemsMap;
+};
+export const getExpansionTrigger = ({
+  isItemEditable,
+  expansionTrigger
+}) => {
+  if (expansionTrigger) {
+    return expansionTrigger;
+  }
+  if (isItemEditable) {
+    return 'iconContainer';
+  }
+  return 'content';
+};

package/esm/internals/plugins/useTreeViewFocus/index.d.ts

@@ -0,0 +1,2 @@
+export { useTreeViewFocus } from "./useTreeViewFocus.js";
+export type { UseTreeViewFocusSignature, UseTreeViewFocusParameters, UseTreeViewFocusDefaultizedParameters } from './useTreeViewFocus.types';

package/esm/internals/plugins/useTreeViewFocus/index.js

@@ -0,0 +1 @@
+export { useTreeViewFocus } from "./useTreeViewFocus.js";

package/esm/internals/plugins/useTreeViewFocus/useTreeViewFocus.d.ts

@@ -0,0 +1,3 @@
+import { TreeViewPlugin } from "../../models/index.js";
+import { UseTreeViewFocusSignature } from "./useTreeViewFocus.types.js";
+export declare const useTreeViewFocus: TreeViewPlugin<UseTreeViewFocusSignature>;

package/esm/internals/plugins/useTreeViewFocus/useTreeViewFocus.js

@@ -0,0 +1,135 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import useEventCallback from '@mui/utils/useEventCallback';
+import { useInstanceEventHandler } from "../../hooks/useInstanceEventHandler.js";
+import { getFirstNavigableItem } from "../../utils/tree.js";
+import { convertSelectedItemsToArray } from "../useTreeViewSelection/useTreeViewSelection.utils.js";
+import { selectorDefaultFocusableItemId, selectorFocusedItemId } from "./useTreeViewFocus.selectors.js";
+import { selectorIsItemExpanded } from "../useTreeViewExpansion/useTreeViewExpansion.selectors.js";
+import { selectorCanItemBeFocused, selectorItemMeta } from "../useTreeViewItems/useTreeViewItems.selectors.js";
+export const useTreeViewFocus = ({
+  instance,
+  params,
+  store,
+  models
+}) => {
+  React.useEffect(() => {
+    let defaultFocusableItemId = convertSelectedItemsToArray(models.selectedItems.value).find(itemId => {
+      if (!selectorCanItemBeFocused(store.value, itemId)) {
+        return false;
+      }
+      const itemMeta = selectorItemMeta(store.value, itemId);
+      return itemMeta && (itemMeta.parentId == null || selectorIsItemExpanded(store.value, itemMeta.parentId));
+    });
+    if (defaultFocusableItemId == null) {
+      defaultFocusableItemId = getFirstNavigableItem(store.value) ?? null;
+    }
+    store.update(prevState => {
+      if (defaultFocusableItemId === prevState.focus.defaultFocusableItemId) {
+        return prevState;
+      }
+      return _extends({}, prevState, {
+        focus: _extends({}, prevState.focus, {
+          defaultFocusableItemId
+        })
+      });
+    });
+  }, [store, models.selectedItems.value]);
+  const setFocusedItemId = useEventCallback(itemId => {
+    store.update(prevState => {
+      const focusedItemId = selectorFocusedItemId(prevState);
+      if (focusedItemId === itemId) {
+        return prevState;
+      }
+      return _extends({}, prevState, {
+        focus: _extends({}, prevState.focus, {
+          focusedItemId: itemId
+        })
+      });
+    });
+  });
+  const isItemVisible = itemId => {
+    const itemMeta = selectorItemMeta(store.value, itemId);
+    return itemMeta && (itemMeta.parentId == null || selectorIsItemExpanded(store.value, itemMeta.parentId));
+  };
+  const innerFocusItem = (event, itemId) => {
+    const itemElement = instance.getItemDOMElement(itemId);
+    if (itemElement) {
+      itemElement.focus();
+    }
+    setFocusedItemId(itemId);
+    if (params.onItemFocus) {
+      params.onItemFocus(event, itemId);
+    }
+  };
+  const focusItem = useEventCallback((event, itemId) => {
+    // If we receive an itemId, and it is visible, the focus will be set to it
+    if (isItemVisible(itemId)) {
+      innerFocusItem(event, itemId);
+    }
+  });
+  const removeFocusedItem = useEventCallback(() => {
+    const focusedItemId = selectorFocusedItemId(store.value);
+    if (focusedItemId == null) {
+      return;
+    }
+    const itemMeta = selectorItemMeta(store.value, focusedItemId);
+    if (itemMeta) {
+      const itemElement = instance.getItemDOMElement(focusedItemId);
+      if (itemElement) {
+        itemElement.blur();
+      }
+    }
+    setFocusedItemId(null);
+  });
+  useInstanceEventHandler(instance, 'removeItem', ({
+    id
+  }) => {
+    const focusedItemId = selectorFocusedItemId(store.value);
+    const defaultFocusableItemId = selectorDefaultFocusableItemId(store.value);
+    if (focusedItemId === id && defaultFocusableItemId != null) {
+      innerFocusItem(null, defaultFocusableItemId);
+    }
+  });
+  const createRootHandleFocus = otherHandlers => event => {
+    otherHandlers.onFocus?.(event);
+    if (event.defaultMuiPrevented) {
+      return;
+    }
+
+    // if the event bubbled (which is React specific) we don't want to steal focus
+    const defaultFocusableItemId = selectorDefaultFocusableItemId(store.value);
+    if (event.target === event.currentTarget && defaultFocusableItemId != null) {
+      innerFocusItem(event, defaultFocusableItemId);
+    }
+  };
+  const createRootHandleBlur = otherHandlers => event => {
+    otherHandlers.onBlur?.(event);
+    if (event.defaultMuiPrevented) {
+      return;
+    }
+    setFocusedItemId(null);
+  };
+  return {
+    getRootProps: otherHandlers => ({
+      onFocus: createRootHandleFocus(otherHandlers),
+      onBlur: createRootHandleBlur(otherHandlers)
+    }),
+    publicAPI: {
+      focusItem
+    },
+    instance: {
+      focusItem,
+      removeFocusedItem
+    }
+  };
+};
+useTreeViewFocus.getInitialState = () => ({
+  focus: {
+    focusedItemId: null,
+    defaultFocusableItemId: null
+  }
+});
+useTreeViewFocus.params = {
+  onItemFocus: true
+};

package/esm/internals/plugins/useTreeViewFocus/useTreeViewFocus.selectors.d.ts

@@ -0,0 +1,182 @@
+import { UseTreeViewFocusSignature } from "./useTreeViewFocus.types.js";
+import { TreeViewRootSelector } from "../../utils/selectors.js";
+/**
+ * Get the item that should be sequentially focusable (usually with the Tab key).
+ * At any point in time, there is a single item that can be sequentially focused in the Tree View.
+ * This item is the first selected item (that is both visible and navigable), if any, or the first navigable item if no item is selected.
+ * @param {TreeViewState<[UseTreeViewFocusSignature]>} state The state of the tree view.
+ * @returns {TreeViewItemId | null} The id of the item that should be sequentially focusable.
+ */
+export declare const selectorDefaultFocusableItemId: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewFocus.types").UseTreeViewFocusState & Partial<{}> & {
+  cacheKey: import("../../models").TreeViewStateCacheKey;
+}) => string | null) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    focusedItemId: string | null;
+    defaultFocusableItemId: string | null;
+  }) => string | null;
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    focusedItemId: string | null;
+    defaultFocusableItemId: string | null;
+  }) => string | null) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => string | null;
+  dependencies: [TreeViewRootSelector<UseTreeViewFocusSignature>];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Check if an item is the default focusable item.
+ * @param {TreeViewState<[UseTreeViewFocusSignature]>} state The state of the tree view.
+ * @param {TreeViewItemId} itemId The id of the item to check.
+ * @returns {boolean} `true` if the item is the default focusable item, `false` otherwise.
+ */
+export declare const selectorIsItemTheDefaultFocusableItem: ((state: any, itemId: string) => boolean) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: string | null, resultFuncArgs_1: string) => boolean;
+  memoizedResultFunc: ((resultFuncArgs_0: string | null, resultFuncArgs_1: string) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => boolean;
+  dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewFocus.types").UseTreeViewFocusState & Partial<{}> & {
+    cacheKey: import("../../models").TreeViewStateCacheKey;
+  }) => string | null) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  } & {
+    resultFunc: (resultFuncArgs_0: {
+      focusedItemId: string | null;
+      defaultFocusableItemId: string | null;
+    }) => string | null;
+    memoizedResultFunc: ((resultFuncArgs_0: {
+      focusedItemId: string | null;
+      defaultFocusableItemId: string | null;
+    }) => string | null) & {
+      clearCache: () => void;
+      resultsCount: () => number;
+      resetResultsCount: () => void;
+    };
+    lastResult: () => string | null;
+    dependencies: [TreeViewRootSelector<UseTreeViewFocusSignature>];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+  } & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+  }, (_: any, itemId: string) => string];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Get the id of the item that is currently focused.
+ * @param {TreeViewState<[UseTreeViewFocusSignature]>} state The state of the tree view.
+ * @returns {TreeViewItemId | null} The id of the item that is currently focused.
+ */
+export declare const selectorFocusedItemId: ((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewFocus.types").UseTreeViewFocusState & Partial<{}> & {
+  cacheKey: import("../../models").TreeViewStateCacheKey;
+}) => string | null) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: {
+    focusedItemId: string | null;
+    defaultFocusableItemId: string | null;
+  }) => string | null;
+  memoizedResultFunc: ((resultFuncArgs_0: {
+    focusedItemId: string | null;
+    defaultFocusableItemId: string | null;
+  }) => string | null) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => string | null;
+  dependencies: [TreeViewRootSelector<UseTreeViewFocusSignature>];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};
+/**
+ * Check if an item is focused.
+ * @param {TreeViewState<[UseTreeViewFocusSignature]>} state The state of the tree view.
+ * @param {TreeViewItemId} itemId The id of the item to check.
+ * @returns {boolean} `true` if the item is focused, `false` otherwise.
+ */
+export declare const selectorIsItemFocused: ((state: any, itemId: string) => boolean) & {
+  clearCache: () => void;
+  resultsCount: () => number;
+  resetResultsCount: () => void;
+} & {
+  resultFunc: (resultFuncArgs_0: string | null, resultFuncArgs_1: string) => boolean;
+  memoizedResultFunc: ((resultFuncArgs_0: string | null, resultFuncArgs_1: string) => boolean) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  };
+  lastResult: () => boolean;
+  dependencies: [((state: import("../../corePlugins/useTreeViewId/useTreeViewId.types").UseTreeViewIdState & import("./useTreeViewFocus.types").UseTreeViewFocusState & Partial<{}> & {
+    cacheKey: import("../../models").TreeViewStateCacheKey;
+  }) => string | null) & {
+    clearCache: () => void;
+    resultsCount: () => number;
+    resetResultsCount: () => void;
+  } & {
+    resultFunc: (resultFuncArgs_0: {
+      focusedItemId: string | null;
+      defaultFocusableItemId: string | null;
+    }) => string | null;
+    memoizedResultFunc: ((resultFuncArgs_0: {
+      focusedItemId: string | null;
+      defaultFocusableItemId: string | null;
+    }) => string | null) & {
+      clearCache: () => void;
+      resultsCount: () => number;
+      resetResultsCount: () => void;
+    };
+    lastResult: () => string | null;
+    dependencies: [TreeViewRootSelector<UseTreeViewFocusSignature>];
+    recomputations: () => number;
+    resetRecomputations: () => void;
+    dependencyRecomputations: () => number;
+    resetDependencyRecomputations: () => void;
+  } & {
+    argsMemoize: typeof import("reselect").weakMapMemoize;
+    memoize: typeof import("reselect").weakMapMemoize;
+  }, (_: any, itemId: string) => string];
+  recomputations: () => number;
+  resetRecomputations: () => void;
+  dependencyRecomputations: () => number;
+  resetDependencyRecomputations: () => void;
+} & {
+  argsMemoize: typeof import("reselect").weakMapMemoize;
+  memoize: typeof import("reselect").weakMapMemoize;
+};