// @ts-nocheck
import React, { useEffect } from "react";
import CssFlex from "../../../../ui/CssFlex";
import Divider from "../../../../ui/Divider";
import getClasses from "../styles";
import TextSection from "./TextSection";
import { MIN_HEADLINES, MIN_LONG_HEADLINES, MIN_DESCRIPTIONS, MAX_HEADLINES, MAX_LONG_HEADLINES, MAX_DESCRIPTIONS } from "../../constants";
import { useTrackEvent } from "../../events";
var TabTexts = /*#__PURE__*/React.forwardRef(function (props, _ref) {
  var translations = props.translations,
      autoCampaign = props.autoCampaign,
      onSelectAssets = props.onSelectAssets,
      warnings = props.warnings,
      pressed = props.pressed,
      assetsManager = props.assetsManager,
      isLoading = props.isLoading;
  var classes = getClasses();
  var trackEvent = useTrackEvent();
  useEffect(function () {
    trackEvent({
      key: "step_assets_texts_seen"
    });
  }, [trackEvent]);
  return /*#__PURE__*/React.createElement(CssFlex, {
    direction: "column",
    gap: "xl",
    maxWidth: "582px"
  }, /*#__PURE__*/React.createElement(TextSection, {
    isLoading: isLoading,
    ref: function ref(el) {
      _ref.current.texts.headlines = el;
    },
    type: "headlines",
    items: autoCampaign.headlines || [],
    translations: translations.headlines,
    onSelectAssets: onSelectAssets,
    assets: assetsManager.filter(function (asset) {
      return asset.type === "headline";
    }),
    warning: warnings.headlines,
    pressed: pressed,
    minItems: MIN_HEADLINES,
    maxItems: MAX_HEADLINES,
    maxLength: 30
  }), /*#__PURE__*/React.createElement(TextSection, {
    isLoading: isLoading,
    ref: function ref(el) {
      _ref.current.texts.longHeadlines = el;
    },
    type: "long_headlines",
    items: autoCampaign.long_headlines || [],
    translations: translations.longHeadlines,
    warning: warnings.longHeadlines,
    pressed: pressed,
    onSelectAssets: onSelectAssets,
    assets: assetsManager.filter(function (asset) {
      return asset.type === "long_headline";
    }),
    minItems: MIN_LONG_HEADLINES,
    maxItems: MAX_LONG_HEADLINES,
    maxLength: 90
  }), /*#__PURE__*/React.createElement(Divider, {
    className: classes.divider
  }), /*#__PURE__*/React.createElement(TextSection, {
    isLoading: isLoading,
    ref: function ref(el) {
      _ref.current.texts.descriptions = el;
    },
    type: "descriptions",
    items: autoCampaign.descriptions || [],
    translations: translations.descriptions,
    warning: warnings.descriptions,
    pressed: pressed,
    onSelectAssets: onSelectAssets,
    assets: assetsManager.filter(function (asset) {
      return asset.type === "description";
    }),
    minItems: MIN_DESCRIPTIONS,
    maxItems: MAX_DESCRIPTIONS,
    maxLength: 90
  }));
});
export default TabTexts;