"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CollapsePanel = exports.Collapse = void 0;
var _web = require("@react-spring/web");
var _ahooks = require("ahooks");
var _antdMobileIcons = require("antd-mobile-icons");
var _classnames = _interopRequireDefault(require("classnames"));
var _react = _interopRequireWildcard(require("react"));
var _nativeProps = require("../../utils/native-props");
var _shouldRender = require("../../utils/should-render");
var _traverseReactNode = require("../../utils/traverse-react-node");
var _useIsomorphicUpdateLayoutEffect = require("../../utils/use-isomorphic-update-layout-effect");
var _useMutationEffect = require("../../utils/use-mutation-effect");
var _usePropsValue = require("../../utils/use-props-value");
var _withDefaultProps = require("../../utils/with-default-props");
var _configProvider = require("../config-provider");
var _list = _interopRequireDefault(require("../list"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const classPrefix = `adm-collapse`;
const CollapsePanel = () => {
  return null;
};
exports.CollapsePanel = CollapsePanel;
const CollapsePanelContent = props => {
  const {
    visible
  } = props;
  const innerRef = (0, _react.useRef)(null);
  const shouldRender = (0, _shouldRender.useShouldRender)(visible, props.forceRender, props.destroyOnClose);
  const [{
    height
  }, api] = (0, _web.useSpring)(() => ({
    from: {
      height: 0
    },
    config: {
      precision: 0.01,
      mass: 1,
      tension: 200,
      friction: 25,
      clamp: true
    }
  }));
  (0, _ahooks.useMount)(() => {
    if (!visible) return;
    const inner = innerRef.current;
    if (!inner) return;
    api.start({
      height: inner.offsetHeight,
      immediate: true
    });
  });
  (0, _useIsomorphicUpdateLayoutEffect.useIsomorphicUpdateLayoutEffect)(() => {
    const inner = innerRef.current;
    if (!inner) return;
    if (visible) {
      let lastMotionId = 0;
      let cancelObserve = () => {};
      const handleMotion = () => {
        lastMotionId += 1;
        const motionId = lastMotionId;
        api.start({
          height: inner.offsetHeight
        })[0].then(() => {
          if (motionId === lastMotionId) {
            cancelObserve();
          }
        });
      };
      cancelObserve = (0, _useMutationEffect.observe)(inner, {
        childList: true,
        subtree: true
      }, handleMotion);
      handleMotion();
      return cancelObserve;
    } else {
      api.start({
        height: inner.offsetHeight,
        immediate: true
      });
      api.start({
        height: 0
      });
    }
  }, [visible]);
  return _react.default.createElement(_web.animated.div, {
    className: (0, _classnames.default)(`${classPrefix}-panel-content`, {
      [`${classPrefix}-panel-content-active`]: visible
    }),
    style: {
      height: height.to(v => {
        if (height.idle && visible) {
          return 'auto';
        } else {
          return v;
        }
      })
    }
  }, _react.default.createElement("div", {
    className: `${classPrefix}-panel-content-inner`,
    ref: innerRef
  }, _react.default.createElement(_list.default.Item, null, shouldRender && props.children)));
};
const Collapse = props => {
  const {
    collapse: componentConfig = {}
  } = (0, _configProvider.useConfig)();
  const mergedProps = (0, _withDefaultProps.mergeProps)(componentConfig, props);
  const panels = [];
  (0, _traverseReactNode.traverseReactNode)(mergedProps.children, child => {
    if (!(0, _react.isValidElement)(child)) return;
    const key = child.key;
    if (typeof key !== 'string') return;
    panels.push(child);
  });
  const handlePropsValue = () => {
    var _a;
    if (!mergedProps.accordion) {
      return {
        value: mergedProps.activeKey,
        defaultValue: (_a = mergedProps.defaultActiveKey) !== null && _a !== void 0 ? _a : [],
        onChange: mergedProps.onChange
      };
    }
    const initValue = {
      value: [],
      defaultValue: [],
      onChange: v => {
        var _a, _b;
        (_a = mergedProps.onChange) === null || _a === void 0 ? void 0 : _a.call(mergedProps, (_b = v[0]) !== null && _b !== void 0 ? _b : null);
      }
    };
    if (mergedProps.activeKey === undefined) {
      initValue.value = undefined;
    } else if (mergedProps.activeKey !== null) {
      initValue.value = [mergedProps.activeKey];
    }
    if (![null, undefined].includes(mergedProps.defaultActiveKey)) {
      initValue.defaultValue = [mergedProps.defaultActiveKey];
    }
    return initValue;
  };
  const [activeKey, setActiveKey] = (0, _usePropsValue.usePropsValue)(handlePropsValue());
  const activeKeyList = activeKey === null ? [] : Array.isArray(activeKey) ? activeKey : [activeKey];
  return (0, _nativeProps.withNativeProps)(mergedProps, _react.default.createElement("div", {
    className: classPrefix
  }, _react.default.createElement(_list.default, null, panels.map(panel => {
    const key = panel.key;
    const active = activeKeyList.includes(key);
    function handleClick(event) {
      var _a, _b;
      if (mergedProps.accordion) {
        if (active) {
          setActiveKey([]);
        } else {
          setActiveKey([key]);
        }
      } else {
        if (active) {
          setActiveKey(activeKeyList.filter(v => v !== key));
        } else {
          setActiveKey([...activeKeyList, key]);
        }
      }
      (_b = (_a = panel.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
    }
    const arrow = (0, _withDefaultProps.mergeProp)(_react.default.createElement(_antdMobileIcons.DownOutline, null), mergedProps.arrow, mergedProps.arrowIcon, panel.props.arrow, panel.props.arrowIcon);
    const arrowIcon = typeof arrow === 'function' ? arrow(active) : _react.default.createElement("div", {
      className: (0, _classnames.default)(`${classPrefix}-arrow`, {
        [`${classPrefix}-arrow-active`]: active
      })
    }, arrow);
    return _react.default.createElement(_react.default.Fragment, {
      key: key
    }, (0, _nativeProps.withNativeProps)(panel.props, _react.default.createElement(_list.default.Item, {
      className: `${classPrefix}-panel-header`,
      onClick: handleClick,
      disabled: panel.props.disabled,
      arrowIcon: arrowIcon
    }, panel.props.title)), _react.default.createElement(CollapsePanelContent, {
      visible: active,
      forceRender: !!panel.props.forceRender,
      destroyOnClose: !!panel.props.destroyOnClose
    }, panel.props.children));
  }))));
};
exports.Collapse = Collapse;