"use strict";

import { Fragment } from "react";
import { Image, StyleSheet, View } from "react-native";
import { TouchableWithoutFeedback } from "react-native-gesture-handler";
import LinearGradient from "react-native-linear-gradient";
import Animated, { useAnimatedStyle } from "react-native-reanimated";
import { useIOTheme } from "../../context";
import { IOAccordionRadius, IOColors } from "../../core";
import { useAccordionAnimation } from "../../hooks/useAccordionAnimation";
import { Icon } from "../icons";
import { Divider } from "../layout";
import { ListItemCheckbox, ListItemInfo } from "../listitems";
import { H6 } from "../typography";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const accordionBodySpacing = 16;

// Threshold to determine when the accordion is considered fully collapsed
const COLLAPSED_RADIUS_THRESHOLD = 0.001;

// Border width offset to ensure gradient fits within the border curves
const COLLAPSIBLE_BORDER = 1;
export const ClaimsSelector = ({
  title,
  items,
  defaultExpanded,
  onItemSelected,
  onToggle,
  accessibilityLabel,
  selectedItemIds,
  selectionEnabled = true,
  headerGradientColors
}) => {
  const theme = useIOTheme();
  const {
    expanded,
    toggleAccordion,
    onBodyLayout,
    iconAnimatedStyle,
    bodyAnimatedStyle,
    bodyInnerStyle,
    progress
  } = useAccordionAnimation({
    defaultExpanded
  });
  const accordionBackground = theme["appBackground-primary"];
  const accordionBorder = theme["cardBorder-default"];
  const onItemPress = () => {
    toggleAccordion();
    onToggle?.(!expanded);
  };
  const hasHeaderGradient = headerGradientColors && headerGradientColors.length >= 2;
  const headerForegroundColor = hasHeaderGradient ? "black" : theme["textBody-default"];
  const headerRadiusAnimatedStyle = useAnimatedStyle(() => {
    /**
     * Dynamically adjust bottom corner radius based on the expansion progress.
     * Bottom corners are rounded only when the accordion is fully collapsed to
     * ensure visual consistency with the outer container.
     */
    const bottomRadius = progress.value < COLLAPSED_RADIUS_THRESHOLD ? IOAccordionRadius : 0;
    return {
      borderTopLeftRadius: IOAccordionRadius - COLLAPSIBLE_BORDER,
      borderTopRightRadius: IOAccordionRadius - COLLAPSIBLE_BORDER,
      borderBottomLeftRadius: bottomRadius - COLLAPSIBLE_BORDER,
      borderBottomRightRadius: bottomRadius - COLLAPSIBLE_BORDER,
      overflow: "hidden"
    };
  });
  const renderClaimItem = (item, index) => {
    const {
      id,
      value,
      description,
      type = "text",
      endElement
    } = item;
    return /*#__PURE__*/_jsxs(Fragment, {
      children: [index !== 0 && /*#__PURE__*/_jsx(Divider, {}),
      // We do not support checkbox selection for images, as it is not needed now
      selectionEnabled && type === "text" ? /*#__PURE__*/_jsx(ListItemCheckbox, {
        value: value,
        description: description,
        selected: selectedItemIds?.includes(id),
        onValueChange: onItemSelected ? selected => onItemSelected(item, selected) : undefined
      }) : /*#__PURE__*/_jsx(ListItemInfo, {
        value: type === "image" ? /*#__PURE__*/_jsx(Image, {
          source: {
            uri: value
          },
          style: styles.imageClaim,
          resizeMode: "contain",
          accessibilityIgnoresInvertColors: true
        }) : value,
        label: description,
        accessibilityRole: type,
        reversed: true,
        endElement: endElement
      })]
    }, id);
  };
  return /*#__PURE__*/_jsxs(View, {
    style: [styles.accordionWrapper, {
      backgroundColor: IOColors[accordionBackground],
      borderColor: IOColors[accordionBorder]
    }],
    children: [/*#__PURE__*/_jsx(TouchableWithoutFeedback, {
      accessible: true,
      accessibilityRole: "button",
      accessibilityState: {
        expanded
      },
      accessibilityLabel: accessibilityLabel ?? title,
      onPress: onItemPress,
      children: /*#__PURE__*/_jsxs(Animated.View, {
        style: [styles.textContainer, headerRadiusAnimatedStyle],
        children: [hasHeaderGradient && /*#__PURE__*/_jsx(LinearGradient, {
          colors: headerGradientColors,
          style: StyleSheet.absoluteFill
        }), /*#__PURE__*/_jsx(H6, {
          color: headerForegroundColor,
          children: title
        }), /*#__PURE__*/_jsx(Animated.View, {
          style: iconAnimatedStyle,
          children: /*#__PURE__*/_jsx(Icon, {
            name: "chevronBottom",
            color: headerForegroundColor
          })
        })]
      })
    }), /*#__PURE__*/_jsx(Animated.View, {
      style: bodyAnimatedStyle,
      children: /*#__PURE__*/_jsx(View, {
        style: [bodyInnerStyle, styles.bodyInnerContainer],
        onLayout: onBodyLayout,
        children: items.map(renderClaimItem)
      })
    })]
  });
};
const styles = StyleSheet.create({
  accordionWrapper: {
    borderWidth: 1,
    borderRadius: IOAccordionRadius,
    borderCurve: "continuous"
  },
  textContainer: {
    padding: accordionBodySpacing,
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "space-between"
  },
  bodyInnerContainer: {
    width: "100%"
  },
  imageClaim: {
    width: 160,
    aspectRatio: 3 / 4
  }
});
//# sourceMappingURL=ClaimsSelector.js.map