@chayns-components/core/lib/esm/components/list/List.js

A set of beautiful React components for developing your own applications with chayns.

import { AnimatePresence, MotionConfig } from 'motion/react';
import React, { useCallback, useMemo, useState } from 'react';
export const ListContext = /*#__PURE__*/React.createContext({
  incrementExpandableItemCount: () => () => {},
  isAnyItemExpandable: false,
  isWrapped: false,
  openItemUuid: undefined,
  updateOpenItemUuid: () => {}
});
ListContext.displayName = 'ListContext';
const List = _ref => {
  let {
    children,
    isWrapped = false
  } = _ref;
  const [openItemUuid, setOpenItemUuid] = useState(undefined);
  const [expandableItemCount, setExpandableItemCount] = useState(0);
  const updateOpenItemUuid = useCallback(function (uuid) {
    let {
      shouldOnlyOpen
    } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
    setOpenItemUuid(currentOpenItemUuid => {
      if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {
        return undefined;
      }
      return uuid;
    });
  }, [setOpenItemUuid]);
  const incrementExpandableItemCount = useCallback(() => {
    setExpandableItemCount(count => count + 1);
    return () => {
      setExpandableItemCount(count => count - 1);
    };
  }, [setExpandableItemCount]);
  const providerValue = useMemo(() => ({
    incrementExpandableItemCount,
    isAnyItemExpandable: expandableItemCount > 0,
    isWrapped,
    openItemUuid,
    updateOpenItemUuid
  }), [expandableItemCount, incrementExpandableItemCount, isWrapped, openItemUuid, updateOpenItemUuid]);
  return /*#__PURE__*/React.createElement(ListContext.Provider, {
    value: providerValue
  }, /*#__PURE__*/React.createElement(MotionConfig, {
    transition: {
      type: 'tween'
    }
  }, /*#__PURE__*/React.createElement(AnimatePresence, {
    initial: false
  }, children)));
};
List.displayName = 'List';
export default List;
//# sourceMappingURL=List.js.map