"use strict";

import { useMemo } from "react";
import { Pressable, StyleSheet, Text, View } from "react-native";
import Animated from "react-native-reanimated";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { IOVisualCostants, enterTransitionAlertEdgeToEdge, enterTransitionAlertEdgeToEdgeContent, exitTransitionAlertEdgeToEdge } from "../../core";
import { IOColors } from "../../core/IOColors";
import { IOAlertSpacing } from "../../core/IOSpacing";
import { useScaleAnimation } from "../../hooks";
import { makeFontStyleObject } from "../../utils/fonts";
import { Icon } from "../icons";
import { Body } from "../typography";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
const iconSize = 24;
const [spacingDefault] = IOAlertSpacing;
const styles = StyleSheet.create({
  alert: {
    flexDirection: "row",
    alignItems: "flex-start",
    alignContent: "center",
    padding: spacingDefault
  }
});
// COMPONENT CONFIGURATION

const mapVariantStates = {
  error: {
    icon: "errorFilled",
    background: "error-100",
    foreground: "error-850"
  },
  warning: {
    icon: "warningFilled",
    background: "warning-100",
    foreground: "warning-850"
  },
  info: {
    icon: "infoFilled",
    background: "info-100",
    foreground: "info-850"
  },
  success: {
    icon: "success",
    background: "success-100",
    foreground: "success-850"
  }
};
export const AlertEdgeToEdge = ({
  variant,
  content,
  action,
  onPress,
  accessibilityHint,
  testID
}) => {
  const {
    onPressIn,
    onPressOut,
    scaleAnimatedStyle
  } = useScaleAnimation("slight");
  const insets = useSafeAreaInsets();
  const backgroundColor = useMemo(() => IOColors[mapVariantStates[variant].background], [variant]);
  const renderMainBlock = () => /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(View, {
      style: {
        marginRight: IOVisualCostants.iconMargin,
        alignSelf: "center"
      },
      children: /*#__PURE__*/_jsx(Icon, {
        name: mapVariantStates[variant].icon,
        size: iconSize,
        color: mapVariantStates[variant].foreground
      })
    }), /*#__PURE__*/_jsx(View, {
      style: {
        flex: 1
      },
      children: /*#__PURE__*/_jsxs(Body, {
        color: mapVariantStates[variant].foreground,
        weight: "Regular",
        accessibilityRole: "text",
        children: [content, action && /*#__PURE__*/_jsx(Text, {
          style: {
            ...makeFontStyleObject(16, "TitilliumSansPro", undefined, "Bold"),
            color: IOColors[mapVariantStates[variant].foreground]
          },
          children: ` ${action}`
        })]
      })
    })]
  });
  const PressableButton = () => /*#__PURE__*/_jsx(Pressable, {
    testID: testID,
    onPress: onPress,
    onPressIn: onPressIn,
    onPressOut: onPressOut,
    onTouchEnd: onPressOut
    // A11y related props
    ,
    accessible: true,
    accessibilityHint: accessibilityHint,
    accessibilityRole: "button",
    children: /*#__PURE__*/_jsx(Animated.View, {
      entering: enterTransitionAlertEdgeToEdgeContent,
      style: [styles.alert, scaleAnimatedStyle],
      children: renderMainBlock()
    })
  });
  const StaticComponent = () => /*#__PURE__*/_jsx(Animated.View, {
    entering: enterTransitionAlertEdgeToEdgeContent,
    style: styles.alert,
    testID: testID,
    accessible: false,
    accessibilityRole: "alert",
    accessibilityHint: accessibilityHint,
    children: renderMainBlock()
  });
  return /*#__PURE__*/_jsx(Animated.View, {
    entering: enterTransitionAlertEdgeToEdge,
    exiting: exitTransitionAlertEdgeToEdge,
    style: {
      paddingTop: insets.top,
      backgroundColor
    },
    children: action ? PressableButton() : StaticComponent()
  });
};
//# sourceMappingURL=AlertEdgeToEdge.js.map