function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React, { forwardRef, useReducer } from 'react';
import { Dimensions, StyleSheet, View } from 'react-native';
import SlotContainer from './SlotContainer';
import { SafeAreaView } from 'react-native-safe-area-context';
import { SlotTypeEnum } from './type';
//
const {
  width: windowWidth,
  height: windowHeight
} = Dimensions.get('window');
const SlotC = /*#__PURE__*/forwardRef(function SlotC(props, ref) {
  const {
    children,
    onLayout,
    style,
    width,
    height
  } = props;

  // TODO： 重构样式计算方式，支持更多的样式配置写入
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      position: 'absolute',
      maxHeight: windowHeight * 0.5,
      height: windowHeight * height,
      width: windowWidth * width,
      maxWidth: windowWidth * 0.4,
      flexDirection: 'column',
      ...style
    },
    scrollView: {
      flex: 1,
      flexDirection: 'column'
    }
  });
  const handleLayoutChange = event => {
    // const { height } = event.nativeEvent.layout;
    // setBottomCenterHeight(height);
    if (onLayout) {
      onLayout(event);
    }
  };
  return /*#__PURE__*/React.createElement(SafeAreaView, {
    style: styles.container,
    onLayout: handleLayoutChange,
    ref: ref
  }, /*#__PURE__*/React.createElement(View, {
    style: styles.scrollView
  }, children));
});
var SlotLayoutReducerActionEnum = /*#__PURE__*/function (SlotLayoutReducerActionEnum) {
  SlotLayoutReducerActionEnum["update"] = "update";
  return SlotLayoutReducerActionEnum;
}(SlotLayoutReducerActionEnum || {});
function getDefaultLayout(slots) {
  const result = {
    [SlotTypeEnum.bottomCenter]: {
      width: 0,
      height: 0,
      ...(slots[SlotTypeEnum.bottomCenter]?.style || {})
    },
    [SlotTypeEnum.leftBottom]: {
      width: 0,
      height: 0,
      ...(slots[SlotTypeEnum.leftBottom]?.style || {})
    },
    [SlotTypeEnum.leftTop]: {
      width: 0,
      height: 0,
      ...(slots[SlotTypeEnum.leftTop]?.style || {})
    },
    [SlotTypeEnum.rightBottom]: {
      width: 0,
      height: 0,
      ...(slots[SlotTypeEnum.rightBottom]?.style || {})
    },
    [SlotTypeEnum.rightTop]: {
      width: 0,
      height: 0,
      ...(slots[SlotTypeEnum.rightTop]?.style || {})
    },
    [SlotTypeEnum.topCenter]: {
      width: 0,
      height: 0,
      ...(slots[SlotTypeEnum.topCenter]?.style || {})
    }
  };
  return result;
}
function renderInfoReducer(store, action) {
  const {
    type,
    payload
  } = action;
  const {
    slotType,
    ...newLayout
  } = payload;
  const oldLayout = store[slotType];
  switch (type) {
    case SlotLayoutReducerActionEnum.update:
      break;
    //
  }
  store[slotType] = {
    ...oldLayout,
    ...newLayout
  };
  return store;
}

// function slotLayoutTransform() {
//     const layout = {
//         width: 0,
//         height: 0,
//     };

//     return layout;
// }

export function SlotParser(props) {
  function pickParams(slots, type, renderInfo) {
    const info = slots[type];
    // const ren = renderInfo[type];
    // const style = StyleSheet.create({
    //     root: { ...info.style },
    // });

    return {
      key: type,
      type,
      style: {
        ...info.style
      },
      visible: info.visible
    };
  }
  const {
    slots
  } = props;
  const [renderInfo, dispatchRenderInfo] = useReducer(renderInfoReducer, getDefaultLayout(slots));
  const handleBottomCenterLayout = event => {
    // 1、当 bottomCenter 布局出现变化时，计算leftBottom、rightBottom的位置变更！！！
    updateSlotLayout(SlotTypeEnum.bottomCenter)(event);

    // 1、触发更新 rightBottom, leftBottom 位置
    const leftBottomSlotLayout = renderInfo[SlotTypeEnum.leftBottom];
    const rightBottomSlotLayout = renderInfo[SlotTypeEnum.rightBottom];
    const {
      height
    } = event.nativeEvent.layout;
    //

    const expectLTSTop = height + leftBottomSlotLayout.height;
    if (expectLTSTop < windowHeight) {
      if (expectLTSTop > (leftBottomSlotLayout.top || 0)) {
        dispatchRenderInfo({
          type: SlotLayoutReducerActionEnum.update,
          payload: {
            slotType: SlotTypeEnum.leftBottom,
            top: windowHeight - expectLTSTop
          }
        });
      }
    } else {
      dispatchRenderInfo({
        type: SlotLayoutReducerActionEnum.update,
        payload: {
          slotType: SlotTypeEnum.leftBottom,
          visible: false
        }
      });
    }

    // 更新 rightBottom
    const expectRTSTop = height + rightBottomSlotLayout.height;
    if (expectRTSTop < windowHeight) {
      if (expectRTSTop > (rightBottomSlotLayout.top || 0)) {
        dispatchRenderInfo({
          type: SlotLayoutReducerActionEnum.update,
          payload: {
            slotType: SlotTypeEnum.rightBottom,
            top: windowHeight - expectRTSTop
          }
        });
      }
    } else {
      dispatchRenderInfo({
        type: SlotLayoutReducerActionEnum.update,
        payload: {
          slotType: SlotTypeEnum.rightBottom,
          visible: false
        }
      });
    }
  };

  // 当Slot内容更新时， onLayout 触发
  const updateSlotLayout = type => e => {
    const {
      width,
      height
    } = e.nativeEvent.layout;
    dispatchRenderInfo({
      type: SlotLayoutReducerActionEnum.update,
      payload: {
        slotType: type,
        width,
        height
      }
    });
  };

  // version first
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SlotC, _extends({
    width: 0.3,
    height: 0.3
  }, pickParams(slots, SlotTypeEnum.leftTop, renderInfo), {
    onLayout: updateSlotLayout(SlotTypeEnum.leftTop)
  }), slots[SlotTypeEnum.leftTop].child), /*#__PURE__*/React.createElement(SlotC, _extends({
    width: 0.3,
    height: 0.3
  }, pickParams(slots, SlotTypeEnum.rightTop, renderInfo), {
    onLayout: updateSlotLayout(SlotTypeEnum.rightTop)
  }), slots[SlotTypeEnum.rightTop].child), /*#__PURE__*/React.createElement(SlotC, _extends({
    width: 0.3,
    height: 0.3
  }, pickParams(slots, SlotTypeEnum.leftBottom, renderInfo), {
    onLayout: updateSlotLayout(SlotTypeEnum.leftBottom)
  }), slots[SlotTypeEnum.leftBottom].child), /*#__PURE__*/React.createElement(SlotC, _extends({
    width: 0,
    height: 0
  }, pickParams(slots, SlotTypeEnum.rightBottom, renderInfo), {
    onLayout: updateSlotLayout(SlotTypeEnum.rightBottom)
  }), slots[SlotTypeEnum.rightBottom].child), /*#__PURE__*/React.createElement(SlotC, _extends({
    width: 1,
    height: 0.3
  }, pickParams(slots, SlotTypeEnum.bottomCenter, renderInfo), {
    onLayout: handleBottomCenterLayout
  }), slots[SlotTypeEnum.bottomCenter].child));
}
const ParentComponent = ({
  children
}) => {
  return /*#__PURE__*/React.createElement(SlotContainer, null, children);
};
export default ParentComponent;
//# sourceMappingURL=ParentComponent.js.map