"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.FooterActions = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
var _context = require("../../context");
var _core = require("../../core");
var _buttons = require("../buttons");
var _Spacer = require("./Spacer");
var _useBottomMargins = require("./hooks/useBottomMargins");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/* Margin between `solid` and `variant` variant */
const spaceBetweenActions = 16;
/* Margin between `solid` and `link` variant */
const spaceBetweenActionAndLink = 16;
const styles = _reactNative.StyleSheet.create({
  buttonContainer: {
    paddingHorizontal: _core.IOVisualCostants.appMarginDefault,
    width: "100%",
    flexShrink: 0
  },
  debugText: {
    position: "absolute",
    right: 8,
    top: -16,
    color: _core.IOColors.black,
    fontSize: 9,
    opacity: 0.75
  },
  blockShadow: {
    shadowColor: _core.IOColors.black,
    shadowOffset: {
      width: 0,
      height: -4
    },
    shadowOpacity: 0.1,
    shadowRadius: 32
  }
});
const FooterActions = ({
  actions,
  excludeSafeAreaMargins = false,
  animatedStyles,
  fixed = true,
  transparent = false,
  onMeasure,
  testID,
  debugMode = false
}) => {
  const theme = (0, _context.useIOTheme)();
  const {
    bottomMargin,
    extraBottomMargin
  } = (0, _useBottomMargins.useBottomMargins)(!!actions?.secondary, excludeSafeAreaMargins);

  /* Total height of actions */
  const [actionBlockHeight, setActionBlockHeight] = (0, _react.useState)(0);

  /* Background color should be app main background
     (both light and dark themes) */
  const HEADER_BG_COLOR = _core.IOColors[theme["appBackground-primary"]];
  const TRANSPARENT_BG_COLOR = "transparent";

  /* Safe background block. Cover everything until it reaches
     the half of the primary action button. It avoids
     glitchy behavior underneath.  */
  const safeBackgroundBlockHeight = bottomMargin + actionBlockHeight - _core.buttonSolidHeight / 2;
  const getActionBlockMeasurements = event => {
    const {
      height
    } = event.nativeEvent.layout;
    setActionBlockHeight(height);
    /* Height of the safe bottom area, applied to the ScrollView:
       Actions + Content end margin */
    const safeBottomAreaHeight = bottomMargin + height + _core.IOSpacing.screenEndMargin;
    onMeasure?.({
      actionBlockHeight: height,
      safeBottomAreaHeight
    });
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
    style: [{
      width: "100%",
      paddingBottom: bottomMargin
    }, fixed ? {
      position: "absolute",
      bottom: 0
    } : {
      marginTop: _core.IOSpacing.screenEndMargin
    }, debugMode && {
      backgroundColor: (0, _core.hexToRgba)(_core.IOColors["error-500"], 0.15)
    }, animatedStyles?.mainBlock],
    testID: testID,
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
      style: [{
        ...(fixed && {
          width: "100%",
          height: safeBackgroundBlockHeight,
          position: "absolute",
          bottom: 0,
          backgroundColor: transparent ? TRANSPARENT_BG_COLOR : HEADER_BG_COLOR
        }),
        ...(fixed ? styles.blockShadow : null)
      }, animatedStyles?.background],
      pointerEvents: "none"
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: styles.buttonContainer,
      onLayout: getActionBlockMeasurements,
      pointerEvents: "box-none",
      children: [debugMode && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        style: styles.debugText,
        children: `Height: ${actionBlockHeight}`
      }), renderActions(actions, extraBottomMargin)]
    })]
  });
};
exports.FooterActions = FooterActions;
const renderActions = (actions, extraBottomMargin) => {
  if (!actions) {
    return null;
  }
  const {
    type,
    primary: primaryAction,
    secondary: secondaryAction,
    tertiary: tertiaryAction
  } = actions;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
    children: [primaryAction && /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttons.IOButton, {
      variant: "solid",
      fullWidth: true,
      ...primaryAction
    }), type === "TwoButtons" && secondaryAction && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: {
        alignSelf: "center",
        marginBottom: extraBottomMargin
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Spacer.VSpacer, {
        size: spaceBetweenActionAndLink
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttons.IOButton, {
        variant: "link",
        ...secondaryAction
      })]
    }), type === "ThreeButtons" && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [secondaryAction && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Spacer.VSpacer, {
          size: spaceBetweenActions
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttons.IOButton, {
          variant: "outline",
          fullWidth: true,
          ...secondaryAction
        })]
      }), tertiaryAction && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
        style: {
          alignSelf: "center",
          marginBottom: extraBottomMargin
        },
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Spacer.VSpacer, {
          size: spaceBetweenActionAndLink
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttons.IOButton, {
          variant: "link",
          ...tertiaryAction
        })]
      })]
    })]
  });
};
//# sourceMappingURL=FooterActions.js.map