@hitachivantara/uikit-react-core/dist/esm/ListContainer/ListContainer.js

Core React components for the NEXT Design System.

import { jsx } from "react/jsx-runtime";
import { forwardRef, useRef, useContext, useMemo, Children, isValidElement, cloneElement } from "react";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { useForkRef } from "../hooks/useForkRef.js";
import { useClasses } from "./ListContainer.styles.js";
import { staticClasses } from "./ListContainer.styles.js";
import ListContext from "./ListContext/ListContext.js";
const HvListContainer = forwardRef(function HvListContainer2(props, ref) {
  const {
    id,
    classes: classesProp,
    className,
    interactive = false,
    selectable,
    condensed,
    disableGutters,
    children: childrenProp,
    ...others
  } = useDefaultProps("HvListContainer", props);
  const { classes, cx } = useClasses(classesProp);
  const containerRef = useRef(null);
  const { topContainerRef, nesting = -1 } = useContext(ListContext);
  const listContext = useMemo(
    () => ({
      topContainerRef: topContainerRef || containerRef,
      condensed,
      selectable,
      disableGutters,
      interactive,
      nesting: nesting + 1
    }),
    [
      condensed,
      selectable,
      disableGutters,
      interactive,
      nesting,
      topContainerRef
    ]
  );
  const children = useMemo(() => {
    if (!interactive) return childrenProp;
    const anySelected = Children.toArray(childrenProp).some(
      (child) => isValidElement(child) && child.props.selected && !child.props.disabled
    );
    return Children.map(childrenProp, (child, i) => {
      const tabIndex = child.props.tabIndex || !anySelected && i === 0 || child.props.selected && !child.props.disabled ? 0 : -1;
      return cloneElement(child, {
        tabIndex,
        interactive
      });
    });
  }, [childrenProp, interactive]);
  const handleRef = useForkRef(ref, containerRef);
  return /* @__PURE__ */ jsx(ListContext.Provider, { value: listContext, children: /* @__PURE__ */ jsx(
    "ul",
    {
      ref: handleRef,
      id,
      className: cx(classes.root, className),
      ...others,
      children
    }
  ) });
});
export {
  HvListContainer,
  staticClasses as listContainerClasses
};