@nutui/nutui-react/dist/esm/Collapse.js

京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序

import React__default, { useCallback } from "react";
import classNames from "classnames";
import { C as ComponentDefaults } from "./typings.js";
import { a as CollapseContext, C as CollapseItem } from "./collapseitem2.js";
import { u as usePropsValue } from "./use-props-value.js";
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { defaultActiveName: [], accordion: false, expandIcon: null, rotate: 180 });
const Collapse = (props) => {
  const { className, style, children, activeName, defaultActiveName, accordion, expandIcon, rotate, onChange } = Object.assign(Object.assign({}, defaultProps), props);
  const classPrefix = "nut-collapse";
  const [value, setValue] = usePropsValue({
    value: activeName,
    defaultValue: defaultActiveName,
    finalValue: []
  });
  const changeVal = (newValue, name, isOpen2) => {
    setValue(newValue);
    onChange && onChange(newValue, name, isOpen2);
  };
  const updateValue = (name) => {
    if (accordion) {
      if (value === name) {
        changeVal("", name, false);
      } else {
        changeVal(name, name, true);
      }
    } else if (Array.isArray(value)) {
      if (value.includes(name)) {
        const newValue = value.filter((v) => v !== name);
        changeVal(newValue, name, false);
      } else {
        const newValue = value.concat([name]);
        changeVal(newValue, name, true);
      }
    } else {
      console.warn("[NutUI] <Collapse> 未开启手风琴模式时 activeName 应为数组");
    }
  };
  const isOpen = useCallback((name) => {
    if (accordion) {
      return value === name;
    }
    if (Array.isArray(value)) {
      return value.includes(name);
    }
    return false;
  }, [accordion, value]);
  return React__default.createElement(
    CollapseContext.Provider,
    { value: {
      isOpen,
      updateValue,
      expandIcon,
      rotate
    } },
    React__default.createElement("div", { className: classNames(classPrefix, className), style }, children)
  );
};
Collapse.displayName = "NutCollapse";
Collapse.Item = CollapseItem;
export {
  Collapse as default
};