"use strict";

import { forwardRef } from "react";
import { Pressable, View } from "react-native";
import Animated from "react-native-reanimated";
import { useIOThemeContext } from "../../context";
import { IOVisualCostants } from "../../core";
import { IOColors, hexToRgba } from "../../core/IOColors";
import { IOAlertRadius } from "../../core/IOShapes";
import { IOAlertSpacing } from "../../core/IOSpacing";
import { useScaleAnimation } from "../../hooks";
import { useIOFontDynamicScale } from "../../utils/accessibility";
import { Icon } from "../icons";
import { HStack, VStack } from "../layout";
import { Body, ButtonText } from "../typography";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const ICON_SIZE = 24;
const [padding, paddingFullWidth] = IOAlertSpacing;
// COMPONENT CONFIGURATION

const mapVariantStatesLightMode = {
  error: {
    icon: "errorFilled",
    background: IOColors["error-100"],
    foreground: "error-850"
  },
  warning: {
    icon: "warningFilled",
    background: IOColors["warning-100"],
    foreground: "warning-850"
  },
  info: {
    icon: "infoFilled",
    background: IOColors["info-100"],
    foreground: "info-850"
  },
  success: {
    icon: "success",
    background: IOColors["success-100"],
    foreground: "success-850"
  }
};
const bgOpacityDarkMode = 0.2;
const mapVariantStatesDarkMode = {
  error: {
    icon: "errorFilled",
    background: hexToRgba(IOColors["error-400"], bgOpacityDarkMode),
    foreground: "error-100"
  },
  warning: {
    icon: "warningFilled",
    background: hexToRgba(IOColors["warning-400"], bgOpacityDarkMode),
    foreground: "warning-100"
  },
  info: {
    icon: "infoFilled",
    background: hexToRgba(IOColors["info-400"], bgOpacityDarkMode),
    foreground: "info-100"
  },
  success: {
    icon: "success",
    background: hexToRgba(IOColors["success-400"], bgOpacityDarkMode),
    foreground: "success-100"
  }
};
export const Alert = /*#__PURE__*/forwardRef(({
  variant,
  content,
  action,
  onPress,
  fullWidth = false,
  accessibilityHint,
  testID
}, viewRef) => {
  const {
    onPressIn,
    onPressOut,
    scaleAnimatedStyle
  } = useScaleAnimation("medium");
  const {
    dynamicFontScale,
    spacingScaleMultiplier
  } = useIOFontDynamicScale();
  const {
    themeType
  } = useIOThemeContext();
  const paddingDefaultVariant = {
    padding,
    borderRadius: IOAlertRadius * dynamicFontScale * spacingScaleMultiplier,
    borderCurve: "continuous"
  };
  const mapVariantStates = themeType === "light" ? mapVariantStatesLightMode : mapVariantStatesDarkMode;
  const renderMainBlock = () => /*#__PURE__*/_jsxs(HStack, {
    space: IOVisualCostants.iconMargin,
    allowScaleSpacing: true,
    style: {
      alignItems: "center"
    },
    children: [/*#__PURE__*/_jsx(Icon, {
      allowFontScaling: true,
      name: mapVariantStates[variant].icon,
      size: ICON_SIZE,
      color: mapVariantStates[variant].foreground
    }), /*#__PURE__*/_jsx(View, {
      style: {
        marginTop: -4 * dynamicFontScale,
        marginBottom: -4 * dynamicFontScale,
        flex: 1
      },
      children: /*#__PURE__*/_jsxs(VStack, {
        space: 8,
        allowScaleSpacing: true,
        children: [/*#__PURE__*/_jsx(Body, {
          color: mapVariantStates[variant].foreground,
          weight: "Regular",
          accessibilityRole: "text",
          children: content
        }), action && /*#__PURE__*/_jsx(ButtonText, {
          color: mapVariantStates[variant].foreground,
          numberOfLines: 1,
          ellipsizeMode: "tail",
          children: action
        })]
      })
    })]
  });
  const StaticComponent = () => /*#__PURE__*/_jsx(View, {
    ref: viewRef,
    style: [fullWidth ? {
      padding
    } : paddingDefaultVariant, {
      backgroundColor: mapVariantStates[variant].background
    }],
    testID: testID,
    accessible: false,
    accessibilityRole: "alert",
    accessibilityHint: accessibilityHint,
    children: renderMainBlock()
  });
  const PressableButton = () => /*#__PURE__*/_jsx(Pressable, {
    ref: viewRef,
    testID: testID,
    onPress: onPress,
    onPressIn: onPressIn,
    onPressOut: onPressOut,
    onTouchEnd: onPressOut
    // A11y related props
    ,
    accessible: true,
    accessibilityHint: accessibilityHint,
    accessibilityRole: "button",
    children: /*#__PURE__*/_jsx(Animated.View, {
      style: [fullWidth ? {
        padding: paddingFullWidth
      } : paddingDefaultVariant, {
        backgroundColor: mapVariantStates[variant].background
      },
      // Disable pressed animation when component is full width
      !fullWidth && scaleAnimatedStyle],
      children: renderMainBlock()
    })
  });
  return action ? /*#__PURE__*/_jsx(PressableButton, {}) : /*#__PURE__*/_jsx(StaticComponent, {});
});
//# sourceMappingURL=Alert.js.map